Дизайн пользовательского опыта: 4 основных элемента & Потрясающие ресурсы, которые стоит сэкономить

Дизайн пользовательского опыта: 4 основных элемента & Потрясающие ресурсы, которые стоит сэкономить
Дизайн пользовательского опыта: 4 основных элемента & Потрясающие ресурсы, которые стоит сэкономить
Anonim

Когда дело доходит до пользовательского дизайна (UXD), моего главного источника вдохновения, лучше всех сказал Стив Джобс: «Дизайн - это не только то, как он выглядит и как он ощущается. Дизайн - это то, как он работает».

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

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

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

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

Они поблагодарят вас за это, вернувшись на ваш сайт и по-настоящему взаимодействуя с ним, но сначала давайте ответим на очевидное:

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

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

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

В данном блоге вашим продуктом является ваш веб-сайт.

4 Элементы дизайна пользовательского опыта

1. Стратегия

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

Стратегия никогда не является чем-то, что можно замалчивать, пропускать или объединять в пары только для того, чтобы быстрее приступить к «настоящей» работе. Может быть неприятно чувствовать, что прогресс не достигается, или отсутствие реального плана, подтверждающего усилия вашей работы, но пропуск этого этапа несет в себе риски, на которые никогда не стоит идти. Хорошо спроектированный или созданный веб-сайт не является вашей конечной целью в разработке пользовательского опыта: ваша конечная цель - достижение бизнес-целей, которые вы обозначили со своими заинтересованными сторонами.

Итак, что именно означает стратегия в данном случае?

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

1) Для кого это?

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

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

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

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

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

2) Какова цель этого?

Как только вы поймете, для кого предназначена эта страница/сайт, вам нужно будет понять, почему эта статья существует?

Существует ли эта страница для предоставления информации? Если да, то какая информация?

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

3) Что должен сделать посетитель?

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

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

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

2. Основные требования

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

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

На этапе определения объема необходимо уточнить несколько различных требований:

Требования к контенту

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

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

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

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

Функциональные требования

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

  • Ваши изображения должны слайдироваться или находиться в лайтбоксе?
  • Будете ли вы использовать функцию параллакса?
  • Если вы используете видео, как это будет работать?
  • Должна ли ваша страница содержать элементы при наведении?

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

3. Скелет

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

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

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

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

Несколько вещей, которые следует учитывать при создании каркаса вашей страницы:

  • Информационная иерархия
  • Интерактивный дизайн
  • Навигационный дизайн

4. Поверхность

Если структурный этап проектирования пользовательского интерфейса является наиболее важным, то поверхностные элементы - мои любимые!

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

Ваш брендинг, выбор цвета и изображений должны быть направлены на решение следующих вопросов:

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

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

Ресурсы по дизайну пользовательского опыта для недизайнеров

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

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

Hotjar: HotJar - отличный инструмент для тестирования того, как ваш готовый продукт работает в реальном мире. Благодаря тепловым картам, данным о прокрутке и кликах, а также возможности запуска опросов я использую HotJar, чтобы оценить, как новые или измененные страницы находят отклик у наших посетителей.

HubSpot: На HubSpot есть много отличных статей о создании пользовательского опыта и лучших практиках, которым стоит следовать. Это одна из моих любимых статей о применении UXD на целевых страницах.

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