سلسله مراتب بصری (Visual Hierarchy )UI و UX

سلسله مراتب بصری (Visual Hierarchy )UI و UX

انتخاب نوع چیدمان محتوا، عناوین و تصاویر در نوع طراحی انواع منابع ازجمله روزنامه‌ها، وب‌سایت‌ها، وبلاگ‌ها و… بسیار حائز اهمیت است. زیرا رعایت نکات ترتیب و نمایش است که خوانندگان را به محتوای نوشته شده جذب می‌کند؛ لذا در این مقاله به بررسی و توضیح سلسله‌ مراتب بصری UI و UX خواهیم پرداخت.

سلسله مراتب بصری (Visual Hierarchy) چیست؟

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

اهمیت رعایت سلسله مراتب بصری (Visual Hierarchy)UI و UX

رعایت نکات سلسله مراتب بصری در طراحی UI/UX اهمیت زیادی دارد. Visual Hierarchy باعث می‌شود تا توجه کاربران  به عناصر مهمی مانند دکمه‌های عمل، عناوین و تصاویر جلب شود. این امر می‌تواند به کاربران کمک کند تا اطلاعات موردنیاز خود را در یک صفحه یا رابط کاربری سریع‌تر و آسان‌تر پیدا کنند.

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

 

سلسله مراتب بصری (Visual Hierarchy )UI و UX

عناصر سلسله مراتب بصری

عناصر مختلفی می‌توانند در ایجاد سلسله مراتب بصری استفاده شوند. برخی از رایج‌ترین این عناصر عبارت‌اند از:

  • اندازه

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

  • رنگ

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

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

  • موقعیت

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

  • تصاویر

تصاویر یکی از مهم‌ترین موارد ماندگار در ذهن خوانندگان و مخاطبین محسوب می‌شوند. به همین جهت استفاده از آنها جهت تأثیرگذاری هرچه بیشتر محتوا بر خوانندگان ضروری است.

  • جهت

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

  • حرکت

به‌جرئت می‌توان گفت انیمیشن‌ها جزو اصلی‌ترین گزینه‌های هدایت چشم و ذهن کاربر محسوب شده و وجود آنها تأثیر بسزایی در جلب‌توجه خوانندگان دارد.

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

 

عناصر سلسله مراتب بصری

انواع سلسله مراتب بصری

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

1. سلسله مراتب تصویری

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

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

 

سلسله مراتب تصویری

2. سلسله مراتب محتوا

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

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

 

سلسله مراتب محتوا

3. سلسله مراتب نیازهای کاربران باتوجه‌به هرم مازلو

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

 

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

 

 

در مجموع، رعایت سلسله مراتب بصری یک امر ضروری در طراحی UI/UX محسوب می‌شود. این امر می‌تواند به بهبود تجربه کاربری و افزایش رضایت کاربران کمک کند.

 

 

 

0 0 رای ها
امتیاز شما به این مطلب
اشتراک در
اطلاع از
guest
0 نظرات
بازخورد (Feedback) های اینلاین
مشاهده همه دیدگاه ها
0
افکار شما را دوست داریم، لطفا نظر دهید.x