GUI, изящным можешь ты не б., но аккуратным б. обязан

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

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

Три правила
В этой презентации Владислав рассказывает о трех правилах, применяя которые можно сделать элегантным любой интерфейс:
1) Все размеры и все пропорции должны быть взаимосвязаны.
2) Заголовок экрана/страницы должен быть: а) визуально значимым и разборчивым; б) кратким и информативным.
3) Фон должен быть или белым или черным (исключение – для книг или блога Guicci, ориентированных на продолжительное чтение :)

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

Элегантность + Аккуратность
Практически каждая экспертная оценка, которую я делаю, начинается со скриншота главного экрана программы или страницы сайта, где я при помощи красных, жирных линий отмечаю неточности с выравниванием и паузами. Далее я вставляю скриншот или ссылку на прототип, в котором тот же самый интерфейс перерисован с учетом Правила 1. В сопроводительный текст я обязательно включаю, причем несколько раз, слово неаккуратно, потому что считаю интерфейс, в котором нарушено Правило 1 неаккуратным и небрежным (а 2 правило, на мой взгляд, лежит в плоскости контента, а не визуального восприятия). Неэлегантно – это очень мягко сказано, куда как эффективнее по степени воздействия на заказчиков или на их программистов звучат слова неаккуратно или небрежно.

Давайте сравним:

АККУРАТНЫЙ лат. точный, верный; – вещь, тщательно, искусно и чисто обделанная;

Элегантный (франц. élégant), изящный, изысканный.

Элегантность для интерфейса, на мой взгляд, штука опциональная, необязательная, а вот аккуратность – must have. “Изящным можешь ты не быть, но аккуратным быть обязан”. И еще, когда я говорю или пишу “элегантно”, я обращаюсь к правому полушарию заказчика, к его чувствам, а когда я употребляю “аккуратно”, я бью по левому полушарию, по рассудку. А достучаться очень хочется, потому что нужно сделать продукт клиента чуточку более выгодным, за счет таких вот “мелочей”. И теперь, после презентации Владислава, я начну использовать “элегантность” вкупе с “аккуратностью”!

Почему интерфейсы получаются неаккуратными?
Владислав приводит следующие причины:

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

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

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

Вот и приходится начинать экспертную оценку со слов “неаккуратно” и “неэлегатно”.

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

ps. Приношу извинения за сокращения, которые я сделал в заголовке заметки: это как раз тот случай, когда красота (заголовок в одну строку) берет верх над удобством.

  • bobrdobr
  • memori
  • del.icio.us
  • Digg
 Понравилась заметка? Подписывайся на обновления блога!

О статье




Самые популярные статьи
[?]




Реклама



Стоит также почитать



Контактная информация



Заказ

Warning: include(/h/guicciru/htdocs/tsbmailer/show_form.php): failed to open stream: No such file or directory in /home/sites/guicci.ru/htdocs/wp-content/themes/hemingway-reloaded-10/single.php on line 192 Warning: include(): Failed opening '/h/guicciru/htdocs/tsbmailer/show_form.php' for inclusion (include_path='.:/usr/share/php:/usr/share/pear') in /home/sites/guicci.ru/htdocs/wp-content/themes/hemingway-reloaded-10/single.php on line 192