این تصور من از کاربران در طول جلسات تست کاربری است که بلند فریاد می زنند، ” وای آیکن های روی صفحه بسه دیگه اینقدر حرکت نکنید.” جابجایی کنترلرهایی که کاربران استفاده می‌کنند اصلاً برایشان خوشایند نیست. ما باید برای این جابجایی دلایل واقعاً خوبی داشته باشیم. این مقاله شرحی است بر طراحی دوباره آیکن ۸، مطالعات کاربری ما، تکرارها و تبادلات.
به مبحث جستجوی محصول خوش آمدید. ما نسخه بتا را منتشر کردیم تا شما آن را مورد بررسی قرار دهید.
خیلی خوب است که باور داشته باشید
وقتی که کاربران کلیک می کنند، ما همه نتایج بدست آمده را به تحلیل گر گوگل میفرستیم.
بعد این موضوع یک حس عجیبی ما را وادر به جستجوی یک توضیح ناخوشایند کرد.
من این ایده عالی را از دوستانم گرفتم. ایده‌ایی که هیچ طراحی نباید بخاطر مصاحبه کاری‌اش آن را از دست بدهد.
جدا از مبحث فرمول، هر چه آیکن مورد نظر نزدیک‌تر باشد بهتر است. اپلیکیشن ما کاربران را وادار به جستجو در صفحه
کامپیوتر می‌کند و این مسئله مهم موجب خروج کاربران از سایت ما می‌شود. در واقع اپیلیکیشن قدیمی ما کاربران را وادار به رفت و آمد در سمت راست و چپ صفحه می‌کرد که این مسئله موجب خستگی کاربران و در نهایت خروج آنها از سایت می‌شد.
راه حل
راه حل آسان است. آنها را کاملاً نزدیک به صفحه قرار دهید. تصاویر گوگل طی سالها این گونه بوده‌اند
مشکل: کلیک‌های کم
با نگاهی اجمالی به آمارها این سوال برایم پیش آمد که چرا کاربران صفحات آیکن ۸ را سه بار کمتر از وب‌سایت‌های رقبا مرور می کنند.
فرضیه‌ها
من گیج شده بودم، منظورم اینه که من چندین برداشت متفاوت داشتم:
• مردم می‌توانند آیکن‌های مورد نیاز خود را در وبسایت ما سریعتر پیدا کنند.
• ما یک اپلیکیشن پویا داریم بنابراین صفحه ما را ترک نمی‌کنند.
تصاویر گوگل نسخه بزرگ تصویر را بسیار بزرگتر نشان می‌دهد. من پیشنهاد می‌کنم اطلاعات متا را نزدیک‌تر به تصاویر بزرگ قرار دهیم.
مسئله این است که تصاویر گوگل عملکرد محدودی دارد در حالی که آیکن ۸ در بردارنده طیف وسیعی از موضوعات است.
• رنگ آمیزی دوباره
• استفاده از باکس‌ها و حلقه‌ها
• اضافه کردن فاصله
• اضافه کردن متن و پوشش (مثل بعلاوه کوچک)
• دانلود کردن با فرمت‌های گوناگون
• تغییر سایز آیکن‌های مشابه (مثل تغییرات آیکن خانه)
• آیکن‌های مشابه در مدل‌های گوناگون (مثل آیکن خانه در مدل ios ، متریال و غیره)
• مولد HTML
• کار با مجموعه‌ها
• ساخت فونت
فاصله گذاشتن بین آیکن‌ها
همیشه یک گزینه برای جابجایی عملکردها وجود دارد.
• دیالوگ باکس
• بخش‌های گسترش یافته
• منوهای آکوردئونی
• منوهای برگری
مسئله این است که کاربران انتظار چنین عملکردهایی را ندارند بنابراین به دنبال آن نیستند، در نتیجه طبق تئوری کاوش اطلاعات، آنها بازبینی جزئیات بیشتر را مورد توجه قرار نمی‌دهند.
ما قبلاً این عملکردها را پنهان می‌کردیم، من درد فیزیکی کاربران را در حین مطالعات کاربری احساس کردم. آنها تلاش می‌کردند یک فونت جدید بسازند در حالی که تنها دو کلیک با آن فاصله داشتند.
خلاصه اینکه ما باید به اندازه کافی به شما راهکار ارائه دهیم، امّا در عین حال باید تا حدی پنهان کاری هم داشته باشیم.
طراحی دوباره
در اینجا اوّلین نسخه طراحی جدید را بعد از چندین مرتبه تکرار ارائه می‌دهیم.
این آیکن‌ها علاوه بر ویژگی های جدید دارای سبک جدید بصری نیز هستند. ویژگی بصری جدید، لوگوی جدید، رنگ جدید، تایپوگرافی جدید و تقریباّ همه چیز جدید.
مجموعه‌ها
پس از برگزاری چند جلسه قابلیت کاربری، متوجه مشکل دیگری شدیم، وقتی که ما از کاربران خواستیم چند آیکون را بردارند و یک مجموعه بسازند، آنها آیکن‌هایی از مدل‌های گوناگون برداشتند بدون اینکه ذره‌ایی به این موضوع توجه کنند. آنها از کار خود راضی بودند در حالی که ما شدیداً آشفته شدیم درست مثل اینکه یک کلمه را با فونت‌های مختلف بنویسند.
آیکن‌های چند خط
در طراحی قدیمی آیکن‌های مدل‌های متفاوت را هم سایز و شبیه هم می‌کردند.
این مسئله یک مجموعه را به چندین خط تقسیم می‌کرد و مقایسه آنها را دشوار. بنابراین ما مجموعه‌ها را افقی ساختیم.
یک خط تنها، مقایسه آیکن‌ها را آسان‌تر می‌کند. علاوه بر این، ما آیکن‌ها را با سایز اصلی‌شان نشان داده‌ایم.
آیکن‌های کوچک، کوچک هستند و آیکن‌های بزرگ، بزرگ.
منبع: icons8.com
