Основы design & usability

14
Aug
Основы design & usability
  • PANOV.
  • 4558 Views
  • 0 Comment
  • usability . дизайн .

Design & Usability. Введение в предмет

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

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

О том, почему это важно и зачем это нужно знать разработчику.

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

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

Дизайн.

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

— Видимость состояния системы (правило обратной связи)
— Информированность пользователя
— Средства обеспечения обратной связи
— Время оповещения
— Равенство между системой и реальным миром
— Свобода действий пользователя
— Последовательность и стандарты
— Предупреждение ошибок
— Понимание лучше, чем запоминание
— Гибкость и эффективность использования
— Эстетичный и минималистический дизайн
— Распознавание и исправление ошибок
— Описание ошибки
— Описание решения проблемы
— Справка и документация

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

Чуть-чуть подробнее:
Видимость состояния системы (правило обратной связи)
Система (в данном случае — компьютерная программа) должна всегда информировать пользователя о состоянии своей работы с помощью соответствующих средств, в разумное время.

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

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

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


Последовательность и стандарты
Принцип последовательности означает использование одних и тех же средств для выражения схожих образов и выполнения действий, имеющих одинаковую природу. Принцип последовательности при разработке интерфейсов должен соблюдаться буквально во всем.Предупреждение ошибок
Этот принцип широко распространен и в обычной жизни, вне сферы компьютеров и интерфейсов для них. «Пожар легче предупредить, чем потушить» — гласил один из плакатов, изданных в конце девяностых годов Министерством внутренних дел для обучения людей технике пожарной безопасности. «Преступление легче предупредить, чем раскрыть» — гласит одно из правил науки криминологии.
Применительно к теме проектирования интерфейсов компьютерных программ, принцип предупреждения ошибок означает следующее: «Дизайн, который предупреждает возникновение проблем, лучше, чем самое хорошее сообщение об ошибке».
Понимание лучше, чем запоминание
При разработке интерфейса нужно делать все объекты, функции, действия видимыми и легко доступными пользователю. Минимизируйте запоминание — пользователь не должен постоянно стараться удержать в памяти информацию из одной части программы, чтобы применить ее в другой. В любой момент пользователю должно быть ясно, что нужно делать в данный момент.Гибкость и эффективность использования
Правило вполне закономерное, ведь программа в первую очередь должна решать задачу, над которой работает пользователь. Однако при проектировании интерфейса перед разработчиком часто встает такая проблема: требуется, чтобы интерфейс был одинаково удобен и для новичков, и для опытных пользователей. Но нужно учитывать, это во многом разные потребители, с разными требованиями к программе и разным стилем работы.
Эстетичный и минималистический дизайн
Если выразиться проще, то это правило означает: «Ничего лишнего». Не нужно загромождать интерфейс программы элементами, которые в данном случае являются неуместными и малополезными. Дело в том, что каждый элемент, будь то кнопка или текстовая подпись, обязательно отвлекает часть внимания пользователя. Это может привести к тому, что видимость и, соответственно, легкость восприятия пользователем действительно нужных и полезных частей интерфейса будет сильно уменьшена за счет элементов, без которых в данном случае можно было бы вполне обойтись.Распознавание и исправление ошибок
«Помогайте пользователю распознавать и исправлять ошибки» — говорит Якоб Нильсен. Это правило определяет проектирование сообщений об ошибках. Хорошие сообщения об ошибках — это сообщения, которые объясняют, в чем состоит проблема и, самое главное, как ее исправить.
Описание решения проблемы
Как уже упоминалось выше, информация о том, как исправить ошибку или решить проблему имеет даже большее значение, чем собственно описание ошибки или проблемы. Ведь подсказка, помогающая решить проблему, способствует реализации одного из принципов построения пользовательского интерфейса — программа должна помогать выполнить задачу, а не становиться этой задачей.Справка и документация
Принцип о необходимости предоставления справочной системы и документации к программе, идущий в списке Якоба Нильсена последним, не становится от этого менее важным.

Эти пятнадцать так назынаемых эвристических правил известнейшего американского специалиста в области проектирования интерфейсов Якоба Нильсена (Jakob Nielsen), разработанных им совместно с другим исследователем, Рольфом Моличем (Rolf Molich). Формулировку этих принципов в оригинале можно прочитать по адресу www.useit.com/papers/heuristic/heuristic_list.html
Русский вариант с развернутым описанием можно найти в представлении автора Станислава Жаркова в его книге «Shareware: профессиональная разработка и продвижение программ».

