function fullHeightRow() { var fullHeight, offsetTop, element = document.getElementsByClassName('vc_row-o-full-height')[0]; if (element) { fullHeight = window.innerHeight; offsetTop = window.pageYOffset + element.getBoundingClientRect().top; if (offsetTop < fullHeight) { fullHeight = 100 - offsetTop / (fullHeight / 100); element.style.minHeight = fullHeight + 'vh' } } } fullHeightRow();

Взаимосвязь между UX wireframe и UX-исследованием

photo of a book containing various wireframe designs

Взаимосвязь между UX wireframe и UX-исследованием

В этой статье мы рассмотрим эти вопросы:

  • Что такое UX wireframes?
  • Как они используются в процессе проектирования?
  • Что может заменить их?
  • Какую пользу они приносят UX-исследование?

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

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

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

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

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

Что такое каркас UX?

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

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

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

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

Зачем ждать дни или недели, если ручка и бумага могут сделать ту же работу несколькими быстрыми движениями?

3 уровня проектирования каркасов UX

  1. Проектирование электронных схем с низкой точностью
  2. Проектирование электронных схем средней точности
  3. Высокоточный дизайн каркаса

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

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

На самом верху кучи, в wireframes представлены пиксельно идеальные макеты (высокая точность) с профессионально оформленными страницами, всего в нескольких шагах от ваших прототипов следующего этапа.

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

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

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

Зачем нужен каркас UX?

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

Удовлетворит ли ваша платформа потребности пользователей? UX wireframe должен обеспечивать следующие преимущества:

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

UX wireframe - обсуждение начинается здесь

Где, как, почему? Именно эти вопросы вы должны задать каждому элементу вашего сайта.

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

Недостатки тестирования проволочного каркаса

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

Как создать каркас UX

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

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

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

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

Что лучше: придерживаться простых эскизов или использовать профессиональные инструменты для создания каркасов?

И то, и другое. Это зависит от вашей системы, от того, на каком этапе вы находитесь и какие средства у вас под рукой.

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

UX-исследование встречается с UX-картой

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

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

Где мы применяем исследования пользователей?

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

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

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

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

Что мы узнаем из таких исследований?

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

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

Как мы должны применять эти выводы?

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

Заменят ли инструменты прототипирования электронные схемы UX и UI в UX-исследованиях?

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

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

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

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

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

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

Если вы хотите узнать больше о каркасных схемах и о том, как проводить UX-исследования с помощью каркасных схем, напишите нам по адресу hello@ux247.com.

Похожие посты