طراحی UX برای موبایل: راهنمای کامل متخصصین 2020

طراحی UX برای موبایل: راهنمای کامل متخصصین 2020

طراحی UX برای موبایل: راهنمای کامل متخصصین 2020

طراحی UX برای موبایل: راهنمای کامل متخصصین 2020

“طراحی فقط آن چیزی نیست که به نظر می رسد و احساس می شود.

طراحی نحوه کارکرد آن است.” – استیو جابز

20 سپتامبر 2020 ، توسط Annemarie Bufe

یک ایده عالی به تنهایی باعث ایجاد یک طراحی عالی نمی شود.

Mobile UX (= تجربه کاربری) و طراحی برنامه شما به همان اندازه برای موفقیت مهم هستند.

در این مقاله، شما با اصول طراحی یک برنامه عالی آشنا می شوید

که باعث جذاب بودن برای کاربران شما می شود.

طراحی UX موبایل چیست؟

Mobile UX شامل تجربه ذهنی کاربر از یک برنامه تلفن همراه است. این شامل تجربیات خوب و بد و همچنین احساسات است.

طراحی UX فرآیند ایجاد محصولی است که تعامل با آن لذت بخش است و تجربه ای معنی دار و مرتبط را ارائه می دهد.

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

تجربه کاربری (UX) و رابط کاربری (UI) را با هم ترکیب نکنید. تعامل هر دو بسیار نزدیک با یکدیگر است ، اما یکسان نیستند.

UI بخشی از UX است اما UX محدود به UI نیست.

چرا طراحی UX موبایل مهم است؟

UI شامل همه مواردی است که با طراحی گرافیک ارتباط دارد.

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

طراحی UX برای موبایل: راهنمای کامل متخصصین 2020

عناصر یک طراحی UX موبایل در لانه زنبوری توسط Peter Morville نشان داده شده است.

موبایل در لانه زنبوری

Useful | مفید:

این سیستم باید خواسته ها و نیازهای کاربران را برآورده کند.

Usable | قابل استفاده :

سیستم باید تا حد ممکن آسان و خود راهنما باشد.

Desirable | مطلوب:

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

Findable | قابل کشف:

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

Accessible | در دسترس:

کاربران غیرفعال ، به عنوان مثال کاربری با بینایی بسیار ضعیف ، باید این فرصت را داشته باشد تا از سیستم شما استفاده کند و تجربه کاربری مشابه کاربران غیرمعلول را بدست آورد.

Credible | معتبر:

کاربر باید به شما و محصول شما اعتماد کند.

تفاوت بین طراحی UX موبایل و دسکتاپ در چیست؟

برای اینکه بهترین تجربه را به کاربر خود بدهید ، باید تفاوت بین طراحی UX موبایل و طراحی UX دسکتاپ را بدانید.

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

1. اندازه

اندازه

دسکتاپ: می توانید مطالب و اطلاعات زیادی را در یک صفحه قرار دهید و عالی و سازمان یافته به نظر برسد.

تلفن های هوشمند: اگر وب سایت خود را به اندازه معمول دستگاه تلفن همراه 4 – 5 اینچی بدون تغییر چیزی کوچک کنید ، بسیار وحشتناک به نظر می رسد و کاربر را گیج می کند.

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

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

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

برای یک طراحی عالی UX موبایل ، شما باید محتوای خود را فقط در یک ستون مرتب کنید.

کاربر برای دیدن همه مطالب باید به پایین اسکرول کند.

2. جهت گیری صفحه

جهت گیری صفحه

دسکتاپ: جهت گیری افقی دارند. کاربر نمی تواند این جهت گیری را تغییر دهد.

تلفن های هوشمند: در دستگاه های تلفن همراه ، کاربر گزینه تغییر جهت صفحه را دارد.

94٪ کاربران از تلفن های هوشمند خود به صورت عمودی استفاده می کنند ، در

حالی که 6٪ از تلفن های هوشمند خود به صورت افقی استفاده می کنند.

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

هرچه اندازه صفحه بزرگتر باشد ، با انگشت شست به راحتی به نقاط کمتری می رسید.

نقاط قابل لمس

دقت کنید: شما باید چندین جنبه را در اینجا در نظر بگیرید.

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

دوم ، شما باید ویژگی های اصلی یا نمادهای قابل کلیک را ترتیب دهید تا کاربر شما با یک انگشت شست بتواند به همه چیز برسد.

3. پیمایش و ورودی

پیمایش و ورودی

دسکتاپ: صفحه کلید و ماوس رایج ترین دستگاه های ورودی برای دسکتاپ هستند.

تلفن های هوشمند: در دستگاه تلفن همراه ، کاربر ماوس یا صفحه کلید فیزیکی برای تایپ یا انتخاب ندارد.

 دستگاه های تلفن همراه دارای صفحه نمایش لمسی هستند.

توجه کنید: اگر کاربر شما مجبور است هر چیزی را تایپ کند ، مثلاً برای روند ورود به سیستم ، باید یک صفحه کلید به او پیشنهاد دهید.

بسته به اینکه صفحه کلیدهای مختلفی به وی پیشنهاد می دهید ، می توانید به کاربر خود کمک کرده و ورودی را بسیار راحت تر کنید.

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

سایز ایکون

توجه کنید: اندازه نمادهای اقدام مهم است. اگر نمادهای اکشن بیش از حد زیادی به یکدیگر نزدیک شده باشند ، احتمال اشتباه زیاد است.

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

اکشن

دستگاه های تلفن همراه فقط به کاربر اجازه نمی دهند دکمه ها را لمس کند ، حرکاتی نیز وجود دارد که کاربر می تواند استفاده کند.

 متداول ترین حرکات پیمایش ، لغزش ، پایین کشیدن و ضربه زدن (طولانی ، کوتاه یا دو) است.

به عنوان مثال پایین کشیدن یک حرکت رایج برای رفرش کردن صفحه است.

4. محیط

محیط

دسکتاپ: کاربران اغلب از دسکتاپ برای کارهای جدی یا مهم استفاده می کنند. کار یا خرید.

تلفن های هوشمند: تلفن های همراه شخصی تر از دسکتاپ هستند.

تلفن های همراه بدون توجه به اینکه در رستوران ، خانه یا حمام باشد ، در همه جا استفاده می شوند.

فیلد ثبت نام

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

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

توجه کنید: گاهی اوقات کاربران به برنامه های تلفن همراه اعتماد ندارند.

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

برای اینکه کاربر را بیش از حد تحت فشار قرار ندهید ، فقط از آنچه در استفاده از برنامه مهم است بپرسید.

برای طراحی بی نقص UX موبایل ، نیاز به ورودی را به حداقل برسانید.

5. تقسیم صفحه

دسکتاپ: کاربر می تواند همزمان چندین برنامه و وب سایت را باز کند ، به عنوان مثال برنامه شما و یک ماشین حساب. باز کردن آنها در کنار یکدیگر مشکلی ندارد.

تلفن هوشمند: تلفن های هوشمند جدید از صفحه های تقسیم شده پشتیبانی می کنند.

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

6. نمادها

نمادها

نمادها هم برای دسکتاپ و هم برای دستگاه های تلفن همراه مثل هم هستند.

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

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

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

7. طراحی یکپارچه

طراحی یکپارچه

اگر می خواهید برنامه خود را برای دستگاه های تلفن همراه و دسکتاپ طراحی کنید ، باید یک طراحی یکپارچه ایجاد کنید.

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

اشتراک گذاری پست

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

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