socialgekon.com
  • Основен
  • Back-End
  • Уеб Интерфейс
  • Рентабилност И Ефективност
  • Ui Design
Ux Дизайн

Тъмни потребителски интерфейси. Добрите и лошите. Какво трябва да се направи и какво не

Тъмните потребителски интерфейси са драматични, елегантни и елегантни. Дизайнерите обаче трябва да стъпват внимателно, ако решат да ходят по 'тъмната страна'.

Създаването на външен вид на даден продукт е една от основните отговорности на дизайнера - първоначалното дизайнерско решение трябва да отговаря на целта на продукта, конкретната ситуация и неговата аудитория. Цветовата схема ще има трайно въздействие и трябва да бъде внимателно подбрана - и всичко започва с избора на фон, върху който ще бъдат поставени дизайнерските елементи - „платното“. Обичайната опция, почти по подразбиране, е бял фон.

Има основателни причини да изберете ярък фон. Контраст, текст и четливост и способността за работа с широка гама фини цветове са някои от тях. Според много научни изследвания, оптималната четливост изисква черен текст на бял фон. Брандирането също може да повлияе на решението, тъй като фирмените лога и цветове няма да работят с тъмна цветова палитра.

Повечето изследвания показват, че тъмният текст на светъл фон превъзхожда светлия текст на тъмен фон, което означава, че е по-лесен за четене. В известно проучване 'напрежението на очите' е значително по-високо, когато субектите четат светли символи на тъмен фон срещу тъмни символи на светъл фон ( Bauer, D., Bonacker, M. и Cavonius, C. R. 1983 ).

Има и очакване - Хората са свикнали да виждат разнообразно съдържание, изобразено с тъмно мастило на бял фон, представено до изображения. Помислете за вестници и списания - те съществуват повече от 350 години. Връщайки се още по-далеч: тридесет и пет години и половина до ерата на палеолита (дните на пещерния човек), откриваме пещерни рисунки на лъвове и мамути, обикновено поставени на светъл фон с въглен или изгорени кости, използвани за рисуване на изображенията.

Праисторическа живопис в пещерата Шове, Франция

Тридесет хилядолетните праисторически картини в Пещера Шове, Франция

Въпреки това, когато даден проект го гарантира, настоящи дизайнери на дигитални продукти Те могат да изберат да работят с тъмна цветова схема по различни причини. Както беше предложено по-горе, често това е естетически избор, предназначен да предаде драма и да предизвика емоция - нещо неочаквано - или може би дизайнер искате да обедините дизайна с марката или да се уверите, че визуалното съдържание се откроява.

Apple Dark UI Опция за Apple TV

За Apple TV сайтът на Apple преминава към тъмен потребителски интерфейс за драматични ефекти и тъй като използването му често е свързано с нощни забавления.

Ако обаче дизайнерът реши да премине към „тъмната страна“, той ще бъде изправен пред редица предизвикателства. Всички видове проблеми с използваемостта влизат в сила - главно свързани с възможност за сканиране, четливост и контраст. Основният аспект, който трябва да се вземе предвид, е достатъчен контраст между текста и фона. Контекстът (случай на употреба) и околната среда също трябва да бъдат взети под внимание, както и устройството, на което потребителският интерфейс е вероятно да бъде видян.

Breitling решиха на черен фон, за да откроят дизайна на часовниците си.

Breitling решиха на черен фон, за да откроят дизайна на часовниците си.

Някои неясни потребителски интерфейси са проектирани да минимизират „цифровото напрежение на очите“. С възхода на цифровите технологии ние гледаме на екраните през по-голямата част от деня. Дигитално напрежение на очите Това е често срещано състояние, което засяга ежедневно милиони хора. Причинено от всичко - от прекомерна употреба на компютър до редовно излагане на ярка светлина, може да причини главоболие, болки във врата, замъглено зрение и парене / сърбеж в очите.

Има дори неща като синдром на компютърното зрение (CVS) и „очен дискомфорт“. Според едно проучване над 83 процента от американците използват цифрови устройства за повече от два часа на ден, като 60,5 процента съобщават, че изпитват симптоми на дигитално напрежение на очите. ( Преекспонирани очи: Дилема на цифровото устройство .)

Продуктите SaaS за бизнес и приложенията за мултимедийно редактиране се използват в продължение на много часове. Много от тях са проектирани в потребителски интерфейс с тъмна тематика, за да намалят напрежението в очите, като същевременно осигуряват визуална яснота. Този подход обаче изисква внимателна първоначална оценка на посоката на проектиране.

Тъмни потребителски интерфейси за приложения за iOS на Bloomberg Anywhere

Приложения на iOS от Bloomberg Anywhere (от Джеръми Фуерст ).

Повечето разработчици използват черен екран с цветен синтаксис, за да намалят напрежението в очите. Както е разкрито от ApeeScape Developer Кевин Блох : 'Черен фон намалява напрежението в очите и улеснява четенето на автоматичното цветно кодиране, което прави кода много по-бърз за разбиране с един поглед.'

