دوره جامع آموزش طراحی رابط کاربری (UI) و تجربه کاربری (UX) در اندروید

رابط کاربری چیست؟ 

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

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

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

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

رابط خط فرمان (cli = Command line interface)

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

رابط کاربر گرافیکی (GUI = graphical user interface)

رابط های کاربری گرافیکی (GUI) بعضاً به عنوان WIMP نیز شناخته می شوند زیرا از ویندوز، آیکن ها، منوها و اشاره گرها استفاده می کنند. اپراتورها از یک دستگاه اشاره گر (مانند ماوس ، صفحه لمسی یا گوی) برای کنترل یک اشاره گر بر روی صفحه استفاده می کنند تا با سایر عناصر روی صفحه ارتباط برقرار کنند.

GIU این امکان را به کاربر می دهد تا از طریق آیکون های گرافیکی و شاخص های بصری با دستگاه ها ارتباط برقرار کند. این اصطلاح در دهه 1970 ایجاد شده است تا واسط های گرافیکی را از رابط های متنی مانند رابط های خط فرمان متمایز کند. با این حال، امروزه تقریباً تمام رابط های دیجیتال GUI هستند.

اولین رابط کاربری گرافیکی موجود در بازار با نام “PARC” توسط زیراکس ساخته شد. پس از آنکه استیو جابز در هنگام گشت و گذار در زیراکس ، رابط کاربری را مشاهده کرد ، از سیستم اطلاعات زیراکس 8010 استفاده شد ، وی به تیم خود در اپل یک سیستم عامل با طراحی مشابه را توسعه داد. سیستم عامل مبتنی بر GUI اپل همراه Macintosh بود که در سال 1984 منتشر شد. مایکروسافت اولین سیستم عامل مبتنی بر GUI خود ، ویندوز 1.0 را در سال 1985 منتشر کرد.

رابط کاربری (mdi = Menu driven interface)

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

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

رابط کاربری مبتنی بر فرم (fbi = Form-based interface)

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

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

رابط کاربری زبان طبیعی (nli = Natural language Interface)

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

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

نمونه ای از این نوع رابط ها ، تشخیص صدا است. این نوعی رابط توسط برنامه معروف آیفون به نام Siri و Cortana در ویندوز استفاده می شود.

رابط کاربری صوتی (Voice User interface)

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

با چه برنامه هایی می توانیم برای طراحی رابط کاربری گوشی یا سایت استفاده کنیم؟

• Sketch
• sketch-logo-UI
• InVision Studio
• In-Vision-Studio-UI
• Adobe Comp
• Adobe-comp-UI
• Adobe xd
• what-is-adobe-xd – UI
• Origami Studio
• origami-UI
• Figma
• figma-UI

نکته ای که قابل ذکر است این که، یک طراح UI گوشی یا سایت خوب باید حس مشارکتی را در خود پرورش دهد تا توانایی و پتانسیل هایش افزایش یابد.

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

مقایسه رابط کاربری اندروید برند های مختلف

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

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

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

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

• رابط کاربری گوشی برای برند سامسونگ

گوشی سامسونگ در بین گوشی های اندرویدی محبوب هستند. رابط کاربری گوشی های سامسونگ در گذشته با نام TouchWiz (تاچ ویز) معروف بود، اما مدتی است با نام Experience شناخته می‌شود.

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

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

هدف اصلی One UI این است که کاربران بتوانند روی چیزی که از گوشی می خواهند تمرکز کنند. برای دستیابی به این هدف، این رابط کاربری محبوب شاخ و برگ‌های اضافی Samsung Experience را هرس کرده تا نمایی ساده‌تر به آن ببخشد و بدین ترتیب کاربر روی به انجام رساندن امر موجود تمرکز بیشتری داشته باشد.

نقاط قوت ui  گوشی های سامسونگ

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

ui گوشی سامسونگ بر آنست تا تعامل آسان و راحت را برای کاربران فراهم کند؛ رنگ‌ها شفافیت بهتری ارائه می‌دهند و عناصر UI متناسب با رنگ گوشی تغییر می‌کند. One UI با سیستم عامل اندروید ۹ پای معرفی شد و سپس بر اساس سیستم عامل اندروید ۱۰ به One UI 2 ارتقاء یافت. فرقی نمی‌کند یک گوشی سامسونگ جدید بخرید یا اینکه گوشی سامسونگ خود را بروزرسانی کنید، در هر صورت با تغییرات نرم‌افزاری اساسی رو‌به‌رو می‌شوید.

