راهنمای Clean Design در طراحی رابط کاربری2

تفاوت‌ها موثرترین راه برای جلب توجه و به یاد ماندنی کردن طراحی برای کاربر است. از طریق کنتراست، طراحان می‌توانند عناصر و اطلاعات ضروری را برجسته کنند، یک چیدمان شیک ایجاد کنند و کاربر را با جزئیات غیرعادی درگیر کنند.هر پروژه طراحی از مجموعه‌ی خاصی از عناصر رابط کاربری تشکیل شده است. همه‌ی این عناصر، با توجه به وظایف رابط کاربری و نیازهای کاربران، باید در چیدمانی بر اساس اهمیت و سلسله مراتب قرار بگیرند. برای مدیریت صحیح توجه کاربر، باید اصول و قواعد اصلی کنتراست را بدانیدو بتوانید به کار ببرید.بیایید در مورد 9 نکته و مثال برای کنتراست صحبت کنیم.اصول انتقادی برای استفاده از کنتراست‌هاهنگام طراحی یک پروژه UI باید به سه اصل مهم پایبند باشید:1) عناصر را به طور قابل توجهی متفاوت کنید چرا که کاربران تنها زمانی متوجه آن‌ها می‌شوند که کنتراست بالا باشد.DESIGNED BY DARIA KRAVETS2) اطمینان حاصل کنید که طراحی شما ساده است و فقط چند افکت دارد زیرا در غیر اینصورت مانع از تمرکز مخاطب شما بر روی چیزهایی می‌شوند که بیشترین اهمیت را دارند.DESIGNED BY CUBERTO3) اطلاعات اولیه و ثانویه را مشخص کنید و اطلاعاتی را که در وهله‌ی اول باید توجه شما را جلب کند برجسته کنید.انواع کنتراست در طراحی رابط کاربریبه طور معمول، کنتراست در طراحی بر اساس عملکردهای مختلفِ عناصرِ چیدمان مانند:اندازهرنگمکانجهتفرمبافتبه کار برده می‌شود.9 نکته و مثال برای کنتراستبیایید نکاتی را در مورد نحوه‌ی استفاده از کنتراست در طراحی UI برای جلب توجه کاربران بیاموزیم.اندازه و نقاط در ترکیباشیاء بزرگتر روی طرح توسط کاربران بهتر درک می‌شوند. بدلیل تضادی که دارند نسبت به موارد کوچک توجه بیشتری را به خود جلب می کنند. نمونه‌ای از استفاده از کنتراست اندازه، فونت های مختلف است. اطلاعات مهم‌تر با فونت بزرگتر مشخص شده است.DESIGNED BY MARGARET LUNINAکنتراست رنگ و پس زمینهکنتراست رنگ تفاوت بین روشنایی رنگ‌ها است. کنتراست نشان می‌دهد که یک رنگ چقدر روشن یا تیره است. یک رنگ متضاد در طراحی برای برجسته کردن عمل اصلی در ترکیب استفاده شده است.DESIGNED BY FILIP LEGIERSKIعناصر خلاقانهتضاد غیرمعمول دیگر تفاوت بین عناصر خلاقانه و جالب رابط کاربری و جزئیات آشنای چیدمان است. این‌ها می‌توانند تصاویر غیر معمول، اشکال جالب، پاپ آپ‌ها، انیمیشن‌ها و موارد دیگر باشند.چنین عناصری در میان جزئیات آشنا برای کاربر برجسته می شوند - دکمه ها، فرم های وب و سایر بلوک های رایج در سایت. بدین ترتیب که طراح توجه را به اطلاعات لازم، بنر همراه با تبلیغات و فراخوان جلب می کند و می‌تواند بازدیدکننده سایت را به اقدام هدفمند ترغیب کند.DESIGNED BY CUBERTOعناصر متحرکعناصر متحرک بیشتر توجه کاربران را به خود جلب می کنند و هرگز بی توجه نمی‌مانند. استفاده از انیمیشن برای کنترل توجه کاربر موثر است.DESIGNED BY CUBERTOبافت‌هابا کمک بافت‌ها و الگوهای مختلف، می‌توانید بین بلوک‌های طراحی خود تضاد ایجاد کنید و توجه کاربر را به جزئیات خاص جلب کنید. همچنین، بافت‌ها اغلب به عنوان پس زمینه برای اشیایی که می‌توانند به عنوان کنتراست استفاده شوند، استفاده می‌شوند. به عنوان مثال، یک عنصر روشن در یک بافت تیره نه تنها تضاد با رنگ، بلکه تضاد "مواد" است.DESIGNED BY CUBERTOترکیب‌بندییکی دیگر از رویکردهای مبتنی بر کنتراست، ویژگی های ترکیب UI است. عناصر را می‌توان به گونه ای چیدمان کرد که با توجه به فاصله بین آن‌ها توجه کاربران را به خود جلب کند. این رویکرد با وجود فضای سفید در سایت مشخص می‌شود.طراحان از فضای سفید زیادی استفاده می‌کنند و توجه را به اشیاء جلب می‌کنند: تصویر محصول، عنوان، منو و Call to action.DESIGNED BY HRVOJE GRUBISICفرم‌هاشکل یک عنصر راه دیگری برای برجسته کردن آن در چیدمان و جلب توجه کاربر است. این تکنیک را می‌توان با اشکال هندسی ساده نشان داد. اگر چهار شکل با اندازه و رنگ یکسان را در یک ردیف قرار دهیم، اما یکی از آن‌ها شکل متفاوتی داشته باشد، این بلافاصله توجه را جلب می کند.در طراحی، همه چیز بر اساس یک اصل کار می‌کند. اغلب عناصر به اشکال هندسی شکل می‌گیرند یا به سادگی در بلوک‌هایی با اشکال مختلف قرار می‌گیرند. در عین حال باید هماهنگی و مطابقت فرم با سبک پروژه را کنترل کنید. البته ترکیب غیرمعمول نیز امکان‌پذیر است، اما در این مورد، ترکیب و سبک باید با یکدیگر هماهنگ باشند.DESIGNED BY PURRWEB UI/UX AGENCYتایپوگرافیهمچنین می‌توانید با تایپوگرافی تضاد ایجاد کنید. این به وضوح در مقالات و انواع دیگر محتوای متنی دیده می‌شود. به عنوان مثال، اگر باید توجه کاربر را به اطلاعات خاصی جلب کنید، می‌توانید آن را با فونتی متفاوت از محتوای اصلی برجسته کنید. رعایت اصول اولیه تایپوگرافی بسیار مهم است:از بیشتر از 2 تا 3 فونت در طرح بندی استفاده نکنید.از فونت‌هایی استفاده نکنید که با سبک سایت مطابقت دارند.پاراگراف‌ها را جدا کنید.DESIGNED BY HRVOJE GRUBISICدکمهرنگ یک دکمه فقط یک جنبه است، جنبه‌های دیگری چون حجمِ برچسب یا حاشیه آن کاربر را از وضعیت فعلی خود آگاه می‌کند. وقتی تضاد واضح باشد مشخص می‌شود که آیا یک عنصر معین؛ تعاملی، فعال یا غیرفعال است و چه نوع عملی را نشان می‌دهد: اولیه یا ثانویه.DESIGNED BY ALEX TKACHEVنتیجهبه طور کلی کنتراست ابزار اصلی برای جلب توجه کاربر است. استفاده از ترکیبات مختلف (به عنوان مثال، اشکال ، عناصر جالب + سایه های رنگ روشن) به طراحان اجازه می‌دهد تا منبع جالب و به یاد ماندنی ایجاد کنند که محصولات را به خوبی نمایش دهد. بسته به جهت و استفاده از هویت سازمانی در طراحی، توسعه‌دهندگان می‌توانند با استفاده از تضاد در رنگ‌ها، شکل‌ها، ترکیب‌بندی و سایر تکنیک‌ها، روحیه کاربران را تغییر داده و فضایی خاص در سایت ایجاد کنند.https://www.flowmapp.com