تغییر رابط کاربری دیجی کالا؛ خوب، بد یا زشت؟

این مقاله به بررسی تغییرات جدیدترین رابط کاربری دیجی کالا که کمتر از چند روز از تغییر آن می گذرد میپردازد.

بیشتر از یک ماه از ارائه من در رابطه با "تاثیر طراحی بهینه رابط گرافیکی کاربر در صفحات وب" با بررسی موفق ترین وبسایت های فارسی زبان نمی گذشت که بعد از مراجعه به وبسایت «دیجی کالا» بزرگترین مارکت فروش اینترنتی کشور با پیغامی اعلام کرد که سایت چند ساعتی از دسترس خارج هست و بعد از اون با تغییرات خیلی خوبی برمیگردن!

فردای اون روز هرکسی که به وبسایت مراجعه میکرد متوجه می شد که دیجی کالا با یک عمل جسورانه و حرفه ای رابط کاربری خودش رو تغییر داده.

اگر هنوز ذهنتان درگیر عنوان این نوشته است باید خیالتون رو راحت کنم که این مقاله به هیچوجه به جواب زشت ختم نخواهد شد :)

تقریباً اکثریت کسانی که به وبسایت رجوع میکردند با رضایت خیلی بیشتری با وبسایت مواجه می شدند.این موضوع دلایل خیلی مختلفی داشت که توی این نوشته سعی میکنیم ابعاد مختلفش رو با هم بررسی بکنیم.

خداحافظ ASPجان!

اولین موردی که شاید از موضوع مقاله ما دور باشه ولی خوب یکی از مهم ترین پارامتر ها هست تغییر زبان توسعه back-end «دیجی کالا» ست.تغییری که میشه گفت تقریباً جسورانه ترین تغییر در تغییرات اخیر بوده و در عین اینکه اصلاً برای مخاطب عادی قابل درک نیست ولی نکته بسیار مهمی است.تعداد زیادی از کاربران در دید اول از افزایش سرعت وبسایت میگفتند که خب نتیجه همین تغییر زبان توسعه وبسایت هست.همونطوری که خیلی از شما میدونید دیجی کالا تقریباً بزرگترین وبسایت استفاده کننده از asp.net بود و توسعه دهندگان این زبان به نسبت قدیمی اما پراستفاده همیشه برای مثال از مزایای زبان خودشون به دیجی کالا می بالیدند! اما بعد از تغییر اخیر تقریباً اونها مهم ترین حامیشون رو از دست دادند D:

دیجی کالا اونها رو تنها گذاشت و تصمیم گرفت ادامه راهش رو با یه زبون پراستفاده و قدیمی دیگه یعنی php بره.تغییری که شاید برای مخاطب عادی اهمیت خیلی پایینی داشته باشه ولی قطعاً ماه ها زمان برده تا به ثمر نشسته و مشخصاً نتیجه تلاش چندین برنامه نویس و توسعه دهنده حرفه ای بوده.بعلاوه اینکه پوشش این حجم از خدمات و امکانات وبسایتی به بزرگی دیجی کالا با انتقال از یک زبان به زبان دیگه کاری است که نمونه مشابه اون رو تا به حال در وبسایت های فارسی زبان نداشتیم.نکته آخر اینکه در بررسی های اولیه هیچ یک از امکانات قبلی دیجی کالا در نسخه جدید وبسایت از قلم نیافتاده و از این بابت تیم دیجی کالا بسیار قوی نشون داده و همین که عمده کاربران وبسایت هیچ کمبود و یا تغییر عمده ای در پشت زمینه وبسایت به غیر از بهبود سرعت لودینگ وبسایت درک نکردند تائید همین امر هست.

در مرحله بعد بررسی اما به بحث تغییر گرافیکی وبسایت و تغییر رابط کاربری دیجی کالا می پردازیم.بحثی که برخلاف بحث قبل برای همه قابل درک و تشخیص بود و از همون لحظه اول کاربران به نقد و بررسی و قضاوت اون پرداختند.

به استقبال تغییرات به روز و چشمگیر