Юзабилити

Согласно википедии: Юзаби́лити (англ. usability — дословно «возможность использования», «способность быть использованным», «полезность» ) — понятие в микроэргономике, обозначающее итоговый уровень удобности предмета для использования в заявленных целях. Термин имеет связь с понятием «эргономи́чность», но в отличие от последнего меньше ассоциируется с технической эстетикой, с внешним видом и более привязан к утилитарности «юзабельного» объекта.
В моем же представлении это технология влияющая на все этапы разработки программной системы. Основывается она на особенностях психологического восприятия информации человеческим мозгом. Основная её цель — проконтролировать, спрогнозировать и воздействовать на процессы создания системы с целью повысить конечную эргономичность продукта. Юзабилити технология применяется на всех этапах разработки.

Правила и принципы юзабилити

Правило 7±2
Возможности мозга по обработке информации не безграничны, в соответствии с результатами исследования Джорджа Миллера кратковременная память может одновременно содержать от 5 до 9 сущностей. Этот факт часто используется при обосновании необходимости сократить количество элементов в навигационных меню до 7, что вызывает горячие дебаты, поскольку не совсем ясно, как это правило должно применяться в веб. [Miller’s studies]
Правило 2-х секунд
Заключается в том, что пользователь не должен ждать определенной реакции системы, к примеру, запуска или переключения приложения, более 2-х секунд. Значение 2 секунды выбрано произвольно, но кажется достаточно подходящим. В общем случае, чем меньше ждет пользователь, тем лучше.Правило 3-х кликов
Пользователь не будет в восторге от использования сайта, если он не может найти необходимую ему информацию за три клика мышкой. Другими словами это правило подчеркивает важность понятной и простой навигации. Во многих случаях важно не столько количество необходимых кликов, сколько общая понятность системы, даже 10 кликов не проблема, если на каждом этапе пользователь четко представляет, где он и куда должен двигаться дальше.Правило 80/20 (Принцип Парето)
Заключается в том, что 80% эффекта получается в результате 20% действий. В бизнесе это правило часто применяется в виде: «80% продаж приходится на 20% клиентов». В веб-дизайне и юзабилити это правило работает не менее эффективно. К примеру, значительно улучшить отдачу сайта можно определив 20% пользователей, заказчиков, действий, продуктов или процессов которые дают 80% прибыли и обратив на них особое внимание при разработке.

Правило Фиттса
Опубликованная Паулем Фиттсом в 1954 году модель движений человека, определяет время, необходимое для быстрого перемещения в целевую зону как функцию от расстояния до цели и размера цели. Обычно это правило используется при рассмотрении движения мышью от точки A к точке B. Это может быть важно при размещении элементов, количество кликов на которые желательно увеличить.Перевернутая пирамида
Перевернутая пирамида — это стиль написания, при котором основная мысль представлена в начале статьи. Статья начинается с вывода, за которым следуют ключевые моменты, а завершается наименее важной информацией. Пользователи хотят получать информацию как можно быстрее, поэтому перевернутая пирамида как нельзя лучше подходит для веб, такого же мнения придерживается и гуру юзабилити Якоб Нильсен.Удовлетворенность
Пользователи не выбирают оптимальный путь в поисках необходимой информации. Им не нужно самое лучшее и надежное решение, напротив — часто они готовы удовлетвориться быстрым и не самым лучшим решением, которое будет «вполне приемлемым». Применительно к веб, удовлетворенность описывается именно этим случаем: пользовать получил «вполне приемлемое» решение проблемы — даже если альтернативные решения полнее покрывают его требования на длительный срок.
Психология в юзабилити
Синдром утенка (Baby-Duck-Syndrome)
Обычно пользователи привязываются к первому, изученному ими дизайну, и судят остальные по тому, насколько они на него похожи. В результате пользователи предпочитают системы, похожие на те, которые они знают, и не очень любят остальные. Эта проблема часто возникает при редизайне, пользователи, привыкшие к предыдущей версии дизайна, в новой структуре сайта чувствуют себя не комфортно.Баннерная слепота
Пользователи игнорируют все, что похоже на рекламу, и что интересно, делают это весьма эффективно. Хотя рекламу замечают, ее все равно всегда игнорируют. У пользователей выработаны довольно-таки четкие схемы, которым они следуют, выполняя в веб различные действия: в поисках необходимой информации они фокусируют внимание на тех частях страницы, где эта информация может быть расположена — на основном тексте и гиперссылках. Большие, красочные, анимированные баннеры в этом случае полностью игнорируются.