Програмистът на ApeeScape Амин Шах Гилани | добавя: „Аз лично използвам тъмната соларизирана тема за моя редактор на кодове. Предпочитам тъмна тема, защото по-тъмният фон се усеща по-лесно за очите, особено след като обичам да поддържам осветлението тъмно или да работя през нощта.

ApeeScape Developer Code Editor Amin Shah Gilani от Atom

Редакторът на код за разработчици на ApeeScape Амин Шах Гилани | от Атом .

Потребителските интерфейси на видеоигрите също са склонни към по-тъмни теми. Контекстът на играта и средата, в която играчите са в игра, са най-подходящи за черна цветна палитра. Дизайнът на черен фон подсилва поразителните визуални ефекти, въвежда усещане за мистерия, има по-добър контраст и поддържа визуална йерархия.

Оформление на Halo App за Windows с тъмен фон

Когато тъмните потребителски интерфейси работят правилно

Повечето потребителски интерфейси, свързани с развлечения (интелигентни телевизори, конзоли за видеоигри и приложения за телевизия и филми) са склонни да имат оформления на потребителския интерфейс с тъмна тематика - и с добра причина. Повечето дейности, свързани с развлечения, се случват през нощта, гледани от разстояние 6-10 фута и гледани в слабо осветени стаи - с други думи, екранът съответства на околната среда. Освен това цветното съдържание (например корици и промоции) се откроява драстично в тъмните тематични потребителски интерфейси.

Целта е да се съобрази с контекста на заниманието: „Стъмнява се, отпуснат съм и искам да гледам телевизия“. Подобно на хиляди малки крушки, цифровите дисплеи сияят светлина навсякъде, където има ярък пиксел; следователно яркият потребителски интерфейс би озарил стаята - нежелан ефект предвид дейността. В този сценарий дизайнът на потребителския интерфейс се опитва да съответства на контекста: устройство, съдържание, активност и среда.

Тъмен потребителски интерфейс за Hulu

Хулу

Тъмен потребителски интерфейс за Netflix

Нетфликс

Тъмен потребителски интерфейс за Apple

iTunes от Apple

В правилния контекст, среда, приложение и употреба, потребителските интерфейси на черен фон имат смисъл. Винаги обмисляйте контекст в кой интерфейс е вероятно да се използва. Но това надхвърля това - изборът да отида с него трябва да зависи съдържание и контекст : че , кога къде Y. на кое устройство .

  • За силен и драматичен външен вид за привличащи вниманието изображения

  • Проектирайте чувство за стил и елегантност, лукс и престиж

  • Създайте усещане за интрига и мистерия

  • За да ви помогне да фокусирате и насочите вниманието на потребителя с минимално разсейване

  • Поддържа визуална йерархия и информационна архитектура

Концепция за дистанционно управление и диагностична кола

Концепция на автомобил за дистанционно управление и диагностика от Ramotion .

Тъмните потребителски интерфейси трябва да се използват само с минимален и оскъден текст и „набита“ информация със силен акцент върху изображенията - светлина върху текста. Ако се използва текст, той трябва да е в силен контраст с тъмния фон - за предпочитане чисто бял или друг силен цвят (не тъмно сив) на черен фон.

Тъмна цветова палитра със силен контраст за текст и изображения на уебсайт

CINEMATEK, филмов архив в Брюксел, използва черен фон за драматичен ефект.

Когато тъмните потребителски интерфейси не работят правилно

Както бе посочено по-рано в статията, потребителските интерфейси с тъмна тема са лош избор за съдържание с тежък текст и съдържание, наситено с данни, или когато се използват различни видове съдържание (текст, изображения, видео, таблици с данни, падащи менюта, полета и т.н.). Общият консенсус в дизайнерската общност е, че неясните потребителски интерфейси са огромно предизвикателство за дизайна, освен ако не е просто съдържание и просто разпръскване на текст тук и там.

Предизвикателството се опитва да поддържа достатъчен контраст, който влияе върху общото предизвикателство: четливост, която е свързана с използваемостта, която засяга UX. Като цяло всички цветове работят на бял фон, докато на тъмен фон полезната гама от цветове е драстично намалена.

Оформлението на черен фон за анализ трябва да се подхожда внимателно

В този пример има недостатъчен контраст в някои елементи на потребителския интерфейс, засягащи UX (от GUOHAO.W )

Ето истински пример за това кога да не използвам потребителски интерфейс с тъмна тематика: участвах в B2B SaaS проект, където изпълнителният директор беше непреклонен, и за да бъда „различен“, исках да използвам тъмна тема на потребителския интерфейс - която отговаря на компанията марка ... за цялата платформа. За всички. След няколко срещи и обединяването на дизайнерския екип и продуктовите мениджъри зад каузата успяхме да го убедим в потенциално катастрофално решение.

