منبع: بنیاد طراحی تعامل (IxDF) · بازنویسی آزاد: سپنتا پویا · مرداد ۱۴۰۵ · زمان مطالعه: حدود ۱۱ دقیقه

حالت تاریک (Dark Mode) چیست؟

💡 این متن «بازنویسی آزاد» است: ایده‌ها و مفاهیم مطلب اصلی با نگارش کاملاً مستقل فارسی و مثال‌های تازه بازگو شده‌اند و ترجمهٔ کلمه‌به‌کلمه نیست. بخش‌های افزودهٔ مترجم در جعبهٔ منبع مشخص شده‌اند.

حالت تاریک یکی از معدود ویژگی‌هایی است که تقریباً همه فایده‌هایش را می‌دانند: چشم را کمتر خسته می‌کند، باتری را نگه می‌دارد، خواندن را راحت‌تر می‌کند.

و وقتی سراغ پژوهش‌ها می‌روید، از این سه‌تا یکی باقی می‌ماند — و آن هم فقط روی بعضی نمایشگرها.

این به آن معنا نیست که حالت تاریک را نباید ساخت. به این معناست که دلیل ساختنش آن چیزی نیست که فکر می‌کنیم.

تعریف

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

ادعاها، و اینکه کدام‌یک پشتوانه دارد

منبع فهرست فایده‌های رایج را می‌آورد و — که کم پیش می‌آید — دربارهٔ بعضی‌شان با پژوهش مخالفت می‌کند:

• - کاهش خستگی چشم در نور کم — گفته می‌شود، اما در همین مطلب شاهد تجربی برایش ارائه نمی‌شود.
• - صرفه‌جویی در باتری روی نمایشگر OLED — این یکی سازوکار روشنی دارد: پیکسل سیاه انرژی کمتری مصرف می‌کند.
• - افزایش عمر نمایشگر OLED — بدون ارجاع.
• - کاهش خیرگی — بدون پشتوانهٔ پژوهشی.
• - کنتراست بهتر برای کاربران کم‌بینا — بدون ارجاع.
• - بهبود خوانایی — و این یکی را پژوهش نقض می‌کند.

آنچه پژوهش می‌گوید

• - پژوهش Pedersen و همکاران (۲۰۲۰) دربارهٔ استفاده از رابط تاریک در طول روز، تفاوت معناداری در بهره‌وری و نرخ خطا میان حالت تاریک و روشن پیدا نکرد.
• - دربارهٔ قطبیت: در محیط‌های روشن، متن تیره روی زمینهٔ روشن معمولاً راحت‌تر خوانده می‌شود.
• - و هاله: افراد دارای نزدیک‌بینی یا آستیگماتیسم ممکن است پدیدهٔ هاله را تجربه کنند که خواندن را سخت‌تر می‌کند.

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

و دربارهٔ باتری هم منبع دقیق است: روی دستگاه‌های قدیمی‌تر که نمایشگر OLED ندارند، حالت تاریک لزوماً عمر باتری را بهتر نمی‌کند.

راهنمای طراحی

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

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

جاهایی که حالت تاریک می‌شکند

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

• - تصویرها و تصویرسازی‌هایی که پس‌زمینهٔ سفید در خودشان پخته شده. یک PNG با زمینهٔ سفید در حالت تاریک مثل یک پنجرهٔ روشن وسط صفحه می‌درخشد. راهش استفاده از فرمت شفاف یا داشتن دو نسخه است — و این تصمیمی است که باید هنگام ساختن تصویر گرفته شود، نه بعد.
• - نماگرفت‌ها در راهنما و مستندات. اینها تقریباً همیشه در حالت روشن گرفته شده‌اند و هیچ‌وقت به‌روز نمی‌شوند.
• - رنگ برند که فقط روی سفید کار می‌کند. بسیاری از رنگ‌های برند برای زمینهٔ روشن انتخاب شده‌اند و روی تیره یا محو می‌شوند یا می‌لرزند. اینجا به یک نسخهٔ تطبیق‌یافته نیاز دارید، نه به همان کد رنگ.
• - محتوای تعبیه‌شدهٔ شخص ثالث. نقشه، درگاه پرداخت، نمودار، ویدئوی جاسازی‌شده — هرکدام تم خودشان را دارند و اغلب روشن می‌مانند. نتیجه‌اش رابطی است که وسطش یک مستطیل سفید دارد.
• - ایمیل. پیام‌هایی که محصولتان می‌فرستد تقریباً همیشه روشن‌اند، حتی وقتی اپ تاریک است — و کاربر این ناهماهنگی را می‌بیند.
• - و سایه، که دیگر کار نمی‌کند. در حالت تاریک ارتفاع با روشن‌ترشدن نشان داده می‌شود نه با سایه؛ مفصلش را در هماهنگی رنگ نوشتم.

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

