ماموریت من در ارائه این ۳۱ درس این است که ، طراحان (یا طراحان مشتاق) بیشتری در طراحی تجربه کاربری شروع به کار کنند. بهترین مکان برای شروع یادگیری هر چیز از ابتدای آن است.

@JoelMarsh


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

وزن بصری : کنتراست، عمق، و اندازه

(اگر به‌تازگی دورۀ کوتاه مدت و فشردۀ  UX را آغاز کرده‌اید، اینجا را کلیک کنید.)

ایدۀ وزن بصری، نسبتاً شهودی‌ست. در طراحی بعضی موارد، به‌نظر «مهم‌تر و دشوارتر» از سایر موارد است. طراحان این موارد مورد نظر را به‌سادگی در طرح پیاده می‌کنند. در اینجاست که ایده ها برای طراح تجربه کاربری ارزش‌مند می‌شوند.

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

با افزودن ویژگی «وزن بصری» به بخش‌های خاصی از طراحی‌تان، احتمال این که کاربر آن‌ها را ببیند، افزایش می‌یابد و این امر باعث می‌شود هم‌زمان با جلوتر رفتن و مشاهدۀ دیدگاه‌ و نظرشان، شما هم بتوانید طرح‌تان را تغییر دهید تا به طرحی مطلوب تر دست یابید.

به یاد داشته باشید: وزن بصری، نسبی است. همۀ اصول بصری دربارۀ مقایسۀ عنصر طراحی با هر چیزی‌ست که در اطراف آن قرار دارد. بنابراین، بدون نیاز به توضیح بیشتر، می‌خواهم آغازکننده‌های این دورۀ فشردۀ طراحی تجربه کاربری- وزن بصری را به شما معرفی کنم : اردک‌های قدیمی پلاستیکی!

اردک میانی، مهمترین دیدگاه و نظرتان را ترسیم می‌کند. کنتراست بر وزن بصری اثر می‌گذارد.

کنتراست:

تفاوت بین قسمت‌های روشن و قسمت‌های تیره، کنتراست نامیده می‌شود. بیشترین تفاوت قسمت‌های روشن در مقایسه با قسمت‌های تیره، در میزان «بالاتر بودن» کنتراست است.

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

فرض کنید به‌جای اردک‌های موجود در تصویر، دکمه گذاشته شود، بیشتر افراد دکمۀ تیره را نسبت‌ به زمانی‌که رنگ همۀ آن‌ها مشابه است، کلیک می‌کنند.

 

اردک میانی که در جلو قرار دارد توجه بیشتری را جلب می‌کند. عمق و اندازه، وزن بصری را تغییر می‌دهند.

عمق و اندازه:

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

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

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

به همین دلیل، این کار برای طراحی «لوگوی بزرگتر» اشتباه است مگر این‌که شما بخواهید کاربران به‌جای خرید لوازم مورد نیاز خود، به لوگو توجه بیشتری داشته باشند!

در درسی بعدی، دومین اصل از پنج اصل بصری را یاد می‌ گیریم: رنگ!

منبع : http://thehipperelement.com


در uxbook تصمیم گرفتیم سری مقالات وب سایت thehipperelement.com را که ۳۱ مقاله می باشد، ترجمه و بر روی وب سایت قرار بدهیم. این مقالات طبق گفته آقای جویل مارش نقطه اصلی و انگیزه او برای شروع نوشتن و ارائه کتاب “طراحی تجربه کاربری برای مبتدیان” بوده است. تمام این ۳۱ درس بخش های کوچکی از کتاب اصلی هستند. نسخه کاملEBook  کتاب طراحی تجربه کاربری برای مبتدیان را از طریق وب سایت uxbook می توانید تهیه کنید.

طراحی تجربه کاربری برای مبتدیان

مطالب مرتبط


دوره فشرده آموزش طراحی تجربه کاربری : درس ۱۹... ماموریت من در ارائه این 31 درس این است که ، طراحان (یا طراحان مشتاق) بیشتری در طراحی تجربه کاربری شروع به کار کنند. بهترین مکان برای شروع یادگیری هر چ...
قدرت فضای خالی در طراحی رابط کاربری (بخش دوم )... استفاده از توجه و تمرکز برای تقویت سلسله مراتب دیداری المان هایی که با احاطه شدن در فضای سفید بر آنها تاکید شده، ممکن است برای متمرکز کردن توجه کاربر ...
تجربه کاربری با پس زمینه علوم شناختی... یک تجربه کاربری عالی ترکیب مناسبی از مفاهیم روانشناسی، اصول طراحی برای یک رابط کاربری زیبا و بازخورد مستمر از کاربران است. اغلب طراحان فاکتور دوم را ه...
۵ نکته از بهینه سازی تجربه کاربری که رنکینگ Search... هر زمان که تمرکز شما برای ترویج (‌پروموشن) یک وب سایت، سرویس یا یک برند، در فضای آنلاین است، در واقع دارید بر بهبود رتبه در نتایج جستجو تمرکز می کنید ...
طراحی تجربه کاربری و ایجاد نمونه اولیه، چیزی که ط...   شرکت پیشرو و موفق Adobe سال‌ها است که به طراحان و توسعه‌دهندگان در حوزه‌های مختلف کمک زیادی کرده است. اگر در حوزه طراحی‌های بصری نظیر طراحی رابط کار...
یلدا احمدی مقدم

نویسنده یلدا احمدی مقدم

از سال 95 با گروه UX آشنا شدم. چون ترجمه موضوعات جدید و آموختن همیشه برایم جذاب است, پس تصمیم گرفتم در کنار سایر فعالیت هایی که دارم (در زمینه های هنری) با این گروه همگام شده و در ترجمه کتب و مقالات با آنها همکاری نمایم. ترجمه کتاب های مفید از سایر زبان ها, بهترین راه برای انتقال اطلاعات و دریافت تجربیات در جهان هستی است.

نوشته های بیشتر از یلدا احمدی مقدم

نظرتان را بگویید