—»     —»   Краткое введение в понятие «Опыт взаимодействия» для веб-дизайнеров
  Раздел: Подсказки   Комментариев: 1  

Краткое введение в понятие «Опыт взаимодействия» для веб-дизайнеров



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

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

Кто выписывает чек, нам всем известно.

К счастью, у вас есть третий вариант действий: аргументировать вашу точку зрения, опираясь на Опыт взаимодействия (User experience, UX).

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

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

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

Краткое введение в понятие «Опыт взаимодействия» для веб-дизайнеров

Что такое UX?

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

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

Учёт UX-составляющей в процессе разработки вашего эскиза

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

Краткое введение в понятие «Опыт взаимодействия» для веб-дизайнеров

Изучение пользовательской аудитории

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

Пользовательские истории и "персоны"

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

Технология работы системы

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

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

Затем я соединяю эти модули стрелками, иллюстрируя их взаимоотношения: "предприятие может проводить/редактировать/удалять исследования" или "пользователи могут участвовать в исследовании/листать/просматривать его".

Если вы имеете представление о проектировании баз данных, то можете сравнить это с построением модели "сущность-связь" (Entity Relationship Diagram - ERD).

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

Итак, сформулировав задачу и собрав данные, пора переходить к её решению.

Каркасы

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

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

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

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

Рабочие макеты

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

Заключение

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

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

Хочу закончить цитатой из работы системного теоретика Бакминстра Фуллера (Buckminster Fuller):

"Занимаясь решением какой-то проблемы, я не забочусь о его красоте. Я думаю лишь о том, как решить проблему. Закончив, я оцениваю красоту своего решения, и если оно уродливо, то я знаю, что оно неверно".
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

Ключевые тэги: работа, веб-дизайн
Опубликовал Design FactoRy   Прочитано (раз): 3872   |   Оставлено комментариев: 1
Источник материала / оригинал статьи   Распечатать
Другие статьи и новости по теме:
Комментарий #1: 3 февраля 2012 @ 00:43
Написал: kdora — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
Всё просто. Система (User experience, UX) - опыт взаимодействия всегда поможет веб- дизайнеру решить задачи простые и сложные. Принцип волки целы и овцы сыты сюда подходит.
Добавление комментария
Уважаемые пользователи!
При добавлении комментариев на сайт Вам следует учитывать следующее - все комментарии проверяются Администрацией на предмет отсутствия спама. При обнаружении признаков спама, в оставленном Вами комментарии, сам комментарий будет незамедлительно удалён, а Ваш IP-адрес будет забанен без предупреждения! Учётные записи пользователей, рассылающих спам, блокируются/удаляются без права последующего восстановления.

С уважением, Администрация сайта.
* = поля обязательны к заполнению
Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера
Вопрос : Назовите месяц December по-русски
Подтверждение кода безопасности :

Включите эту картинку для отображения кода безопасности
обновить, если не виден код


Популярные публикации


















Свежие шаблоны сайтов каждый день
С миру по нитке
«    Ноябрь 2017    »
ПнВтСрЧтПтСбВс
 12345
6789101112
13141516171819
20212223242526
27282930