Тренды 2020. часть 3. ui/ux, графический дизайн, технологии

Мы можем часами говорить о веб-дизайне, но постараемся держать себя в руках.

Пользовательский интерфейс – вот, что значимо. Это то, как вы и ваши клиенты видят готовый продукт. Поговорим о том, какие тренды в этом направлении будут актуальны в 2020м: что ожидает увидеть пользователь и как упростить его жизнь взаимодействие с продуктом.

UI/UX ИЛИ ДИЗАЙН ИНТЕРФЕЙСОВ

Темный режим

От приложений и сайтов до оболочек операционных систем – темный режим повсюду. Тренд запустили крупные игроки – вроде Android, Google и Microsoft. В 2020м дизайнеры заботятся об удобстве просмотра контента (что напрямую связанно с его эффективностью) в любых обстоятельствах – в том числе в покрове ночи или приглушенном свете комнаты.

смелые цвета

Яркие цвета на пике популярности уже около двух лет и продолжают занимать свое место в списке трендов в 2020 году. Смелые, насыщенные, яркие неоновые оттенки создают настроение футуризма.

01. EMART UX/UI RENEWA by Plus X, Lee boram , Sabum Byun , Hee Jung, Youjin Jeon , 원 지혜, Bongho Choi
02. NSH by Sofiya Fedotova
03. Eldorado Casino - Mobile Web UI, App U by Loredana Papp-Dinea , Mihai Baldean , Milo Themes
04. mmcité+ website by Studio 9 Zlín, Pavel Valek
05. The Automated Hack Series #21-25 by Andrea Hock
06. Flipd app by Estudio Pum

Иллюстрации в интерфейсах

Иллюстрации выступают вспомогательными элементами, визуальной интерпретацией продукта, которая облегчает восприятие пользователем доносимой информации, концепции продукта.

01. Kraken Redesign by Sylvain Theyssens , Antonin Collard
02. Reliefy - Medical Project by Marcin Pankiewicz Gorzów , Miłosz Pożarkowski
03. Illustration System for GOL by Estudio Pum
04. Smart Home App - IOS by Maria Osadcha
05. Skilling Trading (skilling.com) - Loredana Papp-Dinea , Mihai Baldean

СТОРИТЕЛЛИНГ

Сторителлинг (прим.: от англ. рассказывать историю), как это принято сейчас называть, помогает пользователю быстрее ориентироваться в возможностях вашей платформы и упрощает восприятие продукта. Для этого используется прием создания уникального персонажа, который помещается в определенную ситуацию/историю, выходом из которой будет служить непосредственно продукт. Реализация этой схемы в дизайне может быть разнообразной, но суть всегда неизменна – герой показывает путь, который пользователь считывает.

01. YOGO - Trip Planner App by Julie Truong
02. UX/UI | Food delivery app by Konstantin Seredkin
03. cooc by cuneyt sen

Анимированная графика и микровзаимодействия

Во что бы то ни стало удержать пользователя – дизайнеры развлекают анимацией и направляют, помогая ненавязчивыми подсказками в нужный момент совершить определенное действие.

01. UI/UX | Smart Pharmacy app by Anastasia M, Sergey Nikonenko UX
02. Climate & Animals: Extinction Crisis Website UI/UX by Daniel Tan, Daphnie Loong
03. Flying Veggies by Patricia Reiners
04. UKRPOSHTA. Mobile app of Ukraine's national post by Ilona Kim
05.Alarm App for the Deaf by Tagir Tikeev

Функциональность

Функции во главе всего – никаких необдуманных решений и лишних элементов. Дизайнерские решения любого интерфейса несут свою функцию (привлекают внимание к нужным деталям, упрощают восприятие информации и т.д.), а не выбираются исключительно по принципу «красивости».

Skilling Trading (skilling.com) - Loredana Papp-Dinea , Mihai Baldean

внимание к деталям

При многообразии вариантов отличных работающих дизайнов все большее значение придается деталям. Кнопки управления, значки, навигация и др. – все имеет вес. При том, утерявшие свою значимость элементы будут уходить из дизайна – например, кнопка «Назад» (один из основных элементов навигации Android) официально исчезает в 10 версии ОС.

Alarm App for the Deaf by Tagir Tikeev

Градиенты

Да-да, снова они. Просто удачного цвета уже недостаточно, важна тонкая игра с ним.