از اصلی ترین تغییرات قالب ظاهری دیجی کالا تمام صفحه شدن طراحی وبسایت یا همون fluid شدن ظاهر سایت بود.متد طراحی fluid از متدهای تقریباً جدید و نوپای وبسایت ها هست و در عین اینکه انتخاب اون برای وبسایت شهامت میخواد ولی مزایای خیلی مناسب و خوب اون باعث شد تیم حرفه ای و خلاق رابط و تجربه کاربری دیجی کالا اون رو انتخاب کنند

تقریباً میشه گفت دیجی کالا اولین وبسایت بزرگ fluid design فارسی زبان هست.البته وبسایت «مدیسه» دیگر فروشگاه اینترنتی کشور هم از یک سال پیش طراحی fluid design رو برای وبسایتش انتخاب کرده بود ولی دیجی کالا وبسایتی به مراتب بزرگتر و باتجربه تر بود و چنین تغییری در ظاهر وبسایت ممکن بود در کوتاه مدت باعث نارضایتی بخشی از کاربران بشه که البته این اتفاق نیافتاد و چنین تغییری به مذاق اکثر کاربران وبسایت هم خوش اومد.هرچند پیشنهاد شخصی من استفاده از 98درصد از صفحه برای نمایش محتوا به جای 100درصد هست که البته تغییر با اولویت بالایی نیست اما به نمایش بهتر وبسایت منجر می شود.

نکته دیگه اینکه دیجی کالا سال 2011 هم از متد تمام صفحه کردن وبسایت استفاده کرد ولی بعد از مدتی مجدداً به روال همیشگی و پرکاربرد fixed-width برگشت.

حالا متد طراحی fluid چی هست و چرا دیجی کالا باید چنین تغییری رو اعمال میکرد؟

متد fluid دیزاین متدی نوپاست که در سال 2015 توسط Ethan Marcotte در کتاب responsive design patterns & principles پیشنهاد داد و بعدها تحت عنوان fluid design مطرح و مورد استقبال بخشی از وبسایت های مطرح دنیا قرار گرفت.بعد از مدتی تقریباً همه مارکتینگ های اینترنتی بین از Amazon تا Bestbuy رو به این متد آوردند و باتوجه به مزیت های آن هم این حمایت موجه به نظر می رسد.

مزیت های این متد برای فروشگاه های اینترنتی:

• وبسایت های تجارت الکترونیک به تصاویری غنی متکی هستند و fluid design اجازه استفاده از تصاویر بزرگتر را می دهد.
• وب سایت های فروشگاهی دارای صدها محصول برای نمایش هستند ، و عرض کامل fluid به آنها فضای بسیار بهتری برای نمایش میزان بیشتری از آنها ارائه می کند.
• این وبسایت ها به ندرت دارای خطوط طولانی متن هستند که نیاز به فضایی برای تقسیم بندی صفحه دارند.
• متد طراحی fluid ارائه یک تجربه تمیز و همه جانبه است.
• سیستم نمایشی grid که به تازگی ایجاد و توسعه یافته کمک بسیار زیادی به توسعه متد fluid میکند و باعث راحتی و بهینه شدن استفاده از آن شده است.
• این متد برای کاربران قدیمی تغییری ایجاد نمیکند و به کاربران با سیستم های جدیدتر و صفحه های نمایش بزرگتر دید بیشتر و بهتری دارند و عملاً شما کاربری از دست نمی دهید و باعث افزایش رضایت کاربری می شوید.

همه این موارد درکنار هم باعث میشوند fluid design بهترین انتخاب برای فروشگاه های اینترنتی یا همان وبسایت های e-commerce باشند.

البته بحث های بسیار گسترده و با موارد مختلفی در زمینه تفاوت های این متد با دیگر متدها و اینکه کدامیک بهترند بین کارشناسان مختلف مطرح هستند و ممکن است برای انواع دیگر وبسایت متدهای دیگری بهتر باشند ولی برای وبسایت های فروشگاهی میتوان گفت این انتخاب انتخاب هوشمندانه تر و موفق تری حداقل تا امروز هستند.

