بایدها و نبایدهای طراحی رابط کاربری در دستگاه‌های iOS

بایدها و نبایدهای طراحی رابط کاربری در دستگاه‌های iOS

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

به همین دلیل در این مطلب قصد داریم توصیه‌های رایج و بایدها و نبایدهای طراحی رابط کاربری که شرکت اپل به آن‌ها تاکید ویژه‌ای داشته است را بیان کنیم.

قالب‌بندی محتوا

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

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

.

کنترل‌ها و المان‌های لمسی

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

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

.

Call-to-Action های استاندارد

کنترل‌ها و دکمه‌ها/Call-to-Action های مورد استفاده را به گونه‌ای انتخاب نمایید تا حداقل اندازه آن‌ها ۴۲ points در ۴۲ points باشد. در این صورت کاربران با دقت بسیار زیادی می‌توانند کنترل مورد نظرشان را تپ کنند.

کنترل‌ها و دکمه‌ها/Call-to-Action های مورد استفاده را به گونه‌ای انتخاب نمایید تا حداقل اندازه آن‌ها 42 points در 42 points باشد. در این صورت کاربران با دقت بسیار زیادی می‌توانند کنترل مورد نظرشان را تپ کنند.

.

سایز متن

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

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

.

کنتراست (تضاد)

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

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

.

فاصله‌گذاری

هیچ‌گاه اجازه ندهید محتوای متنی شما هم‌پوشانی داشته و رویِ هم بیافتند. شما می‌توانید به‌سادگی با افزایش ارتفاع خطوط یا رعایت فاصله‌گذاری بین کلمات (فاصله استاندارد)، خوانایی محتوای خود را بیشتر نمایید.

هیچ‌گاه اجازه ندهید محتوای متنی شما هم‌پوشانی داشته و رویِ هم بیافتند. شما می‌توانید به‌سادگی با افزایش ارتفاع خطوط یا رعایت فاصله‌گذاری بین کلمات (فاصله استاندارد)، خوانایی محتوای خود را بیشتر نمایید.

.

رزولوشن بالای تصاویر

نسخه‌های باکیفیت بالایی از تمامی محتوای تصویری خود فراهم نمایید. تصاویری که نسخه‌های با کیفیتِ ۲ برابر و یا ۳ برابر برای آن‌ها در دسترس نیست، در صفحه‌نمایش‌ رِتینا به صورت تار (blurry) به نمایش درخواهد آمد.

نسخه‌های باکیفیت بالایی از تمامی محتوای تصویری خود فراهم نمایید. تصاویری که نسخه‌های با کیفیتِ 2 برابر و یا 3 برابر برای آن‌ها در دسترس نیست، در صفحه‌نمایش‌ رِتینا به صورت تار (blurry) به نمایش درخواهد آمد.

.

Distortion (تحریف) تصاویر

همواره سعی کنید نسبت ابعاد تصاویر را حفظ کرده و از تحریف تصاویر (distortion) بپرهیزید.

همواره سعی کنید نسبت ابعاد تصاویر را حفظ کرده و از تحریف تصاویر (distortion) بپرهیزید.

.

سازماندهی المان‌های مورد استفاده

برای طراحی رابط کاربری وب‌سایت خود برای پلتفرم موبایل، از قالبی بسیار خوانا و زیبا استفاده کنید؛ همواره سعی کنید دکمه‌های کنترلی را نزدیک به محتوای قابلِ تغییر قرار دهید.

برای طراحی رابط کاربری وب‌سایت خود برای پلتفرم موبایل، از قالبی بسیار خوانا و زیبا استفاده کنید؛ همواره سعی کنید دکمه‌های کنترلی را نزدیک به محتوای قابلِ تغییر قرار دهید.

.

هم‌ترازی متن

متن، تصاویر و دکمه ها را به گونه‌ای تنظیم کنید تا کاربران بتوانند به راحتی درجه‌ی اهمیت و ترتیبِ اطلاعات را درک کنند.

متن، تصاویر و دکمه ها را به گونه‌ای تنظیم کنید تا کاربران بتوانند به راحتی درجه‌ی اهمیت و ترتیبِ اطلاعات را درک کنند.

.

منبع: apple

start campaign

از طریق وب‌سایت خود کسب‌درآمد کنید...

با کد تبلیغات ای‌نتورک،‌ از همین امروز کسب درآمد کنید

بیشتر بدانید

پاسخ دهید

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