Принципы разработки пользовательского интерфейса

Маркетинг10 Контекстная реклама13 Создание сайтов13 SEO8 Комплекс услуг5 Дизайн14 Программирование11 SMM4 Использование сервиса5 Digital2 Мобильная разработка1 Юзабилити2 Брендинг2 Менеджмент1 Интернет-маркетинг3 Интранет2

ЮзабилитиСтатья

ИнтерфейсыСоветыГрафический дизайнUsability (удобство использования)

Принципы Джошуа Портера, дизайнера интерфейсов в HubSpot.

Joshua Porter

27 мая 2012

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

- Пол Рэнд

Роман Павленко
Digital Creative Director Leo Burnett Group Russia

Многообещающее начало! Пол Рэнд, один из моих любимейших дизайнеров, разработавший логотип и заложивший основы фирменного стиля IBM, а также сумевший переплюнуть в наглости и самоуверенности самого Стива Джобса. Когда Джобс спросил Рэнда, который приступал к разработке логотипа для новой компании Джобса Next, сколько вариантов тот предоставит, Пол ответил, что не производит для своих клиентов варианты: «О вариантах не может быть и речи, и вы мне в любом случае заплатите». Кстати, речь шла о рекордном для 1985 года гонораре за логотип — 100 тысяч долларов.

Больше не нужно искать и обзванивать каждое диджитал-агентство
Создайте конкурс на workspace.ru – получите предложения от участников CMS Magazine по цене и срокам. Это бесплатно и займет 5 минут. В каталоге 15 617 диджитал-агентств, готовых вам помочь – выберите и сэкономьте до 30%.
Создать конкурс →

Интерфейсы существуют для инициации взаимодействия

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

Ясность - задача №1

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

Роман Павленко
Digital Creative Director Leo Burnett Group Russia

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

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

Любой ценой удерживайте внимание

Мы живем в мире раздражителей. В наше время сложно погрузиться в чтение – что-то постоянно отвлекает нас и пытается привлечь к себе внимание. А оно бесценно. Не перегружайте боковые панели вашего приложения раздражающими материалами, помните, для чего предназначен экран в первую очередь. Если кто-то читает – дайте ему дочитать до конца, прежде чем показывать рекламу (если без этого нельзя). Уважайте внимание и тогда не только ваши читатели станут счастливее, но и улучшатся ваши показатели. Когда главная цель – побудить к взаимодействию, внимание становится обязательным требованием. Удерживайте его любой ценой.

Дайте пользователям контроль

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

Роман Павленко
Digital Creative Director Leo Burnett Group Russia

В состоянии уюта так легко задремать:) А ведь в предыдущем абзаце автор как раз говорил о необходимости удерживать внимание пользователя, причем любой ценой!

Держите пользователей у руля, регулярно демонстрируя им состояние системы, описывая возможные результаты (если вы сделаете то-то, произойдет то-то) и намекая, чего следует ждать во время следующего шага. Не бойтесь сообщать очевидное… ведь оно почти никогда таковым не является.

Роман Павленко
Digital Creative Director Leo Burnett Group Russia

Автор статьи, вероятно, является наиболее верным последователем своих собственных же заповедей :)

Прямое взаимодействие является наилучшим

Лучший интерфейс – это его отсутствие, аналогичное нашему миру, где мы способны манипулировать физическими объектами напрямую. Так как это возможно далеко не всегда вследствие растущей информационной насыщенности объектов, мы создаем интерфейсы, дабы облегчить взаимодействие с ними. Очень легко увлечься и добавить слоев больше, чем требуется. Так появляются безумно вычурные кнопки, хромирование, графика, опции, настройки, окна, дополнения и прочая мишура и вот мы уже обнаруживаем себя манипулирующими элементами интерфейса, а не чем-то важным. Откажитесь от этого, стремитесь к изначальной цели прямого управления… к созданию интерфейса с наименьшим весом, способным воспринимать наибольшее количество простых человеческих жестов. В идеале интерфейс должен быть настолько легким, чтобы у пользователя создавалось ощущение прямого взаимодействия с целевыми объектами.

Одно основное действие на экран

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

Оставляйте второстепенные действия на втором плане

Экраны с одним ключевым действием могут поддерживать несколько второстепенных, но держите их в стороне! Ваша статья существует не для того, чтобы люди могли поделиться ею в Twitter’е… она нужна для того, чтобы люди могли прочитать и понять ее. Держите второстепенные действия на втором плане, делая их менее заметными или демонстрируя после выполнения ключевой задачи.

Делайте следующий шаг естественным

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

Функциональность важнее внешности (действие важнее формы)

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

От редакции

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

Рейтинг представляет собой топ-100 из самых креативных команд России, Украины и Беларуси, а также подрейтинги относительно побед, одержанных в каком-либо конкретном конкурсе из шести: «Рейтинг Рунета», «Золотой сайт», Webby Awards, CSS Design Awards, Awwwards и FWA.

Согласованность имеет значение

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

Сильная визуальная иерархия – лучший вариант

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

Продуманная организация снижает когнитивную нагрузку

