Тренд на flat-дизайн уходит в прошлое? Разбираемся на примерах
Тренды дизайна подошли к развилке. Налево пойдешь — в плоский дизайн попадешь, направо посмотришь — а там уже виднеются более реалистичные и трехмерные элементы.
Тренды в дизайне, как и в любой другой сфере, приходят и уходят. Мы, например, недавно писали, что в тренде в графическом дизайне в 2024 году. Но одним из глобальных трендов, который держится на плаву уже долгое время, является flat-дизайн (если переводить дословно — «плоский» дизайн). Вы видите его повсюду: кнопки внутри интерфейсов, логотипы с тенденцией на упрощения т.д. Возможно, сейчас мы стоим на пороге больших перемен! На это наталкивают несколько недавних примеров большого редизайна известных компаний. В этой статье мы постараемся их рассмотреть, а также проследим, как менялся UI в последнее время.
Как flat-дизайн стал трендом?
Flat-дизайн вошёл в моду где‑то в 2013 году. Именно тогда компания Apple выпустила свою iOS 7. Как станет известно позже, их дизайн-решения полностью изменят правила игры. Конечно, не всё сводится к этому событию, так как Apple позаимствовала дизайн-приёмы, которые уже были на вооружении у других компаний (например, Windows Mobile уже использовала полностью плоский дизайн). Однако то влияние, которое компания оказала на индустрию UI (как «законодатель мод»), невозможно переоценить.
iOS 7 полностью сменила «язык дизайна» iOS. Более реалистичный 3D дизайн был заменён простым и «плоским». Тим Кук — генеральный директор Apple — назвал это «самым большим изменением iOS со времён выхода iPhone». Собственно, именно тогда на арену вышел стиль под названием минимализм, который уже многие годы удерживает звание главного тренда в дизайне интерфейсов. На нашем YouTube канале, кстати, есть видео про то, что такое минимализм, и почему он так популярен.
Системные иконки в iOS 6 — слева, и iOS 7 — справа
Как вы можете видеть выше (iOS 6 — слева, iOS 7 — справа), большинство 3D-элементов были удалены, а все элементы стали более простыми. Прошло почти 11 лет, а большинство современных интерфейсов по‑прежнему используют этот стиль в своих продуктах. Однако некоторые его аспекты начинают меняться, поскольку дизайн снова берет курс на трехмерность и немного более «сложные» формы. Давайте рассмотрим несколько недавних примеров.
Редизайн бренда Reddit
Начнём со «свежатинки»! Недавно компания Reddit изменила свой логотип, обновив как визуализацию символа, так и стиль написания слова. Как вы можете видеть, маскот компании (Snoo), стал более проработанным и приобрёл 3D эффекты. Последнее время мы редко видим логотипы, которые сделаны не в стиле flat. Однако компания Pentagram (которая работает со многими мировыми брендами, в том числе и Reddit) выбрала именно это направление. Это значит, что 3D визуализация, с высокой долей вероятности, будет появляться в известных лого всё чаще.
Важно отметить, что современные логотипы упрощались и становились все более «плоскими» не просто так. Это напрямую влияло на скорость их «сканирования», а также возможности размещения на любых поверхностях (flat-дизайн проще масштабировать, переводить в монохромный вариант и т.д.). Интересно посмотреть, как другие компании будут обновлять свои бренды в ближайшем будущем!
Старый (слева) и новый (справа) логотип Reddit
Иконки в MacOS Big Sur
Давайте вернёмся на несколько лет назад, в 2020-ый. В ноябре того года Apple выпустила MacOS Big Sur с обновлённым набором иконок. Возможно, именно это событие посеяло в почву дизайна зёрнышко возвращения к более детализированному дизайну с элементами 3D.
В Big Sur Apple начали добавлять больше деталей в иконки приложений, чтобы они не выглядели слишком плоскими. Как вы можете видеть выше, теперь иконки имеют более глубокие тени и градиенты. Это помогло добавить объёма и сделать их более детализированными. Важно добавить, что многие разработчики приложений последовали примеру Apple и обновили свои иконки, придав им больше трехмерности, чем раньше.
Иконки в MacOS Big Sur
Новый дизайн Airbnb
Airbnb, обновив дизайн своего приложения в прошлом году, добавил немного «3D-шности» в свой достаточно «плоский» дизайн. Посмотрите на новую «фичу» — «паспорт хозяина». Она напоминает настоящую книгу. А если провзаимодействовать с объектом, то он даст отклик в виде анимации, которая имитирует открытие книги в реальной жизни. А чтобы добавить глубины и акцента, Airbnb использовали глубокую тень.
Реализация функции «паспорт хозяина» на сайте Airbnb
Другой пример — элементы «выбор гостей» и «выбор дат путешествия». Как видно выше, новый раздел «выбор гостей» сопровождается приятным 3D-объектом в стиле лаврового венка. А выбор даты (в разделе «месяцы») можно осуществить с помощью нового «циферблата», который стал более реалистичным благодаря градиентам и теням. При этом дизайнеры из Airbnb сохранили от самый эффект эстетики. После редизайна сервис кажется ещё более удобным и «собранным».
Новые 3D элементы на сайте Airbnb
Обновлённая дизайн-система Shopify
Компания Shopify обновила свою дизайн-систему Polaris, добавив в неё новый стиль оформления элементов. Старые плоские кнопки теперь стали меньше и более реалистичными за счёт 3D-эффекта.
Редизайн имеет смысл. По словам команды, flat-стиль, который они использовали до этого, был призван сделать UI более чистым, упростить работу пользователя с интерфейсом. Однако со временем те пользователи платформы, которые добавляют контент, стали называть админ-панель «скучной», «унылой» и «безвкусной». Главной целью редизайна было повышения доверия, чтобы админ-панель стала больше похожа на «профессиональный инструмент».
Редизайн кнопок в системе Shopify
Что в итоге? Переходим на 3D?
Современные тренды побуждают больших игроков развиваться именно таким образом, добавляя больше деталей в свой стиль. И дизайнеры, и разработчики должны быть готовы к тому, что такая практика будет укореняться все сильнее, ибо она становится обычной для ведущих продуктов.
Источник: UX Collective
