Вконтакте
Instagram
YouTube
Behance
Medium
Telegram
Контакты
Статьи и вебинары

UI тренды 2019

Вангует Алексей Костенков
Алексей Костенков — автор курса в WDI по созданию анимаций интерфейсов в Adobe After Effects — расскажет тебе, чего ждать от 2019 в сфере UI.

А какие тенденции ты добавишь в этот список? Какой пункт станет главным трендом?
Дизайн = доверие
Согласно исследованиям Adobe 94% пользователей не чувствуют доверия к сайтам
с устаревшим дизайном и слабо проработанным UI. Если на сайте неплохой интерфейс,
но визуал страдает, то пользователь не задержится на сайте.

Исследование проводилось с поправкой на западного пользователя. В России людям старшего поколения не интересен трендовый дизайн. Фокус их внимания сосредоточен
на реальной жизни. Для них главное — найти кнопку «заказать» и получить товар/услугу
в короткий срок. Поэтому дизайнер придумывает скучный визуал, который не прощает молодая аудитория.

Но есть исключения. Ребята из веб-студии Chipsa создают трендовые сайты, не обращая внимания на стереотипы, что 50-летний дядя Вася не поймет, что такое «бургер меню».
Стандартные слайдеры = зло
Люди устали от слайдеров на главной странице. Логика пользователя такая:

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

Поэтому сначала покажи то, ради чего пользователь кликнул на сайт.
В России дизайнер сначала проектирует под ПК, потом адаптирует под меньшие разрешения. В 2016 мобильный трафик сравнялся с трафиком ПК, а в конце 2018
превысил его.
Теперь дизайнеры думают, как сделать проект на смартфонах, а потом под ПК, но не всегда. Например, пользоваться интернет-магазином удобнее на большом экране, поэтому дизайнер сначала придумывает проект для компьютера, а потом для мобильных телефонов.
Тренды UI 2019
Обрати внимание на следующие тренды, чтобы создавать современный дизайн, избегать банальностей и приносить пользу клиентам в 2019.


1. Объем

Плоский интерфейс к 2019 стал однообразным и скучным. Будущее веб-дизайна — использование 3D-интерфейса, но это сложная задача. Пока что дизайнеры нашли выход: применяют иллюзию глубины с помощью тени. Так пользователь фокусирует внимание
на объемной иконке или товаре, что подтолкнет его к покупке/регистрации/переходу (нужное подчеркнуть).



2. Минимализм и простота

Правило 5 секунд (время, за которое клиент понимает, останется на сайте или нет), сократилось до 2-3. Цель дизайнера — показать, что хочет видеть пользователь (товар
или услугу), и расположить детали (телефон, условия доставки) так, чтобы клиент быстро нашел их при желании.



3. Эффект «наложения графики»

Эффект, когда текст накладывается на картинку, будут активно использовать в 2019. Наложение графики создает иллюзию глубины слоев без использования 3D-инструментов.
4. Безрамочный дизайн, скругленные углы

Производители смартфонов и телевизионных экранов постепенно уменьшают расстояние между контуром дисплея и краями устройства. Вырос КПД полезной площади.

Пользовательский интерфейс постепенно смещается от рамочных контуров к плавным линиям в сочетании с закругленными краями. Это создает полноэкранный безрамочный обзор. Например, Apple оставил на iPhone место только для наушников, а остальную площадь экрана занимает интерфейс.

5. Микроанимации

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

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

Заключение
Люди хотят наслаждаться современным дизайном и сразу же получать то, ради чего они зашли на сайт или скачали приложение. Поэтому запомни тренды UI 2019:
– Объем
– Минимализм и простота
– Эффект «наложения графики»
– Безрамочный дизайн и скругленные углы
– Микроанимации






Автор статьи: Алексей Костенков
Редакторы: Анна Кобзе, Настя Кошелева
Если хочешь научиться анимировать свои макеты, заходи на курс Анимация от WDI
На курсе ты научишься:

– Анимировать PSD-макеты в Adobe After Effects.
Наладить взаимодействие с front-end отделом.

– Использовать анимацию в кейсах на Behance
Повысить уровень портфолио, чтобы получить новых клиентов.

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

– Передавать эмоции посредством анимации в презентациях и интерфейсах

– Монтировать видеопрезентации в Adobe Premiere. Демонстрировать все возможности проекта заказчику: куда вносить свои данные, как листать изображения, где кнопка «заказать».

– Проектировать интерактив с пользователем в веб и мобайл.
Определять потребности целевой аудитории.

– Сделаешь продукт, который запомнят.


В итоге у тебя будет два упакованных кейса с анимациями для портфолио.
Стоимость курса:
12 900 P