۴۷ درس کلیدی برای طراحان UI و UX [بخش ۴]

47 key lesson for ui ux designers

۳۱. نادیده گرفتن زمینه کاربر

| image 65

عوامل زمینه ای مختلفی وجود دارد که هنگام تعامل با یک رابط در رفتار کاربر تأثیر می گذارد. در نظر بگیرید که کاربر هنگام استفاده از برنامه ما کجاست، چه مدت زمان دارد و وضعیت عاطفی او چیست.

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

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

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

بهترین راه برای اطمینان از متناسب بودن رابط کاربری و UX با زمینه کاربر، آزمایش آن در شرایط احتمالی مورد استفاده کاربر است و آزمایش آن با کاربران.

Shopify یک مقاله عالی در مورد طراحی با توجه به زمینه کاربر دارد که من به همه کسانی که علاقه مند به عمیق‌تر شدن در این موضوع هستند توصیه می کنم.

۳۲. تمرکز زیادی بر روی اینکه چطور به نظر می آید، نه چطور کار می کند

تصویر برای ارسال

کاری که هر طراح UI از انجام آن متنفر است، تکه‌پاره کردن طرح هایش است.

شکستن یک طرح اساساً به معنای ورود داده هایی است که باعث از بین رفتن طرح یا جذابیت هنری رابط می‎شود. انجام این کار برای یک طراح ممکن است ناخوشایند باشد اما برای طراحی یک محصول انعطاف‌پذیر، مقیاس پذیر و کاربرپسند یک مولفه اساسی است.

وقتی موکاپی که به بخش تولید فرستادم یک اسم شش حرفی دارد، احتمالاً عالی به نظر می رسد، اما وقتی هوبرت بلین ولفسشلگلشتاین هاوزنبرگردورف پدر بزرگ سعی می کند از این برنامه استفاده کند چه اتفاقی می‎افتد؟

طراحی ها را به ورطه امتحان گذارید و در حین طراحی یک قدم به عقب بردارید تا اطمینان حاصل کنید که رابط کاربری می تواند با تنوع موارد استفاده متناسب باشد، نه فقط موارد ایده آل.

۳۳. نادیده گرفتن طراحی حالتها

تصویر برای ارسال

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

ما باید تمام حالات مختلف ممکن از جمله خطا، موفقیت، فعال، غیرفعال، شناور، خالی، پر، بارگذاری [که این تعدادی از آنها است] را در نظر بگیریم.

برای مثال، اگر من یک لیست تمایل (wishlist) را طراحی می کردم، لازم بود قبل از اینکه کاربر چیزی به لیست تمایل خود اضافه کند، این حالت را در نظر بگیرم: حالت خالی. بدون این حالت شکافی در تجربه وجود خواهد داشت.


| image 66

برداشت های قابل توجه از دستورالعمل های طراحی IOS.

مقاله اصلی – ۱۰ دیدگاه از راهنمای طراحی رابط انسانی اپل

۳۴. ورود به سامانه را تا حد امکان به تأخیر بیندازید

| image 67

«مردم معمولاً وقتی مجبور به ورود به سامانه می شوند قبل از انجام هر کار مفیدی برنامه ها را رها می کنند. قبل از تعهد در برابر برنامه، به آنها فرصتی بدهید تا عاشق آن شوند. در یک برنامه خرید، به افراد اجازه دهید کالاهای شما را بلافاصله بعد از راه‌اندازی مرور کنند و فقط هنگامی که آماده خرید هستند، باید برای ورود به سامانه ملزم شوند. در یک برنامه پخش جریانی رسانه (media-streaming)، به افراد اجازه دهید محتوای شما را کاوش کنند و قبل از ورود به سامانه برای پخش، ببینند چه ارائه می دهید.» – دستورالعمل های احراز هویت اپل

اپل از ما می خواهد که تجربه ورود به برنامه خود را دوباره ارزیابی کنیم. در صورت امکان ورود به و ثبت نام در سامانه را کاملاً حذف کنید.

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

