در این قسمت به سراغ اصل Hierarchy یا سلسله مراتب در دیزاین رفتم به شما نشان می دهم که چطور از آن برای اولویت دادن به عناصر داخل صفحه استفاده کنید.
از Hierarchy در همهی حیطه های طراحی از قبیل طراحی رابط کاربری UI/UX ، صفحه آرایی ، طراحی گرافیک مثل طراحی پوستر و… بسیار استفاده می شود.
در این فیلم کدامیک از موارد Hierarchy در UI/UX و صفحه آرایی بررسی می شود؟
در حوزه UI/UX شاید شما سلسله مراتب یا Hierarchy را مشابه قانون gestalt یا گشتالت ببینید. در واقع اصل Hierarchy از قانون گشتالت گرفته شده که خود آن شامل موارد زیر هست:
- مجاورت (proximity)
- تشابه (Similarity)
- تداوم یا پیوستگی (Continuity)
- بستار (Closure) – تکمیل کننده
- تصویر – زمینه (Figure-ground)
- تقارن (Symmetry)
- سرنوشت مشترک (common fate)
- فراپوشانندگی (inclusiveness)
- قانون موازات (Parallelism)
- منطقه مشترک (Common Region)
- عنصر متصل (Element Connectedness)
در این فیلم آموزشی تعدادی از این موارد را بررسی و با مثال نحوه کاربرد آن را به شما آموزش می دهم.
لینک آموزش در یوتیوب
Hierarchy چیست و چطور از آن در طراحی UI/UX و صفحه آرایی استفاده کنیم؟
طراحی رابط کاربری ( UI/UX ) را از صفر از کجا یاد بگیرم؟
لینک آموزش ها و مقالات فارسی دیگر طراحی رابط کاربری ( UI/UX ) در وبلاگ من:
آموزش Adobe XD – معرفی 5 پلاگین فوق العاده کاربردی – قسمت دوم
معرفی 5 پلاگین فوق العاده کاربردی برای Adobe Xd- قسمت اول
آموزش UI/UX : طراحی رابط کاربری را از صفر چطور و از کجا یاد بگیریم؟
آموزش UI/UX : وایرفریم چیه و چطور آن را طراحی کنیم؟
چطور طرح رابط کاربری را در اختیار برنامه نویس و کارفرما قرار دهیم؟
لندینگ پیج چیست و چطور باید رابط کاربری UI/UX آن را طراحی کرد؟
اصطلاحات طراحی رابط کاربری – بخش اول: رنگها
آموزش UI/UX : اصول طراحی رابط کاربری برای تلویزیون
طراحی رابط کاربری موبایل 101: pixels, points و resolutions
آموزش UI/UX : تفاوت pt و px در طراحی رابط کاربری
طراحی رابط کاربری موبایل 101: Strokes در فتوشاپ
نمونه کار: رابط کاربری صفحه اعضای تیم – Team members page UI/UX