Мировой подход
к проектированию сайтов. Продуктовый дизайн

Главная мысль которую хочу донести: Дизайн в Европе, Америке и у мировых брендов абсолютно разный. И компании не выбирают дизайн студии по умению делать те или иные визуальные трюки. Там ценится подход к решению задач. Людей интересует работающий продукт, а не цвет сайта. Поэтому, нельзя говорить, какой дизайн

в Европе или мире. Он такой, который решает задачи.

Вебстудии на зарубежном рынке предлагают не дизайн сайтов, а business solutions, по другому — продуктовым дизайн. Это включает в себя подготовку чужого бизнеса к интернет продажам, разработку сайта, ведение рекламы, получение прибыли. Это готовый продукт, который приносит пользу клиентам. За это и платят. В дальнейшем, когда я буду писать слово «дизайн», я буду понимать продуктовый дизайн. Визуальное оформление — маленькая часть дизайна.

Статьи на тему продуктового дизайна:

Про продуктовый дизайн

Продуктовый дизайн

Большая статья от mailGroup. Тут и про исследования пользователей и про продуктовый дизайн и про дизайн мышление


Ведение проектов. Решаем задачи, а не рисуем сайты

Предлагаем решать задачи клиента. Заставляем клиента говорить на нашем языке: «сделайте кнопку красной», он меняет на: «сделайте кнопку заметной». А каким образом обратить внимание на кнопку решают профессионалы в нашем лице. Нас наняли для решения задач. Еще примеры:

Мы стремимся принести пользу клиенту: увеличить продажи, конверсию, приток людей через рекламу. Говорите каким способом мы это будем делать. Так же приводите примеры уже существующих кейсов. Как убедить в этом клиента.

Мы делаем не сайт, а продукт, приносим чистую пользу.

Компании, которые это проповедуют, входят в топ 50 компаний России:

Astra Media Group

Бюро Артёма Горбунова

IT Agency

Студия Лебедева

Nimax

AIC & Qsoft

Бюро Пирогова


Как делают сайты

Если взглянуть на популярные команды вебстудий, то увидим коллектив из ux-дизайнеров, ui-дизайнеров, иллюстратора, дизайнеров анимации, арт-директора. Это все от того, что дизайн сайтов стал наукой.

Ссылки на хорошие статьи на эту тему:

Очень мощная статья о подходе к разработке сайтов, генерации идей и взаимодействия команды.

О UX, UI и в чем разница. Как взаимодействуют.

Тот же подход пропагандирую и на американских блогах:

Описан процесс разработки сайтов. (eng)

Кратко. Дизайн поделился на три составляющие. Дизайн продукта, дизайн взаимодействия и дизайн графического интерфейса.

Дизайн продукта. Начинаем с исследований:

Выявляем требования, которые должен решать сайт, написание портрета ЦА, а/б тестирование, техническое задание.

Дизайн Взаимодействия. Проектировка макета, который решает ту или иную задачу. Тестирование и выбор лучшего прототипа.

И только на последнем этапе, этапе реализации, дизайн.

«В процессе проектирования нужно всегда помнить о трех основных составляющих, которые лежат в основе любого цифрового продукта: бизнес-требования, пользовательские требования и используемые технологии».


Откуда берется визуальное оформление. Мировые тенденции

Взглянем на сайты на бехансе или пинтересте. Мы заметим, что оформление идет не графическими элементами, а подачей контента. Контент вышел на первую строчку. И только так может быть. И визуальное оформление опирается на контент. Если есть красивые фотографии продукта, то сайт не станут делать в стиле флэт. Его сделают с большим количеством фотографий. Фотографии выйдут на первый план. Контент, технологии и пользователи диктуют правила оформления.

Контент. Контент готовят с особой щепетильностью: заказывают у главредов, снимают фотостудии, ищут другие способы добычи уникального контента. Но не везде возможно визуально круто оформлять сайты, поэтому развивается культура написания коммерческого текста. В этом преуспела студия Артема Горбунова, их глав-ред Максим Ильяхов. Он пытается описать правила «информационного стиля». Информационный стиль советует не говорить брехню, а говорить четко и по делу. И делать текст «веселым» не с помощью красивых речевых оборотов, а с помощью хороших историй.

Фото-контентом из фотостоков перестали пользоваться, люди легко их определяют и не верят им. Фото и текст делайте настоящими, а не декоративными.

Технологии. Требование адаптивности популяризировали минимализм, блочность и верстку текста в несколько колонок. Дизайн без мобильной версии отличается от дизайна мобильной версии. Поэтому изучение пользователей, для определения необходимости адаптивной верстки, важно.

Пользователи. Исследования пользователей влияет на дизайн. Возраст, гендерные отличия и профессионализм пользователя определяет порядок расположения текста и цвет сайта. (А ни как не пожелания заказчика).  

Заказчик не может давать нам хороший контент. Поэтому нам нужно брать его полностью на себя. Так мы будем делать профессиональные сайты.

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

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

Статьи на тему повышения юзабилити благодаря анимации:

Влияние анимации интерфейса на юзабилити

Секреты юзабилити: анимация для внимания и понимания

Анимация в веб-дизайне: зачем и когда её нужно использовать


Ведение переговоров 

Этот параграф я решил сюда включить, так как договорится делать продуктовый дизайн, не тоже самое, что просто сделать сайт. Очень кратко.

В Европе привыкли структурировать и подчинять логике всё: дизайн, программирование, переговоры. Есть различные способы ведения проектов. Вот ссылка на исчерпывающую статью о различных способах ведения проектов.

А также есть методологии для работы внутри компаний. Эти методологии так же влияют на работу с заказчиками и в целом на взаимодействие заказчиков и исполнителей. Европейские заказчики уже знают аббревиатуры SCRUM, FFF.

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


Заключение

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

Стилистику и визуальное оформление определяет не тенденции, а контент, технологии и пользователи. Нет однозначного ответа, на вопрос: «Какие сейчас тенденции в Европе». Вебстудии рассказывают не о цвете, который они выбрали для сайта, а задачах, которые решили дизайнерским ходом. Хорошая типографика, композиция и контент. Дальше дело вкуса.

Ориентироваться на дизайн Гугла(материал дизайн) и майкрософта не бессмысленно. Дизайн основан на задачах, которые он решает: они должны делать универсальные, адаптируемый дизайн продукт. Квадратные блоки, отсутствие градиентов, и простота дизайна решают эти задачи. Скевоморфизм не позволил бы им этого сделать. Легче адаптировать для разных экранов векторный квадрат, а не растровую картинку с объемом.

О каждом этапе проектирования сайта можно говорить и говорить, поэтому по всей статье я добавил ссылок, на самостоятельное ознакомление.

Интересные ссылки:

Проектирование сайтов от IT Agency

Описание сделанной работы на языке маркетинга