سَبک طراحی

دیگر تغییر در ظاهر دیجی کالا منحصر به سبک طراحی جدید وبسایت یعنی سبک متریال دیزاین هست.البته این سبک قبلاً هم توسط دیجی کالا دنبال میشد در برخی از بخش ها ولی با ظاهر جدید بیش از پیش دیجی کالا به این سبک رو آورد و همه بخش های خودش رو برمبنای این سبک بازطراحی کرد.

متدی که اصلی ترین توسعه دهنده و حامی اون گوگل هست و در همه تولیدات و محصولات گوگل به چشم میاد و شرکت های دیگر نیز از آن استقبال کردند و از ترندهای چند سال اخیر بود.برای آشنایی بیشتر با متریال دیزاین خوندن این لینک رو بهتون پیشنهاد میکنم.

در بخش های مختلف وبسایت میتوانیم استفاده موفق از سبک طراحی متریال دیزاین رو مشاهده بکنیم و اصلی ترین نمود این استفاده در برگه های مختلف و خاص وبسایت که با Card View طراحی شده بودند دیده میشه.

از دیگر نشانه ها و طراحی های دیجی کالا برمبنای سبک طراحی متریال دیزاین میتوان به border-radius محدود و کم اما قابل توجه در برگه های مختلف اشاره کرد.

رنگ های خاص و منحصر به فرد متریال دیزاین هم که در جای جای وبسایت واضح هستند.

و بالأخره تغییر فونت قدیمی!

دیگر تغییر وبسایت دیجی کالا که مدت ها همه در انتظار اون بودند تغییر فونت وبسایت بود تغییری که به به روز بودن و چشم نواز بودن وبسایت کمک بسیار زیادی می کرد اما تا مدت ها دیجی کالا به آن بی توجه بود و یا اینکه برای هماهنگی با کل وبسایت منتظر چنین روزی بود تا در کنار المان های دیگر فونت را هم تغییر بدهد.

فونت قبلی دیجی کالا یکان بود که قدمت بسیار بالا و از زیباترین قلم های قدیمی تایپوگرافی فارسی بود اما اشکالات عمده بخاطر قدیمی بودن بخصوص در نمایش وب و نسخه وب اون باعث شده بود که دیگر استقبال سابق از آن نشود و جای خودش رو به فونت های دیگر بدهد.

بعد از مدتی تیم فونتیران فونت یکان رو با ادغام با فونت ایران سنس که پراستفاده ترین و موفق ترین فونت سالهای اخیر وبسایت های فارسی بود به فونت ایران یکان تبدیل کردند که مورد استقبال مخاطبین وب فارسی قرار گرفت تا جایی که تبدیل به دومین فونت پراستفاده فارسی در وبسایت های موفق شد.

دیجی کالا هم با استقبال از این فونت نشان داد برای مخاطبان خودش ارزش قائله و به استفاده از ابزارهای موفق و به روز مقیده.

جمع بندی

در پایان با بررسی ۴ المان کاربردی در وبسایت دیجی کالا به ارزش یابی تغییرات گسترده رابط کاربری جدید دیجی کالا پرداختیم که در مجموع دیجی کالا و تیم موفق و باهوش ui/uxش نمره قابل قبول و موفق در همه موارد کسب میکنند و می توان گفت به آینده این وبسایت و مهم تر از اون وب فارسی میتوان امیدوار بود.

البته پیداشدن نواقص و همچنین کمبود های ui فعلی مدتی طول میکشه و نمیتوان گفت همه تغییرات فعلی مناسب و موفق خواهند بود اما میتوان نتیجه گرفت دیجی کالا بهترین عملکردی که میتوانست رو در این تغییرات به نمایش گذاشت و درحال حاضر فقط مزایای این تغییرات به چشم می آید و به همین دلیل این مقاله تقریباً در تحسین تغییرات فعلی رابط کاربری دیجی کالا به پایان رسید.

به امید روزهای موفق و درخشان وب فارسی و تیم های رابط و تجربه کاربری ایرانی :)