ایده خوب دیگر این است که شیوه های مختلفی از ثبت نام را برای یکپارچه سازی ورود به سامانه معرفی کنید. برنامه ای که اکنون روی آن کار می کنم از تکمیل خودکار گذرواژه، ورود به Facebook، ورود به سامانه Google، ورود به سامانه با Apple و ایمیل پیش فرض + گذرواژه پشتیبانی می کند.

۳۵. محتوا را در اسرع وقت نشان دهید

| image 68

با صفحه پاششی (splash screen) اشتباه گرفته نشود، صفحه راه‌اندازی صفحه ای است که عناصر موجود در صفحه را معرفی می کند. صفحه راه‌اندازی را طوری طراحی کنید که تقریباً مشابه صفحه اول برنامه شما باشد.

«اگر عناصری را بگنجانید که وقتی راه‌اندازی برنامه به اتمام رسید متفاوت به نظر آیند، افراد بین صفحه راه‌اندازی و صفحه اول برنامه یک فلش ناخوشایند خواهند داشت، همچنین، مطمئن شوید که صفحه راه‌اندازی شما با حالت ظاهر فعلی دستگاه مطابقت داشته باشد. برای راهنمایی، به حالت تاریک مراجعه کنید.» – دستورالعمل های صفحه راه‌اندازی کنید

«قبل از دیدن صفحه مورد انتظار، مردم را منتظر بارگذاری محتوا نکنید. صفحه را بلافاصله نشان دهید و از جانمایی متنی، گرافیکی یا انیمیشنی استفاده کنید تا مشخص کنید که محتوا در کجا هنوز در دسترس نیست. با بارگیری محتوا این جانمایی عناصر را جایگزین کنید. در صورت امکان، محتوای آینده را در پس زمینه بارگیری کنید، مانند زمانی که یک انیمیشن در حال پخش است یا کاربر در یک سطح یا منو در حال حرکت است.» – دستورالعمل های بارگیری اپل

۳۶. نیاز به کمک را پیش بینی کنید

| image 69

“فعالانه به دنبال مواقعی باشید که افراد ممکن است گیر بیفتند. به عنوان مثال یک بازی می تواند نکات مفیدی را در صفحه مکث یا موقعی که شخصیت پیشروی نمی کند نشان دهد. در صورتی که افراد بار اول چیزی را از دست دادند، اجازه دهید آموزشها را دوباره پخش کنند.» – دستورالعمل های معماری برنامه اپل

افزودن نکات سریع، گفتگوی خدمات دهی به مشتری، بات های چت، سوالات متداول، مرکز راهنمایی و موارد دیگر مواردی را برای کاربرانی که ممکن است گیج شوند، ایجاد می کند.

در برنامه ای که ایجاد می کنم، در چند مورد آیکون هایی برای راهنمایی وجود دارد که به کاربر در مورد معنی اقدامات آموزش می دهد. این رابط من را تمیز نگه می دارد اما گزینه ای را هم برای یادگیری بیشتر در موقع لزوم فراهم می کند.

۳۷. در صورت لزوم، به افراد کمک کنید تا از نابودی اطلاعات جلوگیری کنند

| image 70

«صرف نظر از اینکه افراد از حرکت رد کردن (dismiss gesture) یا دکمه برای بستن صفحه استفاده می کنند، اگر این کار منجر به از بین رفتن محتوای تولید شده توسط کاربر شود، یک صفحه اقدام (action sheet) ارائه دهید که شرایط را توضیح داده و به کاربران روش های حل آن را توضیح می دهد.» – دستورالعمل های ماهیتی اپل

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

۳۸. اطلاعات حساس، شخصی یا محرمانه را در اعلان نمایش ندهید

| image 71

“شما نمی توانید پیش بینی کنید که افراد هنگام دریافت اعلان در حال انجام چه کاری هستند، بنابراین ضروری است که از درج اطلاعات خصوصی که می توانند بر روی صفحه دستگاه نشان داده شوند خودداری کنید.” – دستورالعمل های اطلاع رسانی اپل