اگر برنامه، اسناد یا رسانه‌ای دارید که می‌خواهید مخفی کنید، Samsung One UI یک پوشه امن برای این کار فراهم می‌کند. از آنجا که از پین یا اثر انگشت شما استفاده می‌شود، موارد قفل شده از چشمان کنجکاو در امان خواهند ماند. علاوه بر این، قرار دادن محتوا در پوشه به مراحل زیادی احتیاج ندارد.

برخورداری از قابلیت ” Lift to Wake ” در گوشی سامسونگ این امکان را فراهم می‌کند که هر زمان گوشی خود را برمی‌دارید صفحه نمایش آن روشن شود و دیگر نیازی نیست برای این امر کلید پاور را فشار دهید. برای افرادی که از این ui گوشی در شب استفاده می‌کنند، حالت دارک مود در نظر گرفته شده که علاوه بر زیبایی صفحه نمایش از چشمان شما در برابر خطرات نور شدید آبی محافظت می‌کند.

• رابط کاربری گوشی برای برند ال جی

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

معمولا اکثر شرکت های سازنده موبایل رابط کاربری گوشی هایشان را برای یک سیستم عامل توسعه می دهند ولی رابط کاربری گوشی ال جی هم برای اندروید و هم برای ویندوز فون طراحی شده است. ال جی آخرین نسخه از رابط کاربری خود را یعنی LG Optimus UX 4.0 UI را بر روی پرچمدار فعلی خود یعنی LG G4 عرضه نموده است.

• رابط کاربری گوشی برای برند اچ تی سی

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

مهمترین ویژگی اچ تی سی سنس برنامه بلینک فید است. بلینک فید یک خبرخوان تصویری زیبا با آپدیت اتوماتیک برای صفحه خانه است. بلینک فید تمام اتفاقات تویتر٬ فیس بوک٬ برنامه‌های تقویم و دیگر سایت‌های خبری را به طور بسیار زیبایی در کنار هم تجمیع می‌کند.

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

ادامه دارد …

طراحی متریال دیزاین اندروید چیست؟

Android Lollipop که با نام های اندروید آب‌نبات‌چوبی، اندروید لالی‌پاپ، اندروید ۵ و اندروید شناخته می شود، یکی از نسخه‌های سیستم‌عامل اندروید است که توسط گوگل در ۱۵ اکتبر ۲۰۱۴ معرفی شده است. طبق گفته های رئیس شرکت گوگل (سوندار پیچای)، این نسخه بزرگ ترین بروزسانی را از بین نسخه های دیگر اندروید داشته است.

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

آموزش طراحی متریال دیزاین اندروید چگونه است و چگونه می توانیم یاد بگیریم؟ 

طراحی متریال (Material Design) یک راهنمای جامع یا یک سبک یا یک زبان برای طراحی بصری (visual)، حرکتی (motion) و طراحی تعاملی (interaction) است که نه تنها در طراحی اپلیکیشن از آن استفاده می شود، بلکه در طراحی سایت و دیگر دستگاه هایی که امکان پشتیبانی از این طرح ها وجود دارد نیز کاربرد دارد. این سبک از طراحی تقریبا جدید است که گوگل در یکی از کنفرانس های خبری در سال 2014 آن را معرفی کرد.

چرا از طراحی متریال دیزاین به عنوان راهنما (Guide Line) نام می برند؟ 

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

سبک طراحی متریال ابتدا در اپلیکیشن های گوگل مانند Gmail و YouTube پیاده سازی و به مخاطب معرفی شد و سپس مورد توجه طراحان دیگر قرار گرفت و در حال حاضر در خیلی از طراحی ها از آن استفاده می شود و اکثر اپلیکیشن هایی که در مارکت هایی مانند گوگل پلی، بازار و… وجود دارند از این نوع سبک ایجاد شده اند.

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

طراحی متریال دیزاین یک سیستم طراحی است؟

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

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

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