Источник: Banner Blindness: Old and New Findings
Перевод: Пользователи не видят баннеровЭффект неопределенности (Эффект Зейгарник)
Человек не терпит неопределенности — мы стараемся найти ответы на возникающие вопросы, причем как можно скорее. Эффект неопределенности основан именно на этой особенности поведения людей. Видео ролики, статьи и сюжеты, использующие эффект неопределенности, обычно заканчиваются внезапно, не разрешая сложную ситуацию и не отвечая на возникающие вопросы. Этот эффект часто используется в рекламе: задавая посетителям интересные и провокационные вопросы, рекламщики часто принуждают к чтению материала или клику на ссылке.
Обнаруженный Блюмой Зейгарник в 1927 году эффект помогает установить эмоциональную связь с читателем и невероятно эффективен в маркетинге. Читатели лучше запомнят, о чем была реклама, и даже мелкие детали будут запомнены более четко и точно. Эффект Зейгарник используется и при написании текстов для веб, чтобы привлечь и заинтересовать посетителей.
Гештальт принципы восприятия форм
Это фундаментальные правила человеческой психологии в контексте дизайна интерфейсов человек-компьютер.
Закон близости утверждает, что когда мы видим набор объектов, объекты, расположенные ближе друг к другу, мы распознаем как группу.
Реальный пример действия закона близости c MTV Music Awards 2002. Источник.Закон сходства утверждает, что сходные объекты человек подсознательно группирует.
The Law of Prägnanz утверждает, что один и тот же объект может играть важную роль в одном визуальном поле и быть частью фона в другом.
В логотипе Macintosh можно разглядеть как обычное счастливое лицо, так и счастливое лицо в профиль. Источник.
Закон симметрии утверждает, что мы склонны воспринимать симметричные объекты как один объект.
Закон смыкания утверждает, что люди склонны объединять объекты, которые на самом деле едиными не являются.

В логотипе IBM мы видим буквы I, B, M хотя на самом деле там есть только линии различной длины. Источник.
Подробнее эта тема раскрыта в статье Gestalt principles of form perception.

The Self-Reference Effect
Этот эффект особенно важен при создании текстов для веб, поскольку может значительно улучшить связь между автором и читателем. Вещи, связанные с нашим собственным опытом, мы запоминаем лучше, чем те, которые с нами не связаны. К примеру, после прочтения статьи люди лучше запоминают персонажей, истории или факты, с которыми они были как-то связаны.

Оригинал на английском.

Ресурсы по юзабилити технологиям:

  • Interaction Design Encyclopaedia
    Развивающаяся энциклопедия по взаимодействию человека и компьютера. В статьях внимание обращено не только на термины юзабилити, но и на особенности их использования в современном дизайне.
  • Usability First Glossary: Alphabetical Index
    Один из крупнейших юзабилити глоссариев с сотнями статей о терминах и сущностях юзабилити.
  • Usability Glossary
    Юзабилити глоссарий от Information Technology Systems & Services of the University of Minnesota Duluth.

В России юзабилити технологии активно продвигают UsabilityLab. Ввод в нормы создания интерфейсов можно посмотреть в их видео на хабре
Так же много интересной информации можно найти на сайтах: http://www.usability.ru/ http://www.gui.ru/

0 COMMENTS
LEAVE A COMMENT
Click here to cancel reply.

You must be logged in to post a comment.

  • Глобино
    WebDesign
  • МОЯ Фотокнига
    WebDesign
  • МИР Керамики
    WebDesign
  • Letters&Digits Typography
    WebDesign
  • MASS Analytics
    WebDesign
  • Quick print
    WebDesign
  • Reba’s
    WebDesign
  • Foto Journeys
    WebDesign
  • Maverick Edge
    WebDesign
  • 1001pizza.com.ua
    WebDesign
  • Домашний ПК
    WebDesign
  • Sinfully Gourmet
    WebDesign
  • Контур ЭНЕРГО
    Print
  • Stichting Janssensfonds
    WebDesign
  • 1001sushi.com.ua
    WebDesign
  • La Bozzetta
    WebDesign
  • Preysi
    WebDesign
  • Videokrok
    WebDesign
  • careers.ua
    Development
  • Stay Hungry
    WebDesign
  • CUTERA
    WebDesign
  • Спортивный клуб MegaGym
    WebDesign
  • Job4it
    Development
  • Gold City
    WebDesign