Платформата използва стандартен набор от компоненти на потребителския интерфейс на приложението SaaS и следователно е пълна с формуляри, джаджи , падащи списъци, пиктограми и икони заедно с текстови и цифрови данни в таблици. Навигацията, оформлението и функционалността биха станали невероятно трудни за работа, като същевременно се постигне достатъчен контраст и последователна цветова схема. Накратко, би било почти невъзможно всичко да работи с потребителски интерфейс с тъмна тема.

В зависимост от удобството на приложението, може би правилният избор би бил да предложите a смес светли и тъмни потребителски интерфейси. Например, конфигурационни страници с джаджи и формулярите и таблиците с данни биха могли да бъдат проектирани със светъл фон, а аналитичните страници с графики - с по-тъмна цветова схема.

Потребителски интерфейс на Google Analytics

Потребителският интерфейс на таблото за управление, анализи и инфографики работят добре в тъмен потребителски интерфейс, но все пак трябва да се третира внимателно, за да се осигури достатъчен контраст (от Алекс Гилев ).

Правилата за използване или не използване на тъмни потребителски интерфейси

В заключение, решението да се използва тъмен потребителски интерфейс трябва да се подходи внимателно. Дизайнерите Не бива да го правите по грешни причини - за да сте модерни, да сте различни или да копирате чужд дизайн. От решаващо значение е дизайнерът да вземе предвид контекста, съдържанието (контраст и четливост), устройството и случая на употреба и да има основателна причина да избере. Това е деликатен балансиращ акт, тъй като има потенциално много ползи, но и много клопки.

Когато е добре да използвате тъмни потребителски интерфейси:

  • Когато цветовата схема на марката го поддържа

  • Когато дизайнът е оскъден и минималистичен с много малко съдържание

  • Когато е подходящо за контекст и употреба, като приложения за забавление през нощта

  • За да се намали напрежението на очите, като страници за анализ, които се използват за дълги периоди от време

  • Да предизвика емоция - например усещане за интрига и мистерия

  • За да създадете поразителен и драматичен външен вид

  • Създайте усещане за лукс и престиж

  • За поддържане на визуалната йерархия

Кога е по-добре да стоите далеч от тъмния потребителски интерфейс:

  • Когато има много текст (четенето на тъмен фон е трудно)

  • Когато на екрана има много микс от съдържание

  • В случай на B2B приложения с много форми, компоненти и джаджи

  • Когато дизайнът изисква широка гама от цветове

Оформлението на черен фон за видео игри не винаги работи

Въпреки че е игра, много видове смесено съдържание не работят добре с тъмна цветова палитра.

Към преминаването към „тъмната страна“ трябва да се подхожда внимателно. По-нататъшни и задълбочени изследвания и анализи се препоръчват, преди да вземете потенциално несигурно и сложно решение. След като дизайнерът тръгне по този път, е много трудно да се върне назад. Дизайнерите биха били добре посъветвани да разгледат всички аспекти - добрите и лошите, какво да правят и какво да не правят, преди да скочат на двата крака.

Ръководство за Monorepos за Front-end Code

Подвижен

Ръководство за Monorepos за Front-end Code
Ръководител на публикации

Ръководител на публикации

Други

Популярни Публикации
ApeeScape стартира Staffing.com, за да насочи напред концерта, свободната практика и икономиката на талантите
ApeeScape стартира Staffing.com, за да насочи напред концерта, свободната практика и икономиката на талантите
Защо вече трябва да надстроите до Java 8
Защо вече трябва да надстроите до Java 8
Stars Realigned: Подобряване на системата за оценяване IMDb
Stars Realigned: Подобряване на системата за оценяване IMDb
Решения, а не изкуство - истинската бизнес стойност на дизайна
Решения, а не изкуство - истинската бизнес стойност на дизайна
Управление на отдалечени фрийлансъри? Тези принципи ще помогнат
Управление на отдалечени фрийлансъри? Тези принципи ще помогнат
 
Видео анализ на машинно обучение: Идентифициране на риби
Видео анализ на машинно обучение: Идентифициране на риби
Проучване на мечото дело на криптовалутния балон
Проучване на мечото дело на криптовалутния балон
Пълното ръководство за филтрите на камерата на iPhone (включително скритите)
Пълното ръководство за филтрите на камерата на iPhone (включително скритите)
Първи стъпки с модули и модулна разработка отпред
Първи стъпки с модули и модулна разработка отпред
Как да прехвърляте снимки от вашия iPhone на друг iPhone или iPad
Как да прехвърляте снимки от вашия iPhone на друг iPhone или iPad
Категории
ПодвиженНаука За Данни И Бази ДанниПродукти Хора И ЕкипиТехнологияСтрелбаUi DesignЖизнен Цикъл На ПродуктаСъвети И ИнструментиУправление На ПроектиРедактиране

© 2023 | Всички Права Запазени

socialgekon.com