Так сложилось, что кроме всего прочего я работаю дизайнером. Чтобы быть хорошим дизайнером нужно не только постоянно учиться, но и следить за мировыми трендами и веяними. Для этого лично я отслеживаю разные блоги, читаю тематические журналы и книги, смотрю красивые видео и наблюдаю за окружающим миром. Мои предпочтения в дизайне – минимализм (как ни странно), упор на типографику, работа с сетками и очень дотошный подбор цветовых палитр. Все, как в швейцарском дизайне. С учетом того, что это снова в тренде, моей радости нет предела. А последнее событие планетарного масштаба – презентация Apple на конференции WWDC – еще раз показало всем дизайнерам и армии сочувствующих направление движения. Это так называемый плоский дизайн. О нем я и хочу поговорить сегодня. Ведь это странное и такое противоречивое явление, которое будоражит умы всех, кто так или иначе имеет отношение к миру дизайна, особенно дизайна интерфейсов (UI).
Для начала, нужно вспомнить, с какой радости дизайнеры начали избавляться от рюшечек в виде теней, 3D-эффектов и градиентов в интерфейсах. Переломный момент произошел когда Microsoft представила нам свой новый визуальный язык – Metro, который начал использоваться в Windows Phone, а позже – в Windows 8.
Я не отслеживал на тот момент изменения в поведении дизайнеров (к примеру на Dribbble), но мне кажется, что у всех должна была случится истерика. Microsoft, которая никогда особо не заморачивалась с дизайном, внезапно выдала отличный пример инструментария визуальной коммуникации, фактически возродив традиции швейцарского дизайна. Конечно же, споры по поводу “фасада” Windows 8 до сих пор не утихают, но я считаю такой дизайн удачным. Почему? Потому что все эти плиточки и крупные шрифты значительно упрощают восприятие информации. Кроме того, предназначены они в первую очередь для планшетов. Именно планшеты задают ритм сообществу разработчиков и дизайнеров, занимая целую нишу относительно инновационных продуктов и предлагая кучу новых сценариев взаимодействия с пользователем. Именно благодаря смартфонам с touch screen, а потом и планшетам, плоский дизайн стал набирать такую популярность. Популярность, которая основывается на противопоставлении со скевоморфизмом.
Все эти текстуры, выпуклости и тенюшечки были трендом с того самого момента, когда Стив Джобс показал миру iPhone. До сих пор на Dribbble можно наблюдать интерфейсы и иконки с сумасшедшей детализацией, которую замизнаетекто называет “пидарасить пиксели“. Мне очень нравится смотреть на примерно такие иконки:
Но я все равно не представляю их в интерфейсе iPhone или iPad. Это уже перебор, ребятки! Такой дизайн хорошо сделать для себя любимого, чтобы прочувствовать свой уровень владения фотошопом; такая иллюстрация будет хорошо выглядеть в веб-дизайне, как header. Но микроскопическая иконка – зачем? А теперь подумайте, как будет выглядеть экран устройства с небольшим разрешением (я не беру во внимание retina-дисплеи) и десятком таких “красивеньких” иконок.
По причине излишней “правдоподобности” интерфейса я перестал пользоваться отличным органайзером – 2Do app. Я очень долго себя уговаривал, но все же отдал предпочтение Wunderlist. Чтобы не быть голословным, сравните мобильные версии двух приложений:
Меня жутко бесит иррациональное использование пространства, перенасыщение текстурами и тяжелыми визуальными элементами в 2Do. Хотя и Wunderlist не блещет идеальным дизайном, но с ним работать на порядок приятней. Почему разработчики 2Do не сделают редизайн с учетом последних трендов, разгрузив интерфейс и избавив пользователя от мук работы с чем-то, отдаленно напоминающем блокнот? Тут-то и кроется основная ловушка скевоморфизма: подмена понятий. Если мне захочется поработать с блокнотом, я возьму настоящий бумажный блокнот, ручку и руками буду писать или рисовать. Все, точка! Это касается всего – и текстур дерева, кожи, бумаги; и использования 3D и теней. Мне нужен простой, понятный, лаконичный и работающий интерфейс. А не солянка из свистоперделок.
Apple решила выбросить на помойку бочку с этой солянкой и родила то ли сына, то ли дочь – iOS 7.
Когда я смотрел презентацию, то не мог поверить своим глазам. Я вообще не мог поверить, что великий Джонатан Айв смог сделать ЭТО. Ведь ЭТО напоминает скорее работу человека, который только что освоил фотошоп. ЭТО напоминает мне самолет, который сделали бы посудомойщицы, если бы их попросили сделать самолет. ЭТО напоминает мне книгу, написанную в пьяном угаре. ЭТО напоминает все, что угодно, но только не мать его Apple! И это не плоский дизайн. Это китч.
Естественно, что можно обратиться к совершенно потрясающему аргументу “сперва добейся“. Дескать, это же делал Сэр Джони Айв, а не хрен моржовый! А значит, априори ЭТО должно нравится всем. Всем, но не мне. Я не вижу ничего, что мне могло бы понравиться. Кислотные цвета, убогие интерфейсные решения, отсутствие целостности и, черт возьми, серьезности. Полярность. У меня (и не только) есть такое ощущение, что была поставлена задача избавиться от проклятого скевоморфизма любой ценой и сделать НЕЧТО совершенно противоположное. Что же, к несчастью, команде Айва это удалось.
А вот как бы мог выглядеть дизайн iOs7:
Мне кажется, что эти варианты на порядок лучше. Да, они не всегда отвечают основным принципам плоского дизайна, но это же здорово – не бросаться в крайности! Не нужно лепить текстуру там, где можно обойтись без нее. Не нужно фокусироваться на одной гарнитуре (огромный булыжник полетел в сторону Helvetica Neue). Не нужно выкручивать взрывающие мозг цвета. Нужно искать срединный путь, гармонию, если хотите. Можно добавить градиент или аккуратную тень, можно даже воспользоваться текстурами, но сделать это грамотно, незаметно для пользователя. Как не вспомнить один из принципов Дитера Рамса:
Хороший дизайн — это как можно меньше дизайна.
Ниже те примеры, которые мне очень нравятся и полностью соответствуют моим представлениям о плоском дизайне:
Все они так или иначе отступают от канонов стиля, но это хотя бы не напоминает творчество роботов. Но если вы хотите творить в супер-минималистичном направлении, и в конце концов чтобы ваш дизайн мог гордо называть плоским, нужно учитывать следующие особенности:
- Полное отсутствие таких эффектов, как тень, вдавливание и выдавливание, градиенты или другие фишки для создания глубины
- Простые элементы, которые базируются на геометрических примитивах – квадрат, круг, треугольник
- Внимание к типографике
- Внимание к палитре цветов
А что вы думаете о новых трендах в дизайне пользовательского интерфейса в целом и о плоском дизайне в частности?
Полезные ссылки:
Skeuomorphism in User Interface Design, What is It?
Principles of Flat Design
Apple’s Flat Design Falls Flat on Wall Street