Как сказал Джон Маэда в своей книге Simplicity, продуманно расположенные на экране элементы могут заставить большое казаться малым. Демонстрация контента в его логической взаимосвязи помогает людям быстрее и легче воспринимать ваш интерфейс. Группируйте схожие элементы, показывайте их взаимосвязь с помощью их локации и взаиморасположения. Организовав свой контент с умом, вы снизите когнитивную нагрузку, оказываемую им на пользователя… которому не придется думать над тем, как соотносятся элементы интерфейса – ведь вы уже сделали это за него. Не вынуждайте пользователя размышлять над взаимосвязями… продемонстрируйте их ему на экране.

Непредопределенное выделение цветом

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

Прогрессивное раскрытие

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

Помогайте людям на лету

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

Решающий момент: точка входа

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

Важнее всего существующие проблемы

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

Лучший дизайн незаметен

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

Развивайте навыки в других дисциплинах

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

Интерфейсы существуют, чтобы ими пользовались

Как и большинство других дизайнерских дисциплин, дизайн интерфейса успешен, когда люди пользуются плодами ваших усилий. Как красивый стул, на котором невозможно сидеть, проект проваливается, если люди не хотят им пользоваться. Таким образом, дизайн интерфейсов может рассматриваться не только как создание среды взаимодействия, но и как разработка объекта использования. Самого интерфейса недостаточно для удовлетворения Эго дизайнера – им должны пользоваться!

Роман Павленко
Digital Creative Director Leo Burnett Group Russia

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

Оригинал статьи: http://bokardo.com/principles-of-user-interface-design/

Макс Гулевич
Руководитель отдела проектирования и дизайна в РосБизнесКонсалтинг

Уууф, самый капитанский пост, который я комментировал.

Что ж, попытаюсь добавить что-то свое:

При проектировании интерфейса привыкните к тому, что первую и вторую версию вам придется выбросить на помойку. Если вы этого не сделали — вы сделали плохой интерфейс. Это чисто из собственного опыта. Бывает, что с первого раза что-то получается, бывает, что с пятого. Медиана — третья версия.
Разрабатывая дизайн никогда не стоит забывать о том, что дизайн — понятие, которое распространяется не только на сайт, приложение и систему. Дизайн — это план всей жизни вашей системы от начала и до конца ее использования пользователем («что→если)», где учтено все, что только можно. Преступники, собираясь на дело, разрабатывают дизайн мероприятия по ограблению банка, например, расписывая все по минутам. Разработчик разрабатывает дизайн архитектуры приложения, смысл разработки которого в том, чтобы приложение не просело по нагрузке, было масштабируемым, расширяемым, легким в его рефакторинге и т.д. Абсолютно также и дизайнер должен заниматься созданием дизайна интерфейса.
Все гениальное — просто ©. Известная фраза, неправда ли? Могу добавить еще одно эмпирическое наблюдение: гениально простые и удивительно работающие вещи получаются тогда, когда все очевидные идеи уже перебраны и обработаны. Идите до конца. Креатив (не очень люблю это слово, но простите, что я тут его использую) всегда лежит на поверхности, но додуматься до него не всегда просто. Обычно работает примитивный алгоритм перебора вариантов. Есть методики, ускоряющие приход к цели и поиску варианта решения проблемы, но они во многом индивидуальны и я не буду их тут приводить.
Начиная с какого-то момента у любого дизайнера открывается «второе дыхание». Обычно где-то после 8 лет упорной работы, при условии постоянного обучения и поддержания себя в форме, он перестает копировать чужие идеи и начинает генерить свои, которые и становятся трендом и модой. Практика показывает, что 99% дизайнеров не замечают этого момента.
При современном уровне технологий, методик и практик, создание качественного и работающего дизайна — дело техники (простите, если я кого-то обидел). Однако побеждает тот, кто делает это первым для данной ниши/типа/домена/области/уникального-вэлью продукта или бизнеса. Пионер забирает 80% рынка. Последователь забирает 10%. Все остальные — шарят оставшиеся 10%. Вот почему работа дизайнера в современном бизнесе — это упражнения на выносливость на скорость. Инфа 94% :-)

Ольга Павлова
Совладелец в «Собака Павлова»

Очень важно и правильно вырабатывать принципы профессии: делай так и этак, уделяй внимание тому и этому. Но общая философия должна быть поддержана практикой: что конкретно делать, как конкретно уделять внимание? Статьи, в которых нет таких практических рекомендаций, напоминают знаменитый анекдот: «А как нам стать ёжиками? — Не знаю, я стратег». Соответственно, чтобы получить от этой статьи практическую пользу, нужно провести большую самостоятельную работу: каждый лозунг превратить в что-то чуть более прагматичное и приближенное к земле. Увы, только тогда общие слова превратятся в реальную пользу.

Сергей Попков
Owner/Partner в AIC

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

Спустимся на землю. Есть специфика и суровые реалии жизни. Есть и российская ментальность восприятия. Не все работает так как должно работать.

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

