UX-дизайн – подробное руководство. Всё что вам следует знать о UX дизайне

09.09.2019

Очень много недопонимания в среде дизайнеров и разработчиков. Также много глупых вопросов, связанных с UX и UI у новичков. Часто просто из-за того, что люди не знают сути понятия UX/UI и, не зная о чем говорят, называют вещи не своими именами.

Я хочу раз и навсегда поставить точку и простым понятным языком объяснить, что значит «UX/UI дизайн».

Разные типы интерфейсов для заточки лезвий.


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

Цель UI/UX дизайнера - довести пользователя до какой-то логической точки в интерфейсе. Сделать так, чтобы пользователь достиг своей цели.

Что такое UX/UI, прямым текстом

(в этом разделе будут банальные фразы)

UX - это User Experience (дословно: «опыт пользователя»). То есть это то, какой опыт/впечатление получает пользователь от работы с вашим интерфейсом. Удается ли ему достичь цели и на сколько просто или сложно это сделать.

А UI - это User Interface (дословно «пользовательский интерфейс») - то, как выглядит интерфейс и то, какие физические характеристики приобретает. Определяет, какого цвета будет ваше «изделие», удобно ли будет человеку попадать пальцем в кнопочки, читабельным ли будет текст и тому подобное…

UX/UI дизайн - это проектирование любых пользовательских интерфейсов в которых удобство использования так же важно как и внешний вид.

Что такое UX и UI дизайн, другими словами

Прямая обязанность UX/UI дизайнера - это, например, «продать» товар или услугу через интерфейс. Именно на основе работы UX/UI дизайнера пользователь принимает решение: «Быть или не быть?» Нравится или не нравится. Купить или не купить.
На самом деле цели дизайнера могут быть разными. Не обязательно что-то «продавать». Но я специально не хочу использовать слишком абстрактные фразы, чтобы этот текст был понятен новичкам; чтобы стиль изложения не превратился в хрестоматию по языку программирования образца 90х годов.

UX/UI дизайн не относится только к смартфонам и веб-сайтам. Более того, профессия UX/UI дизайнера существовала с незапамятных времен. Просто раньше она так не называлась. Точнее, раньше она вообще никак не называлась, а была частью других профессий.

Вот первый пример: когда Вильгельм Шиккард в 1623 году изобретал арифмометр, он уже был UX/UI дизайнером.

Потому что именно он придумывал, какие тумблеры и в какой последовательности должен крутить человек, чтобы получить результат вычислений. И он же придумывал, в каком логическом порядке они будут располагаться. Да и вообще придумывал, как все эти ручки будут выглядеть. Он создал интерфейс для взаимодействия с машиной.

Ещё один более древний и примитивный пример - точильный камень (колесо). Уже даже в раннем средневековье было много разновидностей и механизмов такого колеса:

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

Так вот, когда изобретатель очередного точильного камня думал:

  • будет ли он сидеть и сам нажимать педаль
  • или он упростит механизм, но приставит раба который будет раскручивать колесо рукой,
то в тот момент он был UX дизайнером .

А тот человек, который думал, какой величины будет камень, какого цвета выбрать дерево для подставки и чем скрепить деревянные жерди (гвоздями или кожаными жгутами?) и какой длины будет ручка, был UI дизайнером .

И тот способ, каким бы вы затачивали меч - назывался бы интерфейс .

Разница между UX и UI в том, что UX дизайнер планирует то, как вы будете взаимодействовать с интерфейсом и какие шаги вам нужно предпринять, чтобы сделать что-то. А UI дизайнер придумывает, как каждый из этих шагов будет выглядеть. Как видите из примеров выше, UX и UI так тесно связаны, что иногда грань между понятиями смывается. Поэтому и UX, и UI обычно занимается один дизайнер и его профессия пишется через /.