| image 72

رفتارهای متداولی که مردم در ارتباط با طراحی محصول از خود بروز می‎دهند.

مقاله اصلی – ۱۰ الگوی رفتاری برای طراحی UX

۳۹. اکتشاف ایمن

| image 73

«بگذارید بدون گم شدن یا به دردسر افتادن، کاوش کنم.»

«وقتی کسی علاقه مند است یک رابط را کاوش کند و عواقب ناگواری را متحمل نشود، به احتمال زیاد بیشتر یاد خواهد گرفت -و احساس مثبت تری نسبت به آن پیدا می کند- از شخص دیگری که کاوش نمی کند. نرم‌افزار خوب به مردم این امکان را می دهد که چیزهای ناآشنا را امتحان کنند، پشت سر بگذارند و چیز دیگری را امتحان کنند، همه را بدون استرس.»

برخلاف دنیای واقعی، رابط ها برطرف کردن اشتباهات کاربران را برای آن ها آسان می کنند. اگر در دفتر کار هستید و قهوه روی لباستان چپه می شود به نوعی نابود شده اید – نمی توانید آن را CTRL + Z کنید. در مقابل، طراحی‎های رابط ما باید کاربران را ترغیب کند تا گزینه های مختلف موجود را جستجو کنند و سپس به آنها اجازه دهد تا به همان جایی که شروع کرده اند برگردند و یا اعمال را به راحتی بازگردانی کنند.

مثال ها:

  • دکمه های برگشت باعث می شود که به راحتی بتوانم برگردم به همان جایی که شروع کردم
  • فیلترهای عکس را امتحان می کنم اما اگر نتیجه را دوست نداشتم باطل کردن (undo) آن آسان است
  • ذخیره تاریخچه (history)
  • دکمه های واگرد (Undo) برای اسناد

۴۰. لذت فوری

| image 74

«می خواهم چیزی را همین حالا محقق کنم، نه بعدا.»

“مردم دوست دارند نتایج فوری اقدامات خود را ببینند – این طبیعت انسانی است. اگر کسی شروع به استفاده از برنامه ای کند و در چند ثانیه اول «تجربه موفقی» به دست‌آورد، این لذت آور است! حتی اگر بعداً مشکل تر شود، احتمال ادامه استفاده از آن بیشتر خواهد بود. آنها نسبت به برنامه احساس اعتماد به نفس بیشتری می کنند و نسبت به خودشان اعتماد به نفس بیشتری دارند.

در دنیای دیجیتالی که به سرعت در حال پیشرفت است، همه چیز خیلی سریعتر و آسان تر می شود. گرسنه هستید؟ سفارش غذا در ۳۰ دقیقه یا کمتر می تواند در محل شما باشد. نیاز به سواری دارید؟ Uber فقط چند دقیقه فاصله دارد. و این لیست ادامه دارد …

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

مثال ها:

  • یک صدای شیپور از Confetti هنگامی که عادت خود را کامل می کنید
  • تماس با Uber و داشتن فوری یک سرویس در راه
  • زدن دکمه تعویق زنگ بیدار باش
با امتیازتان ما را سر حال بیاورید
میانگین: ۰

توسط حسین مرتضوی فر

من کارشناسی معماری دارم. حدود سال 92 بود که متوجه شدم که به کد نویسی و علوم رایانه علاقه مندم. بنابراین شروع به یادگیری جاوا و برنامه نویسی برای اندروید کردم. سپس به ارتقاء مهارت های خود پرداخته و در دانشگاه فردوسی شروع به تحصیل در رشته هوش مصنوعی کردم. در ضمنِ این کار، به علاقه ام یعنی زیباسازی همه چیز ادامه دادم و آن را با تبدیل شدن به طراح UI و UX به پایان رساندم. من اکنون یک طراحم که از سال 97 در حال انجام این کار هستم و به ارتقاء مهارت هایم می پردازم

دیدگاهی بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *