Плохой дизайн убивает. Хороший делает жизнь проще. Блестящий — меняет мир. Классическое образование никогда не поспеет за скоростью развития отрасли. Начинающим сложно вскочить в этот поезд. Но можно. За последние два года я посетил десятки конференций, общался с дизайнерами лидирующих компаний, работал над несколькими проектами и обнаружил схожесть в развитии многих специалистов. К полученным знаниям прибавился личный опыт и в итоге получился материал, который я мечтал бы прочитать три года назад.
Главная ошибка
Главная ошибка начинающих дизайнеров — забывать, что такое дизайн.
Дизайн незаметен.
Его сложно описать скриншотом или вставить в мокап. Это не картинка и не файл. Ты осознаешь хороший дизайн, только столкнувшись с плохим. Потому что дизайн — это решение проблемы.
Я понял это не сразу, ведь как и многие увлекался визуальной частью, вместо того, чтобы выполнять задачу, то есть решать проблему клиента и упрощать жизнь пользователю.
Руководитель портальной дизайн-команды Mail.Ru Group Юрий Ветров поддержал эту мысль:
«Главная ошибка начинающих дизайнеров — это упор на рисование экранов вместо того, чтобы думать об общей картине (бизнес-задачи, сценарии взаимодействия и ожидания пользователей)».
Всегда полезно послушать идеи клиента, но вы вправе сделать все по-другому, если это упрощает использование продукта.
«Люди сами не знают чего они хотят, пока им это не покажешь» — Стив Джобс.
Я помню, как два дня безуспешно ходил по магазинам Zara, Reebok, Nike в поисках простых, но современных кед. Тогда я впервые зашел в Lacoste и сразу нашел то, что хотел. В подобных магазинах вещи простые, качественные и их дизайн не меняется в зависимости от моды. Внешний вид эволюционирует, но дизайн стабильно решает одну проблему с которой столкнулся и я — поиск простой, качественно и стильной обуви.
Базовые принципы дизайна применимы в любой отрасли. Не столь важно какой сейчас тренд. Если вы решили проблему, и ваш интерфейс не нагоняет тоску, вы все сделали правильно.
Интересно, что когда я спросил, какие еще ошибки совершают начинающие, Юрий ответил:
«Бездумное использование (или неиспользование) паттернов, потому что они всегда хороши для одной и плохи для другой задачи»
Похожую мысль высказал дизайнер продукта в Badoo Павел Шумаков:
«Начинающие дизайнеры пытаются сделать сразу все по правилам. Но пока ты не поймешь, что делаешь, думать о модульной сетке, иконках не имеет смысла. Пробуи?те разные варианты, убираи?те все лишнее, экспериментируи?те. Лучше начать с хаоса и навести порядок, чем наоборот».
Как избежать главной ошибки?
Грамотно построенный дизайн-процесс избавляет от типичных ошибок и способствует озарениям, значимость которых очень велика.
Мой дизайн-процесс, основанный на личном опыте и курсе от Tilda Publishing, выглядит следующим образом:
— Изучение задачи. Я рисую простые схемы, чтобы наглядно описать задачу. Пытаюсь выявить основные задачи и проблемы, с которыми сталкивается пользователь. Акцентирую внимание на этом и дорабатываю схему. Чаще всего это mind map;
— Исследование. Я просматриваю собранные коллекции на Pinterest, ищу похожие работы на Dribbble, нахожу сайты компаний, чей продукт схож с задачей. Думаю, что можно применить к моей задачи. К концу исследования в голове уже есть несколько вариантов реализации. Остается выбрать верный;
— Решение. Мне нравится делать наброски интерфейса на листах формата А4. Я делаю от 3-х до 20-ти. Начинаю с общего видения интерфейса, а после смотрю удобен ли он для реализации всех функций.
— Макет. В Sketch я реализую выбранный интерфейс. Делаю перерыв. После смотрю свежим взглядом. Вношу изменения. Думаю, как можно сделать по другому. Делаю. Сравниваю. Если нужно, возвращаюсь к этапу 3;
— Обратная связь. Показываю работу и вношу изменения.
Главные навыки начинающего дизайнера
Виртуозное владение Photoshop или Sketch не сделает начинающего профессионалом. Да и профессионалам не следует забывать о нескольких вещах, которые я подчеркнул из общения, статей, курсов и личного опыта.
Развитие (постоянное). Дизайнер знает, как решить проблему многими способами, потому что он посмотрел сотни работ. В этом помогут дизайнерские ресурсы, как Dribbble, Awwards и блоги дизайн-студий. Понравившиеся работы собирайте в коллекции на Pinterest, сортируя по типам (Mobile Profile, Media и т.п.).
Процесс. Следуйте алгоритму. Но и экспериментируйте. Все всегда можно улучшить;
Инструменты. Сейчас их много. Практически любой из готовых макетов может собрать прототип или сделать анимацию. Начинающим не нужно распыляться. Сначала изучите Sketch или Photoshop, а после переходите к другим;
База. Цвета. Типографика. Сетки. Нужно знать. На старте хотя бы поверхностно. Интернет, статьи, курсы помогут.
Что делать прямо сейчас
Практика — лучший способ овладеть профессией. На старте важно набрать портфолио, пускай и из выдуманных заданий. Хорошо продуманное решение, пускай даже одно, сильно поможет в продвижении.
Сделать первый основательный шаг вам поможет следующий план:
1. Поставьте задачу. Возьмите устаревший сайт или придумайте свой. Запишите задачу, как будто её вам передал клиент;
2. Выделите основные элементы. Решите какие блоки будут на сайте (меню, контент, фото и тп);
3. Найдите как минимум пять сайтов с похожей структурой. Подумайте, какие сайты по структуре похожи на ваш. Если ваша цель сделать спортивный сайт, то можно брать за пример новостной. Если это landing page, то загляните на land-book.com;
4. Спроектируйте один экран. Бумага и ручка — все, что нужно. Набросайте несколько вариантов расположения элементов. Теперь у вас есть опыт, так как вы просмотрели много похожих сайтов. Выберите один вариант, который как вам кажется лучше выполняет главную задачу;
5. В Sketch или Photoshop реализуйте рисунок. Не зацикливайтесь сразу на цветах. Сначала сделайте черно-белым. После добавьте акцентный цвет на ссылки и кнопки. Обращайте внимание на размеры элементов, текста, а так же межстрочный интервал. Плохо сверстанный текст бросается в глаза;
6. Найдите на Facebook дизайнера и попросите его прокомментировать ваш дизайн. Выслушивать критику сложно, но полезно. Об этом же говорит Павел:
«Зачастую начинающего дизайнера критикуют такие же дизайнеры и часто полезность таких комментариев не очень высока. Нужно научиться фильтров то, что вам говорят и пишут, в противном случае вы никогда не услышите возможно мелкие, важные замечания из всей каши».
Заключение
Дизайн — это талант? Я не знаю. Но я точно знаю, что если бы не просмотрел сотни работ, не прочитал десятки статей и не завершил несколько проектов я бы не оказался на месте дизайнера продукта. Если вы намерены стать дизайнером будьте готовы, что первые работы будут ужасны. Дорабатывайте их. Смотрите примеры и думайте, почему у других получилось, а у вас нет. Исправляйте. Снова практикуйтесь и когда-нибудь вы взгляните на свою работу и скажите «Это круто».
Спасибо Павлу Шумакову и Юрию Ветрову за комментарии. Мы все выиграем, если русскоязычное дизайн-сообщество будет развиваться. А это зависит только от нас.
Комментарии (18)
Fenomen51
11.09.2016 07:36Система сама по себе ограничивает. Упоминаете паттерны и сами используете готовые методы проектирования. Берём готовый процесс — получаем типовой результат. Это не всегда плохо, но когда берёшь в руки фотоаппарат, нахваленный эргономичностью, стоимостью несколько месячных зарплат и осознаёшь, что там эргономикой не пахло, а заточено всё на удобство производства, в лучшем случае и эту форму из года в год повторяют.
Знаете проблему современных нулевых клиентов — браузеры сильнее всего грузят клиента и не хватает вычислительной мощности компьютера, чтобы отрисовать, да обсчитать прерывания всех библиотек, которые были использованы. Тесты проводят из расчёта, что открыто одно окно и чтобы с этим справлялся сервер, а если пользователь открывает 70 вкладок и на каждой вы прикрутили свои знания JQuery, потом плагинизировали хорошенько.
Заходишь на сайт, который один к одному, отличаются лишь оттенки…
Надеюсь, текущей аудитории не касается, но надоели дизайнеры, считающие себя художниками. Техническая это профессия и нужно быть конструктором, исследователем, но точно не ваять страницы по 3 Мб, при рисовании которых думали о цветах, но не о том, как и зачем
Тема отставания. Дизайн, как проектирование завязано не на стремительно развивающейся техники, а на человека. Не припоминаю, чтобы у нас стремительно изменялось цветовосприятие или изменялась длина рук. А вот дизайнеров, не изучавших основы… собственно, ни разу не встречал даже одного, кто бы их изучал. В итоге имеем все те вещи, которые красивы, но когда начинаешь пользоваться, например, читать статью, видишь, что автор сам даже не удосужился её прочитать перед публикацией и кроме орфографических ошибок, встречаются пропущенные буквы… так спешили выпустить современный продукт
terrakok
11.09.2016 15:00+1В моей практике кругом и около ситуация, когда дизайн и красивый и функциональный, но стоит дойти до разработки, как оказывается, что этот дизайн совсем не приспособлен к реальным ситуациям, когда каких-то данных нет, что-то пустое, где-то текста в три раза больше, а где-то одно слово…
Мечта: каждый экран отрисованный в нескольких ситуациях, где будут видны и учтены вышеперечисленные недостатки
hlogeon
11.09.2016 15:18Вы опять говорите о дизайне, как о картинке. Дизайн это не то, как выглядит продукт. Дизайн это то, как он работает.
Sinatr
12.09.2016 12:49Похоже, что в веб разработке дизайнер это еще и пол-архитектора. Я не дизайнер, но ожидаю от дизайнера в основном картинку (desktop application): правильные цвета, шрифты, размеры, иконки… Usability это наполовину моя (не дизайнерская) проблема. Она как-раз и зависит от нюансов (заполнить данные асинхронно? подождать, заблокировав UI? и тд). Любое решение дизайнера должно быть одобрено архитектором или руководителем проекта, т.к. те решения, что на бумаге, могут подчас требовать в 100 раз больше человеко-времени и это сложный выбор — сделать «идеально» для пользователя или же съэкономить. Дизайнер — не программист, чтобы принимать такие решения самостоятельно.
olgerdovich
11.09.2016 15:01+2мало что в рунете столь угробищно и при этом столь же вездесуще, как стилистика mail.ru. Поскольку вы сами отметили, что «плохой дизайн убивает», хочу предупредить, что приводя мнение руководителя их дизайн-команды, вы призываете к геноциду.
hlogeon
11.09.2016 15:20+2Самая главная ошибка, которую может совершить хороший дизайнер — пойти работать в MailRu. Вы уж простите, но ваши продукты с точки зрения именно дизайна, в том понимании, о котором вы говорили в самом начале — кромешный ужас. Несмотря на то, что в КАРТИНКА в последние годы стала лучше. Но картинка это не дизайн.
orcy
11.09.2016 19:30Наоборот же, это значит что для хорошего дизайнера там будет много интересной работы.
SerDIDG
11.09.2016 22:56При условии, что менеджеры не будут использовать дизайнера в качестве личного карандаша и ластика.
hlogeon
11.09.2016 23:40+1Боюсь, что главный дизайнер mailRu считает, что он хороший дизайнер(скорее всего так и есть) и просто не даст другому дизайнеру сделать всё «как надо».
Chesheer
12.09.2016 09:45+1Вполне очевидно, что мэйл делает продукт настроеный на массового пользователя, соответсвенно решение ориентировано на какого-то среднестатистического юзера (и вряд ли этот дизайн делают без учета аналитики). То, что вам в этом продукте что-то не нравится всего лишь означает, что ваши предпочтения не соответствуют
средней температуре по больницесреднестатистической выборке. И тут уже вам решать продолжатьесть кактуспользоваться мэйлом или искать заменители, которые вас устроят.
Aingis
12.09.2016 14:56А с чего вы взяли, что дизайн МэйлРу идеален для среднестатистического пользователя? И что hlogeon говорит не как оный?
Chesheer
12.09.2016 15:28Прошу обратить внимание, что у меня ни слова нет про идеальность, а лишь про ориентированность, как цель, которая не факт, что может быть достижима.
Кроме того, смею заметить, что кроме удовлетворения нужд пользователя, еще существует удовлетворение нужд бизнеса и зачастую это совсем не одно и то же. А еще можно вспомнить про ресурсные возможности, приоритеты, хотелки менеджеров и разработчиков, интриги и еще кучу всего от чего зависит результат.
И небольшое IMHO: шанс, что какой-либо пользователь окажется на 100% совпадающим с профилем среднестатистического пользователя сформированного на основании усредненной выборки лично для меня будет означать то, что мы пришли в эпоху клонов, лишенных индивидуальности.
P.S.: мне довелось работать в организации UX/UI-дизайнером, которая поддерживала 5 новостных портальных систем (по 15-30 ресурсов в каждом), так что я не по наслышке знаком с большей частью процессов, которые протекают изнутри.
dborovikov
12.09.2016 00:55Так получилось, что последнее время работаю в Европе. То, что вы описываете мне очень знакомо по работе в России. Однако описанные вам подходы в Европе встретили бы в штыки. В частности то, что вы пишите, что нужно решить проблему клиента. Ваше решение будет интерпретировано как ваше субъективное. От вас, как проектировщика требовали бы обоснования в виде проведения исследований и а/б тестов. Предполагается, что именно пользователи знают что им нужно. В целом применяется подход бережливого программного обеспечения. Интересно, знаете ли вы про эту Европейскую школу, и не думали ли применять описанные выше идеи?
kamushken
13.09.2016 08:20спасибо за воду. тренд «дизайн для решения проблем» наступил 3-5 лет назад… интересно, за что бы зацепился автор, если бы писал этот пост лет 10 назад.
zzzcpan
А вот рынок дизайна не очень соответсвует описанному в статье. Он как раз о заметном дизайне. Заказчики в основном хотят красивые картинки, круче чем у конкурентов, а решать проблемы они не хотят. И это задает, какие навыки стремятся развивать дизайнеры. И никакой пиар, направлленый на дизайнеров, не поможет это изменить.
maria_galeeva
Мне кажется, что тут многое зависит от самого дизайнера, а так же от политики, которой придерживается компания, в которой он работает. Если позиционировать компанию и дизайнеров в ней, как профессионалов, знающих своё дело, то тогда гораздо легче направить клиента не по пути «давайте поиграемся со шрифтами», а по пути, где вы и клиент постоянно задаете друг другу вопрос «почему?» и отвечаете на него.