В последнее время популяризация профессии UX/UI дизайнера связана скорее с развитием цифровых технологий. А вот именно тот «бум» (когда мы стали видеть термин «UX/UI» в каждом втором объявлении о работе) связан с самим названием, которое кто-то придумал совсем недавно.

UI/UX дизайн - это сейчас одна из самых востребованных профессий в цифровой индустрии. Сколько времени она будет востребована зависит от развития этой отрасли. И, судя по всему, она только набирает обороты.

UX и UI - это не тренды. Технологи развиваются. Спрос на сайты растёт. Цифровые приложения появляются как грибы. А инструменты дизайна и разработки упрощаются настолько, что уже практически любой человек без знания программирования может «на коленке» сделать сайт-визитку. Вот только этот сайт должен как-то выглядеть. И не просто как абстрактный каркас из текста и кнопок. Тут программистам и нужна помощь UX/UI дизайнера.

Разделение на веб-дизайнеров и UX/UI дизайнеров появилось с развитием интернета. Со временем понадобились более узкие специалисты, которые делали бы интерфейсы именно для веб-сайтов.
Да, UI/UX дизайн - это более широкое и емкое понятие чем веб-дизайн.

P.S. Некоторые люди пишут UI/UX, но я предпочитаю писать UX/UI. И это только потому, что в рабочем процессе сначала делается UX, а потом UI. Но это не важно - пишите как хотите. Главное не путать этот порядок во время самого рабочего процесса. Потому что многие начинающие дизайнеры начинают сначала придумывать какие классные кнопки и фишки будут в их интерфейсе. Но не думают о том, как вообще пользователь будет переходить от одного шага к другому.

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

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

Кто такой UX-дизайнер, чем он занимается

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

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

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

Кто может стать UX-дизайнером

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

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

Один из дизайнеров Google, Фиона Йонг, рассказала , что в ее команде - лишь несколько специалистов с образованием дизайнера. Остальные раньше работали в смежных областях или в других отраслях. Кто-то занимался когнитивными науками, а кто-то психобиологией.

Поэтому хорошими проектировщиками могут стать и архитекторы, и инженеры, и программисты. Главное - разобраться в основах интерактивного дизайна и понять, как строится логика работы в UX. Это можно сделать самостоятельно или на специальных UI/UX-дизайн курсах.

С чего начать

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

Процесс работы над продуктом состоит из нескольких этапов. На каждом из них UX-дизайнер занимается разными вещами. Чтобы понять, какие знания необходимы для работы, нужно рассмотреть каждый из этапов подробно:

  • исследование,
  • анализ данных,
  • проектирование,
  • дизайн,
  • анализ метрик.

Исследование

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

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

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

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

Анализ данных

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

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

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

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

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

Проектирование

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

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

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

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

Дизайн

Созданием окончательного варианта занимается UI-дизайнер. Но часто рисовать окончательный вариант приходится самостоятельно. Поэтому полезно получить основные навыки и научиться UI-дизайну.

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

Для этого подходят графические редакторы, в которых работают дизайнеры:

  • Adobe Photoshop,
  • Adobe XD,
  • Sketch,
  • Figma.

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

Анализ метрик

После публикации первой рабочей версии продукта UX-дизайнер следит за реальным поведением пользователей. Для этого используют системы аналитики и различные метрики.

Работают над продуктом - проводят юзабилити- и A/B-тесты. Улучшают пользовательский опыт, добавляют новые возможности.

Как учиться UX-дизайну

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

