Современные тенденции веб-дизайна: UX? UI? Usability?

Что стоит знать о веб-разработке с нуля, чтобы начать работу

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

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

Ведь тогда появляются две значимых и решающих всё Персоны.

Во-первых, Заказчик — незнакомый человек со своими конкретными требованиями, вкусом, видением, которые часто совсем не совпадают с Вашим мнением.

Во-вторых, по другую сторону монитора есть Пользователь вашего сайта, и Вам надо предугадать его ожидания и принимать во внимание возможные действия.

Многие дизайнеры, особенно новички-фрилансеры, превращают процесс изготовления сайта в бессистемный хаос, в набор внезапных сиюминутных действий. И не понимают, что неудачный результат — закономерность при таком подходе к решению задачи создания продукта.

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

Сайт – это, по сути: система связанных между собой документов — страниц, доступных 24 часа в сутки. Каждый документ содержит определенную информацию. Переход от одного документа к другому осуществляется посредством гиперссылок. И все. Так просто и очевидно и было лет 10-15 назад...

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

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

Интернет-технологий накопилось много. То ли еще будет?

Если сказать о себе, придя устраиваться на работу: «я — web-специалист», то это мало о чем скажет работодателю. Лет 10 назад этой фразы было бы достаточно, чтобы поручить вам создание сайта. Что сегодня?

Профессия эта сравнительно юная, но уже похожа на растущее ветвистое дерево, где каждая веточка отвечает за своё направление:

• Есть толстые ветки профессий вроде UX, UI аналитиков.
• Информационный архитектор и юзабилити-инженер...
• Тестировщик и разновидности типа AB-тестировщик, альфа-тестер, бета-тестер...
• Маркетолог,  контент-менеджер и поисковый оптимизатор....
• Веб-дизайнер, верстальщик и программист....
• Есть толстые ветки Frontend разработчик и Backend разработчик.
• Есть ветки с тематиками: сайты, мобильные приложения, интерфейсы терминалов, игровые и прочие, а из них растут более тонкие веточки вроде «AB-тестировщик мобильных приложений на яблочной платформе» или «UI-дизайнер и верстальщик для вордпресса».

Кроме того, постоянно появляется что-то новое, а что-то исчезает/прекращается.

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

Здесь мы подошли к очень важному открытию или утверждению: разработка сайта с нуля никогда не начинается

• С верстки или программирования. Как это делают зачастую программисты, создающие сайт на коленке.
• С визуального дизайна сайта, как стремится сделать визуальный дизайнер, когда первым делом начинает вырисовывать детальки, завитушки и обрабатывать фото.

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

Для современного веба нужно детальное и последовательное проектирование, включающее несколько этапов, множество методик и отсутствие лени.

Каким бы рутинным ни показался процесс. Этот процесс называется User Experience. А специалист, который им владеет, называется UX дизайнер.

4 ключевые сферы, в которых UX дизайнеры должны обладать определенными навыками:

• Информационная архитектура (Information Architecture, IA).
• Проектирование взаимодействия (User Experience, UX).
• Визуальный дизайн интерфейса (UI, User Interface Design)
• Исследование юзабилити (Usability Testing).

Кроме этого, UX-дизайнер должен иметь навыки проект-менеджмента.

У каждого процесса очень разные цели и обоснования результатов работ: проектирование взаимодействия (UX) — удобной схемы работы, визуальный дизайн (UI) добивается эстетичности, информационная архитектура (IA) — удобной систематизации информации. И на каждом этапе выполняется тестирование юзабилити.

Юзабилити — удобство и простота в пользовании. Это понятие можно применить не только для веб. Может быть юзабилити стула, стола. Юзабилити автомобиля и интерфейса телефона. Зависит это от многих факторов – от особенностей человека, его пальцев, размеров. В этом смысле понятие близко к термину промышленного дизайна – эргономика. Usability в контексте сайта — простое и удобное пользование контентом.

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

Веб-мастер, умеющий делать всего по чуть-чуть – хорошо это или плохо? и перспективно ли?

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

Начать работу, систематизировать, последовательно пройти все этапы от начала и до рабочей версии и получить на выходе современный сайт, может помочь специальность переподготовки «Web-дизайн и компьютерная графика», которая организована на нашей кафедре.

Вдохновением и толчком для статьи послужила информация в свободном доступе на просторах интернета.

С. Рябушко, веб-дизайнер, преподаватель кафедры НМиТ