وبلاگ - نکات و ترفندها

0
141
درک ریز تعاملات در طراحی اپلیکیشن موبایل – بخش اول

درک ریز تعاملات در طراحی اپلیکیشن موبایل – بخش اول

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

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

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

قدرت ریز تعاملات

در اکثر شرایط هدف ریز تعاملات در اختیار قرار دادن بازخورد بر اساس فعالیت و اقدامات کاربر می باشد، این شرایط به کاربران کمک می کند تا نحوه جابجایی و رفتار رابط را تجسم کنند. اسلایدرهای فعال/غیرفعال مانند سوئیچ های فیزیکی حرکت نمی کنند، اما از طریق انیمیشن ها عملکرد مشابهی را ارائه می دهند.

blog_22819_1

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

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

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

– راهنمایی کاربران بین صفحات مختلف

– راهنمایی کاربر در رابط و آموزش رفتارهای خاص

– پیشنهاد فعالیت ها/رفتارها که در هر صفحه قابل انجام می باشند

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

نحوه کار ریز تعاملات

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

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

مبنی بر UXPin هر ریز تراکنش مقدماتی را می توان 4 مرحله تقسیم کرد، اما در زیر این مراحل به 3 مورد خلاصه شده است:

1. اقدام – کاربر اقدامی مانند تلنگر، حرکت دوانگشتی، ضربه زدن و نگه داشتن و یا تعامل دیگری را انجام می دهد.

2. واکنش – رابط مبنی بر چیزی که باید اتفاق بیفتد واکنشی نشان می دهد. حرکت دو انگشتی بر روی صفحه ممکن است به تاریخچه مرورگر باز گردد و ضربه زدن بر روی اسلایدر فعال/غیرفعال ممکن است تنظیمات را غیرفعال کند.

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

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

توجه به جزئیات

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

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

در مطلب بعدی شما را با مثال هایی جهت درک بیشتر موضوع آشنا خواهیم کرد، با ما همراه باشید.

 

منبع:

http://www.hongkiat.com

این نوشته را به گوگل توصیه کنید :

بسته های آموزشی جذاب!بیشتر