В кокпите боинг-737 на пилота смотрит более 150 функций управления разными системами.
И они идеально организованы с точки зрения пилота. Но для автора этой статьи наверное было бы проблемно в этом разобраться. Это плохой интерфейс? Нет, он просто идеально спроектирован под определенный класс специалистов. И универсальным никогда не станет.

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

И главное, не забывайте посредством интерфейса общаться с людьми на нормальном языке. Ведь можно написать — Вас приветствует автоматическая система информирования бла бла ... а можно и Здарова! Как сам?

И наконец, выкиньте эти шаблоны из головы! Не читайте слишком много подобного. Это начинает ограничивать ваши мысли и творчество стереотипами. Думайте и творите сами! Просите коллег и друзей подливать больше конструктивной критики.

Евгений Плужников
UI Designer в Workle

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

Александр Киров
Ведущий мобильный дизайнер в Mail.Ru Group

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

Возьму простой пример — в состав пакета Creative Suite от компании Adobe входит приложение Dreamweaver, основной задачей которого выступает создание и редактирование веб-страниц и программного кода сайтов. С каждой версией количество доступных функций все увеличивается и пользоваться ими становится все сложнее. А теперь давайте подумаем, сколько из этих возможностей мы действительно постоянно используем?

Окажется, что не так уж и много. И с большинством из них проще и удобнее работать в значительно более простых приложениях, вроде Espresso или Coda. И меня очень радует, что есть разработчики, которые пытаются изобрести совершенно новый подход к интерфейсу, пусть и в ущерб функциональности программного обеспечения, но при этом пытаясь обеспечить максимально комфортную работу. Одним из последних примеров стала IDE Light Table от Криса Грангера, которая собрала уже более 220 тысяч долларов на Kickstarter.

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

Сергей Швецов
Проектировщик интерфейсов в Mail.Ru

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

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

Единственный и самый большой недостаток статьи — это некачественный перевод. Отсутствие научной редактуры приводит к странным артефактам уничтожающим нюансы и дающим новый смысл словам автора. Сравните заголовок «Функциональность важнее внешности (действие важнее формы)» и «Appearance follows behavior (aka form follows function)».

Александр Меркулов
Директор в Бинарио

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

Фёдор Аксёнов
Консультант по UX дизайну в wagthedog.ru

Это не статья, это какая-то Нагорная Проповедь. Да, все слова правильные, да все идеи прекрасные, да, я тоже за мир во всём мире и после каждого абзаца хочется воскликнуть «Аллилуя!». Спасибо всеблагому Джошуа Портеру, что поделился с нами столь великой мудростью!

Но что нового и полезного узнаем мы после прочтения этой статьи? Чему научимся? Какой опыт приобретём? Как мы можем использовать её в своей работе? Мне кажется, что никак. А так статья хорошая и Джошуа Портер молодец.

Владимир Завертайлов
Генеральный директор в Сибирикс

Спасибо за перевод. Ок, во такие будут 5 копеек.

Интерфейсы — вторичны.

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

Технология — первична.

Однако, чтобы технология пошла в массы (в рынок) — ее необхо причесать, сделать няшной и сексуальной. Все помнят вот такие машинки?

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

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

Евгений Гуринович
Head of UX в ARTOX media

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

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

Андрей Зайцев
Head of Design Services в RuTube

Эволюция общества за последние десятки лет существенно изменила подходы к реализации и требования к пользованию интерфейсами. При разработке современных интерфейсов стоить обратить внимание на двух «концептуальных китов» взаимодействия людей в окружающей среде и социальном обществе:

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

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

Леонид Бугаев
Владелец в Nordic Agency AB

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

Меньше букв, больше инсайтов и выводов. Мой вывод — хороший КПД: ценность информации высокая.

Все ясно? Ясно. Понятно? Еще бы. Все — закончили читать, пошли интерфейсы строить!

Дмитрий Подлужный
Арт-директор в Spacebox

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

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

Павел Веретенников
Руководитель проектов и техрайтер в Nimax

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

The Experience belongs to the user.
Technology serves humans.
Design is not Art.
Great design is invisible.
Simplicity is the ultimate sophistication.

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

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

А переводчикам хотелось бы предложить чуть точнее перевести заголовок п. 14: «progressive disclosure» в русском языке имеет устоявшийся перевод — последовательное раскрытие.

Ольга Вахромеева
UX Designer в Multichannel Research Limited

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

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

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

Алексей Кандауров
Ведущий дизайнер в Mail.Ru Group

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

Что касается смысла, то хочется поспорить с утверждением, что все интерфейсы должны быть незаметны и сосредотачиваться только на выполнении задачи. Существует множество приложений, которыми пользуются только из-за качественно-прорисованного и очень заметного интерфейса. Взять хотя бы различные имитаторы приборов и музыкальных инструментов из реального мира. Согласитесь, если бы их интерфейс не был так заметен, то они не были бы столь популярными. Так что не стоит забывать, что реалистичность и заметность интерфейса, включая «хромирование, графику, опции, настройки, окна, дополнения и прочую мишуру», которые так не нравятся Джошуа, иногда и являются задачей, поставленной перед приложением.