Чтобы научиться UX-дизайну, нужно представлять весь путь разработки продукта и улучшать навыки, необходимые для каждого этапа.».

  • Живая обратная связь с преподавателями
  • Неограниченный доступ к материалам курса
  • Стажировка в компаниях-партнёрах
  • Дипломный проект от реального заказчика
  • Гарантия трудоустройства в компании-партнёры для выпускников, защитивших дипломные работы
  • При изучении теории не забывайте о практических навыках. Создайте макет сайта или придумайте мобильное приложение. Разделите проект на части и тщательно поработайте над каждой: проведите исследование и анализ, затем займитесь проектированием и дизайном. Только практика помогает дизайнеру стать хорошим специалистом.

    О том, как стать дизайнером.

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

    Вот как у меня все это происходило, шаг за шагом:

    1. Поймите все направления Дизайна

    Есть визуальные дизайнеры, дизайнеры взаимодействий, дизайнеры пользовательского опыта (UX), дизайнеры интерфейсов (UI), продуктовые дизайнеры, графические и так далее. Есть и универсалы, которые знают всего понемногу. Начините с того, что бы выяснить, какая специализация вас интересует.

    2. Читайте статьи по UX/UI дизайну по пути на работу

    4. Сделайте перерыв, когда столкнетесь с трудностями

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

    Я с улыбкой вспоминаю день, когда я смущенно призналась своему другу, что понятия не имею, как работать инструментом “перо” (вам будет смешно через несколько месяцев). Мой друг и я получили работу в одной компании год спустя и до сих пор улыбаемся, вспоминая день, когда в буквальном смысле потратили 8 часов, рисуя фигуры в Photoshop.

    5. Читайте хорошие книги.

    6. Найдите дизайнера, который знает как делать и спрашивайте его иногда

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

    7. Вдохновлятесь

    Слушайте Матиаса Дуарте, вице-президента по дизайну Android, и его рассказы о материальном дизайне .

    Смотрите работы на Dribbble, The Best Designs и Awwwards. Сделайте вдохновение приоритетной задачей. Оно поможет вам понять UX шаблоны, визуальный дизайн и придаст вам сил.

    8. Работайте над несуществующими проектами

    Если ваша цель – стажер или позиция начального уровня в UI/UX дизайне, то вам нужно что-то показать работодателю. Это самый сложный шаг, это как спрыгнуть со скалы. Вряд ли вы будете готовы начать работу над проектом, но сделайте это, так или иначе. Попытайтесь создать порфтолио в Sketch или Illustrator, начните с пользовательских потоков, вайрфреймов, взаимодействий и, наконец, полноценного мокапа. После этого переделайте сайт, которому это просто необходимо. Создайте собственное приложение со списком задач. Создайте приложение по доставке. Продолжайте создавать то, что волнует вас.

    9. Подпишитесь на Sidebar

    Они рассылают 5 ссылок по дизайну каждый день.

    10. Запишите эту цитату на вашем столе

    Никто никогда не говорит об этом начинающим. А я бы хотел, чтобы кто-то в свое время сказал об этом мне: все, каждый из нас, чья работа требует творчества, обладает хорошим вкусом. Но мы все мгновенно оказываемся на краю пропасти: в течение первых нескольких лет пока мы творим, невозможно не заметить, что то, что мы делаем не так хорошо, как хотелось бы. Мы отчетливо видим, что ничего хорошего так и не сделали. Мы бы хотели, чтобы было хорошо, мы стремимся к этому, но каждый раз получаем не то, что хотели…

    И только вкус, то самое заветное, что изначально влекло вас к творчеству, ваш вкус просто великолепен! Он настолько хорош, что вы и сами признаете, что то, что вы делаете, это сплошное расстройство. Многие не могут пройти этот этап. И многие бросают свое занятие.

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

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

    Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

    Подписаться

    UX/UI-дизайн - это эффективные инструменты проектирования любого вида пользовательского интерфейса, где наличествует два основных критерия: удобство взаимодействия и внешний вид. Основная задача инструментов состоит в том, чтобы продать потенциальному клиенту товар или услугу через пользовательский интерфейс. Поэтому его визуальная часть должна располагать к себе человека, а механизм работы должен быть интуитивно понятен, с наличием определенных инструкций и подсказок к дальнейшим действиям.

    UX-/UI-дизайн: что это такое

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

    UI-дизайн и его виды

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

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

    Именно для этих целей служит UI-дизайн: его главная задача состоит в реализации удобных условий взаимодействия человека с системой, создавая интуитивно понятную и эффективную модель. Примером идеального решения считается вариант, при котором человеку нужно совершить минимальное количество усилий, будь то клики, ввод текста или переходы по разделам. Желаемый результат при этом получается в кратчайшее время. Существует множество различных типов. Однако основная часть представлена в следующих видах:

    1. Графическая оболочка управления (ГОУ). Здесь человек имеет доступ ко всем видимым на мониторе элементам с целью управления ими. Осуществляется это посредством устройства ввода: клавиатура или мышь.
    2. Совокупность веб-страниц. Через них происходит взаимодействие с веб-ресурсом. Они могут выполняться на основе программ, программных платформ или языков программирования.
    3. Сенсорные экраны. Это специальные экранные устройства для ввода информации при помощи пальцев или стилуса.

    При разработке UI ориентируются на следующие параметры:

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

    UI - это работа по внедрению простых, удобных и в то же время эффективных способов взаимодействия целевой аудитории с конечным продуктом. Важная часть работы здесь заключается в наблюдении, сборе и анализе данных поведения посетителей сайта, на основе которых в дальнейшем принимаются ответственные решения. Важным инструментами специалистов по пользовательскому интерфейсу являются такие программы, как Photoshop , Adobe Illustrator , Cinema 4D и прочие виды графических редакторов.

    Что такое UX-дизайн

    Данный раздел проектирования представляет собой многогранную концепцию, которая вбирает в себя огромное множество различных дисциплин: от интерактивного и визуального оформления до usability, то есть способности веб-ресурса быть понимаемым и привлекательным для пользователя в заданных условиях. Основы UX-дизайна как опыта взаимодействия человека с системой носят исключительно субъективный характер, поскольку он связан, прежде всего, с индивидуальными предпочтениями огромного количества людей. Из-за этого тенденции в данной сфере постоянно меняются. Главными аспектами разработки качественного продукта являются:

    1. Usability, то есть удобство пользования и эргономичность. Здесь необходимо минимизировать количество шагов, которые человек должен совершить для получения желаемого результата.
    2. Характеристика среднестатистического пользователя. Необходимо знать свою аудиторию и цели, для которых используется веб-ресурс.
    3. Формы и функции. Если стоит выбор: сделать красивую схему или верстку, но пожертвовать функциональностью либо отдать предпочтение функции в ущерб внешнему виду, всегда отдается предпочтение второму варианту - функциональность играет здесь главную роль.
    4. Интуитивно понятный интерфейс. Люди в интернете не любят, когда им предлагают слишком запутанный в использовании продукт. UX-дизайн должен расшифровывать человеку алгоритм действий, который он должен выполнить.

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

    Основные отличия UX- и UI-дизайна

    Как уже отмечалось, на практике довольно трудно отличить эти два понятия - в разработке web-ресурса они довольно тесно связаны. Очень часто пользовательский интерфейс и опыт выступают в качестве элементов, которые входят друг друга. В максимально упрощенной схеме их отличия выражаются в следующем: UX - это внешний вид объекта, а UI - то, как он функционирует. На практике отличить одно от другого можно по следующим примерам UX- и UI-дизайна:

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

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

    Полезные книги по UX- и UI-дизайну

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

    «100 главных принципов дизайна. Как удержать внимание» автора Сьюзан Уэйншенк. Это набор нескучных и эффективных правил.

    «Smashing UX Design». Несмотря на то, что книга по UX-дизайну предназначена для специалистов, они многому научит новичков. В частности, здесь представлены принципы организации рабочих процессов.

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

    Подумайте о людях, которые разработали этот сайт или приложение. Какую они преследовали цель?

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

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

    Пользователи ищут молниеносные способы решения проблем, поэтому UX крайне важен. Позаботьтесь о том, чтобы сайт был понятен и прост в понимании пользователей.

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

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

    Что такое UX-дизайн?

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

    1. Интерактивный дизайн

    Интерактивный дизайн, или IxD – подраздел UX-дизайна, определяющий взаимодействие между пользователем и продуктом; цель этих взаимодействий – хороший пользовательский опыт.

    2. Визуальный дизайн

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

    3. Пользовательское исследование

    Это последний из составных элементов UX-дизайна, с помощью которого компании выясняют ожидания своих клиентов. Успешный веб-проект служит определенной цели и решает конкретные задачи, поэтому важный шаг – узнать, что нужно потребителю. Без этого в основе дизайна – лишь догадки и предположения.

    4. Информационная архитектура

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

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

    Составные процессы UX-дизайна

    Выделяют три этапа UX-дизайна:

    1. поиск целевой аудитории
    2. понимание целей компании – как такие цели влияют на пользователя
    3. нешаблонное мышление

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

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

    Принципы UX-дизайна

    Отрасль UX-дизайна стремительно меняется, но основополагающие принципы все те же. Дизайнеры должны понимать, что им нужно с точки зрения визуального баланса. Краткость и понятность – важные нюансы; здесь применим принцип – чем меньше, тем лучше. Стремитесь к тому, чтобы дизайн был интуитивно понятен, и, что еще важнее, учитывайте интересы и потребности пользователей.

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

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

    Будьте человечны : Никому не нравится чувство, будто взаимодействуешь с машиной. Вы с большей вероятностью сможете выстроить доверительные отношения, если покажете свою компанию с человеческой стороны.

    Доступность : Никто не хочет понапрасну тратить свое время. Успешный UX-дизайн улучшает навигацию.

    Легкость : Последовательность и незамысловатость дизайна – это всегда хорошо. Вы строите отношения с пользователями за счет удобного UX.

    Простота : Никаких просчетов или лишних описаний. Сразу переходите к главному.

    Результат UX

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

    Это важная часть общего процесса. Так UX-дизайнерам проще найти искомое, продемонстрировать свое видение, объяснять те или иные рекомендации по улучшению.

    1. Пользовательское исследование

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

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

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

    2. Оценка конкурентов

    Оценка сильных и слабых сторон конкурентов – способ расширить собственную UX-стратегию. Лучше всего действовать с помощью аналитических отчетов, в которых бы освещались конкурирующие разработки. По сути, это детальный анализ интерактивного дизайна конкурентов, список слабых мест, просчетов и упущений, в общем, того, что может стать конкурентным преимуществом.

    3. Интерактивный дизайн

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

    4. Информационная архитектура

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

    Что такое дизайн пользовательского интерфейса?

    Когда Apple представила навигационный компонент Click Wheel для iPod, эта штука была интуитивно понятной и высокофункциональной – не говоря уже о визуальной составляющей. Это хороший пример успешного пользовательского интерфейса, или UI. UI – это способ взаимодействия с компьютерами, машинами, сайтами, приложениями, носимыми устройствами и пр. UI-дизайн – это то, что делает все эти вещи максимально упрощенными и эффективными.

    UI vs. UX

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

    Общие UI-элементы

    У UX и UI много общего, но важно отметить и ключевые отличия этих двух предматов. Опять же, UI ориентирован на внешнюю составляющую продукта, тогда как UX больше связан с тем, как люди взаимодействуют с сайтом или приложением. Вот самые распространенные элементы UI, о которых нужно знать, чтобы лучше разобраться в отличиях:

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

    Навигация «хлебные крошки»

    Это дизайнерский инструмент, который визуально улучшает юзабилити сайта.

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

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

    Исследование опыта взаимодействия

    Без исследования не удастся узнать о потребностях и предпочтениях людей. UX-исследование – это поиск того, что нужно пользователям; полученные данные ложатся в основу UX-дизайна. Компании и дизайнеры применяют исследования, чтобы сделать определенные выводы, о том, что работает и что лучше изменить. Есть несколько вариантов UX-исследований.

    Юзабилити-тестирование

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

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

    Удаленное юзабилити-тестирование позволяет компаниям провести исследование в условиях, когда пользователи находятся в своей естественной среде (например, у себя дома или в офисе).

    Инструменты юзабилити-тестирования

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

    Adobe Fireworks СS6 позволяет веб-дизайнерам создавать графику для веб-страниц без необходимости вникать в тонкости программного кода или дизайна. У Adobe Fireworks есть ряд преимуществ. У этого инструмента впечатляющая точность пикселя, есть опции сжатия изображений (JPEG, GIF и т.д.), что позволяет пользователям создавать функциональные сайты и строить векторы.

    С помощью Adobe XD можно создавать дизайн сайтов и мобильных приложений, а также прототипы, каркасное моделирование и векторную графику. Можно делиться интерактивными прототипами на нескольких платформах, включая Windows, Mac, iOS и Android – инструмент идеально подходит для командной работы.

    Axure RP Pro – еще один хороший инструмент для UX-дизайна и, к тому же, бесплатный. В Axure реализованы несколько опций, в т.ч. прототипирование и документирование. Можно даже создавать схему перемещения пользователя и карты сайтов. Axure идеально подходит для создания веб- и десктопных приложений, пользователям предоставляется возможность быстрого экспорта в PDF или HTML.

    Это комплексный софт со множеством специфических функций, в т.ч. недиструктивное редактирование (под этим подразумевается то, что Sketch не будет менять плотность пикселей изображения, с которым вы работаете). Экспорт кода, пиксельная точность, прототипирование, векторное редактирование – вот основные преимущества Sketch.

    6. Софт для сторибординга

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

    Storyboarder – бесплатная разработка с базовым функционалом, которая подойдет для всех дизайнеров, независимо от уровня их мастерства. Это ПО быстро создает наброски или фигурки, чтобы описать план или идею. Еще один инструмент – Toon Boom Storyboard Pro . Он совмещает в себе функцию рисования, анимации, контроля камеры и другие многочисленные опции – за ежегодную или ежемесячную плату. Широкий функционал, для усложненного сторителлинга и детальной подготовительной работы. Все это подойдет для дизайнеров, которые ищут возможность, чтобы визуально рассказать свою историю с помощью интерфейса.

    Как стать UX-дизайнером?

    Если вы любите дизайн, исследования и работу с людьми – выслушивать рассказы других о своем опыте, тогда, возможно, стоит подумать о карьере в UX-дизайне. В таком случае вам придется сосредоточиться на концептуальных аспектах дизайна; создавать качественный опыт взаимодействия для других пользователей.

    Есть несколько важных шагов на пути к карьере UX-дизайнера. Многие университеты мира предлагают свои курсы, но чтобы на них записаться, 4 года образования в сфере дизайна – это, как правило, обязательное условие. Есть более гибкие программы, такие как Quinnipiac University Graduate Program in User Experience Design . Существуют и программы сертификации профессионалов. Многое зависит от продолжительности обучения и уровня подготовки.

    Если вы готовы воплотить свою мечту и стать UX-дизайнером, понадобится резюме и яркое портфолио. Пригодятся такие ресурсы, как Dribbble или Behance . Свои работы можно продемонстрировать на собственном сайте, созданном с помощью таких конструкторов, как SquareSpace.

    Не упускайте из поля зрения следующие нюансы:

    Визуальная привлекательность

    Презентация – это все. Работа должна говорить сама за себя… показывайте, а не говорите! Выбор цвета, типографика – все это важно.

    Добавьте страницу «о себе»

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

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

    Объясните, как вы создаете свой UX

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

    Создайте дополнительное портфолио

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

    Итог

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

    Технологии все больше проникают в повседневную жизнь, а успешный UX-дизайн устраняет любые барьеры между пользователем и его девайсом (или приложениями). UX-дизайн сейчас как никогда важен – присоединяйтесь к этому движению и извлекайте пользу для своего бизнеса.