پس چرا واقعاً باید ساختش؟

این بخش افزودهٔ مترجم است. اگر خوانایی بهتر نمی‌شود و باتری فقط روی بخشی از دستگاه‌ها فرق می‌کند، چه چیزی از این ویژگی باقی می‌ماند؟

به‌نظر من دو چیز — و هر دو واقعی‌اند، فقط جنسشان با آن چیزی که معمولاً گفته می‌شود فرق دارد:

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

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

و یک توصیهٔ عملی که از یافتهٔ «قطبیت» می‌آید: تنظیم سیستم را دنبال کنید و نپرسید. چون بهترین انتخاب به نور محیط بستگی دارد و نور محیط عوض می‌شود، دستگاه پاسخ به‌روزتری از کاربر دارد. حالت دستی را نگه دارید، اما پیش‌فرض را روی تنظیم سیستم بگذارید — و هرگز در اولین اجرا این را نپرسید.

متن فارسی در زمینهٔ تیره متفاوت رفتار می‌کند

این بخش هم افزودهٔ مترجم است. یک پدیدهٔ نوری قدیمی وجود دارد: متن روشن روی زمینهٔ تیره، ضخیم‌تر از همان متن در حالت وارونه دیده می‌شود. نور در چشم کمی سرریز می‌کند و شکل‌ها را پُرتر نشان می‌دهد. به همین دلیل است که توصیهٔ استاندارد در حالت تاریک، استفاده از وزن کمی نازک‌تر است.

این برای خط لاتین یک تنظیم ظریف است. برای فارسی سه پیامد جدی‌تر دارد:

• - نقطه‌ها به هم نزدیک‌تر می‌شوند. در آناتومی حروف نوشتم که تجمع نقطه پرتکرارترین نقطهٔ شکست قلم فارسی در اندازهٔ کوچک است. سرریز نوری دقیقاً همان مشکل را تشدید می‌کند — نقطه‌های ش و ژ و ث در حالت تاریک زودتر به هم می‌چسبند.
• - دندانه‌ها پُرتر می‌شوند. همان کلمهٔ پردندانه که در حالت روشن قابل‌قبول بود، در حالت تاریک ممکن است به یک لکه تبدیل شود.
• - و جبرانش سخت‌تر است. راه‌حل استاندارد «یک وزن نازک‌تر استفاده کن» است — اما وقتی قلم فارسی شما فقط دو وزن دارد، وزن نازک‌ترِ در دسترس یا وجود ندارد یا آن‌قدر نازک است که خودش خوانایی را از بین می‌برد.

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

جمع‌بندی

• - حالت تاریک طرح رنگی رابط را از روشن به تیره تغییر می‌دهد.
• - از میان فایده‌های رایجی که برایش می‌شمارند، تنها صرفه‌جویی باتری روی نمایشگر OLED سازوکار روشنی دارد؛ بقیه یا بدون ارجاع‌اند یا پژوهش نقضشان می‌کند.
• - پژوهش پدرسن و همکاران (۲۰۲۰) تفاوت معناداری در بهره‌وری و نرخ خطا پیدا نکرد؛ در محیط روشن متن تیره روی زمینهٔ روشن راحت‌تر خوانده می‌شود؛ و افراد دارای آستیگماتیسم یا نزدیک‌بینی ممکن است هاله ببینند.
• - راهنمای طراحی: پرهیز از مشکی خالص، کنتراست کافی، پرهیز از اشباع بالا، تطبیق جداگانهٔ تصاویر، و طراحی حالت روشن پیش از تاریک.
• - در شش جا می‌شکند: تصویر با زمینهٔ سفید، نماگرفت مستندات، رنگ برند، محتوای شخص ثالث، ایمیل، و سایه — و ناتمام‌بودنش از نداشتنش بدتر است.
• - دلیل واقعی ساختنش دو چیز است: یک نیاز دسترس‌پذیری واقعی برای گروهی کوچک، و یک ترجیح برای بقیه — و این دو پاسخ طراحی متفاوتی می‌خواهند.
• - تنظیم سیستم را دنبال کنید و در اولین اجرا نپرسید؛ دستگاه پاسخ به‌روزتری از کاربر دارد.
• - و متن فارسی در زمینهٔ تیره ضخیم‌تر دیده می‌شود: نقطه‌ها نزدیک‌تر و دندانه‌ها پُرتر می‌شوند، و چون قلم‌های فارسی وزن کم دارند، جبرانش را باید از راه کاهش کنتراست انجام داد نه تغییر وزن.