ویرگول
ورودثبت نام
استودیو وال‌دیزاین | Waldesign Studio
استودیو وال‌دیزاین | Waldesign Studio(پیشرفت از عمق دریا تا اوج آسمان) طراحی گرافیک | طراحی رابط و تجربه‌کاربری
استودیو وال‌دیزاین | Waldesign Studio
استودیو وال‌دیزاین | Waldesign Studio
خواندن ۳ دقیقه·۱ سال پیش

۵ اصول طراحی تم دارک

waldesign | وال دیزاین
waldesign | وال دیزاین


خوبه که بدونید دارک مود (dark mode) یا حالت شب  از سال ۲۰۱۸ در دنیای طراحی محصول ترند شده. و تا الان تونسته طرفدارای زیادی پیدا کنه. امروزه اگر دقت کنید اکثر سایت‌ها و اپلیکیشن‌ها دو حالت لایت و دارک و تو طراحی‌هاشون قرار میدن تا کاربر طبق سلیقه و شرایط خودش، انتخاب کنه.

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

waldesign.ir

بریم سراغ اصول طلایی طراحی دارک مود:

دسترسی پذیری:

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

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


پله های رنگی ایجاد کنید:

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

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

فضاهای منفی:

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

تصاویر:

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

اشباع رنگ:

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

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

وبسایتمون: waldesign.ir

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


دسترسی پذیریطراحیرابط کاربریتجربه کاربری
۹
۵
استودیو وال‌دیزاین | Waldesign Studio
استودیو وال‌دیزاین | Waldesign Studio
(پیشرفت از عمق دریا تا اوج آسمان) طراحی گرافیک | طراحی رابط و تجربه‌کاربری
شاید از این پست‌ها خوشتان بیاید