01. Wavecut - IOS Application by Eleken Agency
02. Product design (UX/UI) - anti-depression app by Anna Arutiunian
03. Paul Ilea - Film Score Composer, Producer, DJ, Perfomer by Loredana Papp-Dinea , Mihai Baldean , Milo Themes
04. ITEXIA by Nextpage Agency , Alex Seagull , Jegor Walowski

графический дизайн

3D-ЭЛЕМЕНТЫ

3D пытается подвинуть 2D и в этом направлении дизайна – объем и «новая реальность» проявляются в виде иллюстраций, анимации или шрифтов.

01. Portraits by Fernando Domínguez Cózar
02. NASA | Space Age by Studio—JQ ∆
03. NASA X BBC | Unnatural World by Studio—JQ ∆

Биколор

Снова интерпретация на тему школы Баухаус – меньше, да лучше. Стильный контраст и смелые элементы с использованием ограниченного количества цветов.

01. Winter Open '18 by Kinoto Studio, Romina Rios, Luc Geoffroy​​
02. Synticate© by Stepan Solodkov
03. TIGER IN A MUSEUM by de_form studio, nora demeczky, eniko deri

ОПТИЧЕСКОЕ ИСКУССТВО

Оптическое искусство или «оп-арт» привносят ощущение движения, вибрации. При этом, сама картинка остается статичной, что имеет свои преимущества.

01 & 02 Tokyo Blends Film Festival by Mercedes Bazan , Adobe Live
03. Posters — Vol I by Xtian Miller

Иллюстрации

Как и в других областях дизайна, иллюстрации нашли свое место в графических трендах как понятный и стильный способ трансляции информации.

CAT bar and dance club / 2019 by kissmiklos , Eszter Sarah

анимированные постеры

Смешение 2D- и 3D-элементов приносит свои плоды – выглядит масштабно и интересно, что безусловно привлекает внимание пользователя.

Festival Metro Metro by Bzoing , Virginie Bédard

Retro Synthwave

Retro Synthwave – неоновые подсветки и световые лучи, навеянные электронной музыкой середины 2000х и голливудскими фильмами 80х – снова на пике популярности благодаря успеху сериала Stranger Things.

01. Cocktails and dreams by Gjorgji Despodov
02. C I N E M A X by Jeison Barba
03. Stranger Things (Netflix.com)

Швейцарский дизайн, дадаизм, баухауз

Классика 20-го века вернулась в моду в дизайнерском прочтении – шрифты без засечек, простые линии и геометричные формы.

Swiss poster 01 (typography terms) by Mehman Mammedov

Большое непрерывное цветовое пространство

Полотно цвета и смелые решения типографики – вот, что мы увидим в 2020м в дизайнах пользовательских интерфейсов.

01. Synticate© by Stepan Solodkov
02. Havaianas Branded Content by Johann Vernizzi
03. Kekkilä—BVB by Kurppa Hosk

Ультраминимализм

Ничего лишнего – девиз этого тренда. Все только самое необходимое и отсутствие перегруза элементами.

Andrei Gheorghe - DADA - Publishing by moodley brand identity

Технологии

AR ИЛИ ДОПОЛНЕННАЯ РЕАЛЬНОСТЬ

Тренд дополненной реальности пришел вместе с новыми нативными средствами разработки AR от Apple и Google, которые пока не безупречны, но заметно упрощают работу. Основная задача – научить пользователя взаимодействовать с этой новой реальностью, создавая не только интересные, но и интуитивно понятные приложения. Многие крупные компании уже применяют тренд на практике, зачастую применяя связь пользовательского интерфейса с повседневной жизнью.

VR ИЛИ ВИРТУАЛЬНАЯ РЕАЛЬНОСТЬ

Впереди новые способы использования данной технологии – виртуальная реальность перестает быть синонимом игровой индустрии. VR начинает проникать в более осязаемые сферы – образование, здравоохранение, туризм, недвижимость, архитектура и т.д.

VUI ИЛИ ГОЛОСОВОЙ ИНТЕРФЕЙС ПОЛЬЗОВАТЕЛЯ

Возможность поговорить с приложением все чаще используется в коммерческих проектах – распознавание речи для считывания голосовых команд и вопросов, преобразование текста в речь для воспроизведения ответа и т.д.

Число пользователей подобных приложений увеличилось на 10% по сравнению с прошлым годом.