Согласно теории разбитых окон люди в два раза чаще мусорят на улицах, если на стенах нарисовано граффити. Этот закон применим к работе дизайнеров и программистов — если офис плохой, стул разваливается, а в туалете воняет, значит жди кучу мелких багов в коде и небрежности в дизайне.
Я вовсе не утверждаю, что если посадить людей в элитный офис, дать всем по новенькому Маку, то работа пойдет в два раза лучше. Отнюдь. Но я убежден, что в обратную сторону этот принцип работает. Люди в душном грязном офисе, сидящие на качающемся стуле, делают в два раза больше мелких ошибок. Это утверждение не универсально:
увеличивается только количество мелких ошибок, идущих от небрежности;
эффект проявляется только на контрасте «плохо/нормально», т.е. если заменить сотрудникам разваливающиеся дешевые кресла на нормальные это принесет плоды, но если проапгрейдиться до еще более дорогой модели, эффекта уже не будет;
закон работает для программистов и дизайнеров, я не уверен, что он будет работать, скажем, для бухгалтеров или секретарей;
речь идет об окружении (офис, мебель, кухня, район города), а не о средстве производства — если у работника тормозящий компьютер, то нужно ждать не мелких помарок, а медленной работы;
фактор окружения не является самым сильным и может быть перекрыт чем то другим, например, обидой на начальника.
Давайте посчитаем
По моему опыту одни из самых частых косяков работодателей — это плохие компьютеры и дешевые кресла. Прикинем, так ли выгодно на них экономить.
Сейчас хороший программист в Питере получает 70 т.р. Для работодателя это стоит около 100 т.р. в месяц. Разница между плохим и хорошим компьютером составляет 25 т.р., а между плохим и хорошим креслом — 3 т.р. Примем срок службы равным двум годам.
Получается, что нормальное кресло стоит дороже на 0.1% от зарплаты работника, а компьютер — на 1%. На самом деле компания тратит на работника гораздо больше, но ведь мебелью и компьютерами не ограничиваются «раздражающие факторы», так что оставим это упрощение.
Стоит ли 1% расходов двухкратного увеличения количества мелких ошибок?
На этот вопрос каждый работодатель должен ответить сам. Допускаю, что есть множество компаний для которых увеличение мелких ошибок ничего не стоит, а вот 1% расходов — очень и очень много. Другой вопрос, хотят ли квалифицированные сотрудники создавать продукт, который прощает постоянную небрежность?
Закончу цитатой самого эффективного менеджера всех времен и народов:
Как мертвые мухи портят и делают зловонными благовония, так и небольшая глупость перевешивает мудрость и честь. (Екклезиаст 10:1)
Я хочу рассказать, как создать идеальное дизайнерское портфолио. Последние пять лет я постоянно нанимаю на работу дизайнеров и проектировщиков интерфейса — по этой причине к моим словам стоит прислушаться (а не потому что я сам дизайнер). Я считаю, что нет ничего более эффективного для отбора дизайнеров, чем портфолио. Опытный арт-директор узнает из портфолио о потенциальном работнике в тысячу раз больше, чем из резюме.
Портфолио должно быть
С дизайнером без портфолио разговаривать не о чем. Это касается и всяких новомодных UX-специалистов. Работал — значит есть, что показать. Ты же не менеджер, результат работы которого не могут разглядеть даже его начальники :) Любой дизайнер создает что-то визуальное и точка. А то, что это потом испохабили нерадивые программисты и неряшливые заказчики — это часть профессии и за отмазку не катит.
Всякие договоры о конфиденциальности тоже лишь отмазка — убери упоминания о бренде, подставь неконфиденциальные данные и смело выкладывай. Если ты не дизайнер, а «скорее по юзабилити» — выкладывай Wireframes плюс конечный результат с пометкой, что дизайнил не ты.
Основные моменты
Используйте веб. На портфолио должна быть ссылка, которая сразу открывается. Плохо присылать архивы, которые нужно распаковывать, а потом, путаясь в папках, просматривать.
Помните о доступности. Каждая работа должна иметь свой собственный URL. Я часто хочу отправить коллегам ссылку на какую-то работу, но не могу этого сделать из-за какой-нибудь новомодной jQuery галереи с инновационной анимацией.
Не мельчите. Не надо сильно уменьшать картинки — сейчас у всех большие мониторы. Желательно, чтобы экранная графика была доступна в оригинальном размере.
Сделайте прокрутку. Очень круто, когда работы можно смотреть одна за одной. И обязательно нужно понимать, что ты уже посмотрел, а что еще нет (оказывается посещенные ссылки умеют менять цвет).
Начинайте с сильных работ. Портфолио — это как музыкальный альбом, первой должна идти песня-блокбастер.
Не выпендривайтесь. Не нужно поражать невероятными спецэффектами или креативным дизайном. Портфолио — место для показа работ, на них все внимание. Уберите все лишнее, что не относится к делу.
Много работ не нужно
Отдельно хотел сказать про количество работ. Много работ — это плохо. Чтобы понять квалификацию человека, достаточно увидеть 3–5 лучших работ. У большинства дизайнеров есть работы из разных областей (интерфейсы, сайты, графика и т.д.); в итоге идеальное портфолио — это 7–15 работ. На каждую работу достаточно одной, самое большее трех картинок, не нужно показывать все нарисованные экраны :)
Опытные дизайнеры не утруждают себя расчисткой Авгиевых конюшен, и в результате прекрасные алмазы теряются в куче проходного шлака. Молодежь пытается показать все, что есть, — поверьте, лучше не надо.
Делать ли свой сайт
Стоит ли делать свой сайт или можно обойтись готовыми сервисами? Если у вас мало времени, а портфолио вам особо не нужно — выложите избранные работы в какой-нибудь Дропбокс. Если же вы серьезно относитесь к самопиару, то без личного сайта не обойтись. На нем вы можете показать все, чему научились, ваше внимание к мелочам, сдержанность и стиль.
По традиции закончу словами самого успешного арт-директора в истории — царя Соломона:
Видел ли ты человека проворного в своем деле? Он будет стоять перед царями, он не будет стоять перед простыми. (Притчи 22:29)
Герой Мэтта Дэймона из кинофильма «Умница Уилл Хантинг» говорит богатенькому студенту, которого только что победил в ученом споре: «ты выкинул 150 тысяч на образование, которое мог бы получить за полтора доллара в публичной библиотеке». Сегодня эти слова стали по-настоящими актуальными — информация по большинству областей знаний доступна бесплатно, но квалифицированных специалистов больше не становится.
В школе я часто пытался скопировать игру любимых рок гитаристов. Часами я «снимал соляк» — получалось довольно скверно. Сейчас обучающее видео, как играть любой из этих треков, можно найти на Ютубе. Знание, бывшее уделом избранных, доступно бесплатно и в очень понятной форме. Да что там гитара — американский школьник в рамках дипломной работы скаута создал в родительском гараже ядерный реактор в котором пошла настоящая реакция (хорошо хоть не цепная).
Что уж говорить про знания из айтишной области! Они имеются в открытом доступе на любой вкус. Почему же тогда к нам в офис Digital Design регулярно звонят люди и просят научить их проектировать интерфейсы в нашей UX-школе, сетуюя, что кроме нас этому нигде не учат и огорчаются, когда я объясняю, что у нас не платные курсы, а оригинальный метод стажировки студентов? Ведь все знания, что мы даем, доступны в интернете. Даже платные профессональные конференции выкладывают видео докладов в открытый доступ. Кроме «полутора долларов» на интернет-траффик ничего не нужно!
Сохраняй фокус, отказывайся отлишнего
Поколениями люди в СССР привыкали собирать вещи. Я помню как в мое советское детство мы бережно хранили маленькое бесплатное мыло из заграничного отеля — казалось оно было такое красивое, что жалко руки мыть. Сейчас же многие семьи сталкиваются с необходимость регулярно выбрасывать вещи из дому. Даже удивительно, как можно выбросить несколько мешков абсолютно ненужных вещей, когда ты же сам их недавно купил.
Таже ситуация со знаниями — приходится отказываться от множества ненужных знаний, чтобы сосредоточиться на важных. Посчитайте, сколько интересных ссылок вы залайкали сегодня в Фэйсбуке, а сколько мимишных котят Вконтакте? Или может быть вы интеллектуал и обсуждали преимущества Android перед iPhone в Гугл+? А сколько часов в неделю вы смотрите телевизор? (Только новости и спорт, конечно же:)
Тратя время на интересную, но неважную информацию, невозможно стать высококлассным специалистом ни в одной области — на это не хватит времени. Поэтому нужно учиться говорить «нет», нужно перестать захламлять свой мозг одноразовой информацией, которая мило выглядит.
На днях мы в офисе открыли библиотеку для UX-дизайнеров. Оказалось, в мире существует огромное количество обалденных книг, которые прочесть хочется, но времени абсолютно нет, потому что нужно сидеть и писать в этот глупый блог.
Закончу словами самого мудрого, знающего и успешного человека за всю историю земли — царя Соломона:
...составлять много книг — конца не будет, и много читать — утомительно для тела. (Екклесиаст 12:12)
Текст окружает нас всюду. Он информирует нас, предостерегает от ошибок, даже угрожает. Текст — основное средство взаимодействия с пользователем, как в реальном, так и в виртуальном мире. И как любой интерфейс созданный человеком, текст часто бывает плохим.
Вот, к примеру, такой шедевр я обнаружил в админке моего интернет-провайдера:
Я много раз перечитывал это сообщение, я делал это внимательно (ведь речь идет о моих деньгах), но смысл каждый раз ускользал от меня.
Или вот еще пример, буквально на днях обнаружил в гостинице во время командировки:
Я снова и снова перечитывал послание, и каждый раз чувство полного понимания сменялось фрустрацией — я так и не разобрался, если положить этот листочек на кровать, белье сменят или «неправильно поймут».
Каждый из нас может привести множество подобных примеров. Так что давайте поговорим о том, как подобного избежать в интерфейсах, которые создаете вы.
УВЛ
Артём Горбунов изобрел универсальный метод улучшения интерфейсов под названием УВЛ (убери все лишнее). Он прекрасно работает с интерфейсными текстами. Давайте рассмотри его на двух показанных выше примерах.
В случае с моим провайдером текста не должно быть вовсе — мне безразлично как там что работает с погашениями, важно лишь видеть сколько и когда нужно заплатить, чтобы не отключили интернет (а это показывается цифрами, а не буквами).
В случае с гостиницей нужно написать так: Если вы хотите поменять постельное белье, положите этот листок на кровать. Внимательный читатель возразит, что я опустил тему про охрану окружающей среды. Я отвечу по-одесски: «я вас умоляю, какая окружающая среда в этом городе».
Баскетбол на месте
Когда я учился в средней школе, на уроках физкультуры мы иногда играли в баскетбол. Никто играть не умел и главной ошибкой было то, что каждый, получив мяч, никому не отдавал пас. Тренер показал нам метод, который я запомнил на всю жизнь. Он заставил нас играть в баскетбол, где запрещено вести мяч (ударять его об пол), единственный способ играть — часто делать пас и постоянно открываться партнерам.
Я предлагаю использовать этот метод тем, кому необходимо научиться писать хорошие интерфейсные тексты. Попробуйте сделать интерфейс полностью понятным, совсем не используя текст.
Конечно, часто подобное невозможно, но ведь и в баскетбол не играют без ведения меча, это лишь тренировка. Добейтесь максимума без текста и лишь потом добавляйте пояснения. Помните, интуитивно понятный интерфейс — это тот, который не нужно читать.
Если же вы хотите проверить на понятность уже созданный веб-интерфейс, пропустите его через Гугл переводчик и получите страницы скажем на португальском языке. После этого отправляйтесь проводить юзабилити-тестирование.
Бревно в своем глазу
Ну и конечно же, все вышесказанное можно отнести к этой статье. Ее можно сильно сократить, не потеряв сути. Например так:
Не пишите поясняющие тексты в интерфейсе, а если это невозможно, пишите их коротко и однозначно.
Нас окружает множество интерфейсов. И не только в компьютере и телефоне, но и в лифте, транспорте и даже под магнитиком, что прилеплен к холодильнику. Многие эти интерфейсы плохие, так уж повелось. Но на то мы и называемся UX-специалистами, чтобы улучшать мир вокруг себя. Начнем, естественно, с холодильника.
У нас с женой есть двое детей, 8 лет дочке и 3 года сыну. Оба они плохо кушают. Поэтому мы разработали «адресную федеральную программу» — за каждый быстро и полностью съеденный завтрак (обед или ужин) ребенок получает звездочку. 20 звездочек — приз. Для дочки — поход в кино, для младшего — пироженое и машинка в подарок.
Холодильник был выбран главным государственным порталом и подрядчик в лице моей жены разработал вот такой интерфейс:
Конечно, я покритиковал его за большое количество оформительской графики и избыточную когнитивную нагрузку на пользователя. Но проект нужно было стартовать, и мы запустились с этой версией.
Наблюдение за пользователями показало, что дочка хорошо понимает интерфейс. Будучи школьницей, она знает что такое дни недели и легко может посчитать, сколько же осталось до желанного приза.
Однако сын плохо воспринимал этот интерфейс. И это сказалось на результате — когда дочка уже пошла в обещанное кино, он набрал лишь чуть более половины звездочек. Потребовался срочный редизайн и за дело взялся профессионал.
Я удалил ненужную оформительскую графику, убрал дни недели (потому что не важно, когда заработана звездочка, важно сколько осталось до необходимых двадцати). Также я показал призы очень наглядно и предоставил сыну возможность самому рисовать (закрашевать) звездочки. Вот что получилось:
Результат не заставил себя ждать. Сын, даже не умея считать, знал, сколько осталось звездочек до получения наглядно показанных призов. Он с удовольствием закрашивал оставшиеся звездочки и быстро добрал недостающие очки.
Как ни странно, эффект сохраняется и после окончания проекта. Наш трех летний сын наконец-то есть только сам — он просто не дает нам его кормить, потому что где-то в его прошивке навсегда отпечаталось, что с ложечки кормят только лузеров.
А какой интерфейс в своей жизни улучшил ты на этой неделе?
Недавно, в одном бизнес-центре, где я часто бываю, появлися новый медицинский центр. Проходя мимо, я поймал себя на мысли, что он мне нравится и я ему, пожалуй, доверяю и готов при необходимости воспользоваться услугами их врачей. Я спросил себя: «почему»? Я ведь видел только вывеску, и да, она показалась мне довольно профессионально выполненной. «Виновата профессиональная дизайнерская деформация», — решил я. Но потом я подумал, что хорошая вывеска о многом говорит.
Мир вокруг нас полон ужасного дизайна — аляповатых вывесок, «цыганских» интерьеров, вырвиглазовых сайтов. Откуда это все берется? Логично предположить, что дело в плохих дизайнерах. Отчасти это верно, но лишь отчасти.
Дизайнерская среда полна анекдотов про безумных заказчиков (или начальников), которые садятся рядом и начинают играть в дизайнера, двигать картинки, просить добавить цветов и сделать «меньше пустоты». В результате выходит... ну, выходит то, что обычно выходит. Дизайнеры смеются над такими заказчиками, но им это нужно, чтобы не сойти с ума. На самом деле таких заказчиков можно понять.
Вот к примеру некий сферическо-вакуумный директор. Он делает сайт (вывеску, буклет) для своего ДЕТИЩА. Это его бизнес, он и только он знает, что его «ребеночку» нужно. Поэтому он и обязан взять все в свои руки, в том числе и дизайн. В лучшем случае он навязывает дизайнеру свою волю, а в худшем — делает работу самостоятельно. Однако, он не дизайнер и результат выходит плохой. Почти всегда. Но беда не ходит одна. Подобная практика скорее всего распространяется и на все остальные сферы деятельности компании. Вероятно, повар в кафе у такого директора будет плохо готовить, а уборщица плохо мыть полы.
Это называется неумение делегировать полномочия. Хорошего руководителя от плохого отличают следующие вещи:
навык делегировать полномочия,
умение доверять профессионалам в сфере их деятельности,
способность не относиться к сотрудникам, как детям-дебилам,
дар контролировать ситуацию, не занимаясь при этом микроменеджментом.
Именно поэтому, если владелец увиденного мною медицинского центра смог доверить дизайнеру создать вывеску (не такую уж красивую, к слову, просто аккуратную, без аляповатости), то уж точно он смог доверить все врачебные дела кому-то компетентному в медицине.
Конечно, нужно относиться к данному правилу с осторожностью (и не пытаться повторить это дома), но все же правило часто работает: видишь хороший сайт или вывеску — значить фирма хорошая. В данном случае не работает поговорка «встречают по одежке, провожают по уму», потому что хорошая одежка очень часто является признаком наличия ума, а не просто красивым фасадом.
Я считаю, что Adobe Fireworks самая недооцененная программа для прототипирования интерфейсов. В некоторых подразделениях нашей компании именно Fireworks является основным инструментом для юзабилити специалистов. При этом мы почти не используем анимационные возможности программы. В этой статье я хочу рассказать, почему мы считаем эту программу лучшей именно для рисования интерфейса.
Wireframes или чистовой дизайн
Многие юзабелисты принимают за аксиому идею, что интерфейс сначала нужно реализовать в виде wireframes, отладить, согласовать, а уже потом «раскрашивать». Некоторые считают, что дизайном должен заниматься другой человек (я проектирую, а красоту наводит дизайнер). На первый взгляд это абсолютно верный подход, позволяющий экономить время, фокусироваться на логике взаимодействия, разделить обязанности и т.д.
Однако разбиение проектирования графического интерфейса на два этапа имеет и свои минусы. Часто цвет, нестандартный размер, графические приемы оформления — все это не просто добавляет «симпатичности» серым квадратикам, но и полностью меняет восприятие интерфейса пользователем. Именно поэтому я всегда недолюбливал wireframes и старался делать интерфейс сразу «на чистовую». Стоит оговориться, что мы в Digital Design в основном проектируем утилитарные системы, где какой-то особой «красоты» не требуется, так зачем рисовать серые прямоугольнички, если без проблем можно сразу нарисовать «закругленные и градиентные».
Вот пример интерфейса, который я недавно проектировал и одновременно работал над графическим оформлением:
А вот интерфейс от Ивана Филиппенко, еще одного любителя Fireworks:
Мы не потратили времени больше, чем если бы проектировали эти интерфейсы в InDesign, Visio или Axure, а выглядят экраны гораздо приятнее, чем в перечисленных программах. А т.к. для подобных профессиональных систем более гламурное оформление и не требуется, мы упразднили один этап, без ухудшения качества. Да, в Фотошопе тоже можно подобное нарисовать, но времени это займет больше.
Photoshop или Fireworks
Я много лет работал в Photoshop и считаю, что этот замечательный инструмент породил миф о том, что чистовой дизайн корректировать сложно и нужно отложить это на самый конец проектирования. Я раньше сам яростно отстаивал достоинства Фотошопа и отрицал его недостатки: ничего, что много слоев, я знаю волшебные клавиши ctrl и shift, я умею работать в Шопе быстро. Но в конце концов мы признали преимущество Fireworks и дружно перешли на него.
Вот несколько причин, почему Fireworks лучше подходит для визуализации интерфейсов:
в одном файле хранятся все страницы (Pages) интерфейса, а Master Page позволяет не хардкодить повторяющиеся элементы;
при этом размеры холста могут быть различными для каждой страницы;
каждая страница имеет множество состояний (States), поэтому если мне нужно показать всплывающее окно на странице или разворачивание пункта, не приходится постоянно включать/выключать слои;
слои не плодятся как кролики, ими при желании можно вообще не пользоваться (хватает Pages+States), но если и пользуешься, то не обалдевая от их количества, а используя возможности их шаринга между разными страницами;
имеется библиотека символов и можно создавать свои символы с определенными свойствами, в том числе и переменными, это позволяет гибко и быстро менять повторяющиеся элементы интерфейса, типа кнопок, иконок и т.п.;
старые добрые стили (Styles) и фильтры (Filters) дополняют гибкости и позволяют не забывать полезные фотошоповские привычки;
прекрасная работа с объектами, как в векторном редакторе (просто выделил рамкой и сгруппировал или просто передвинул, никаких удержаний горячих клавиш) и при этом адекватная работа с растром как по отображению, так и по редактированию;
про анимацию, нарезку и экспорт я не говорю, потому что это само-собой подразумевается.
Если кому-то будет полезно, я покажу какое расположение панелей в Fireworks я использую. Как видите, основные панели это Pages, States, Layers, а также библиотеки символов и свойства выделенного символа (картинка кликабельна):
А если все же не на чистовую?
Создавать сначала упрощенную визуализацию все же бывает полезно. У нас есть подразделение, которое занимается приложениями для iPad, на этой платформе как-то принято делать все гламурно и красиво. Ну, знаете, стеклянная буква на гранитном основании, по которой катится капля росы :) Рисовать такое сразу — это действительно вредно, отвлекаешься сам и отвлекаешь заказчика (да и не все умеют рисовать росу на стекле).
Но и тут Fireworks очень помогает. Помещаешь все повторяющиеся элементы или в Master Page или в библиотеку символов и думаешь только о логике и расположении. А когда нужно наложить текстуры, достаточно лишь поменять символы из библиотеки. Вот пример одного планшетного прототипа (автор Ольга Соколова):
Кстати, мы часто продаем кастомизации нашего планшетного продукта. Как правило заказчики просят поменять цвет, текстуру и здесь грамотно разработанный макет очень помогает.
Ложка дегтя
Безусловно Adobe Fireworks не завоевал заслуженной популярности не только из-за конкуренции Фотошопа. Неродной для Адоба интерфейс полумутировавший из Макромедии не добавляет ему поклонников. Но главная проблема программы — низкая стабильность. Впрочем, это проблема скорее платформы Виндоуз, на Маке программа работает довольно хорошо (хотя и не идеально). Ну про ресурсо потребление я думаю упоминать не стоит, все же это дизайнерский инструмент.
P.S. Уже упомянутый Иван Филиппенко утверждает, что если поставить значения для антиалиасинга текста «4 time, 190, 10», то он станет «как в браузере» и решится извечная проблема веб-дизайнеров. Впрочем, я попробовал и особого улучшения не заметил, хотя сам факт настроек радует, возможно кто-то из читателей предложит лучшие настройки.
Большинство специалистов, принимающих участие в проектировании и разработке пользовательских интерфейсов, давно запомнили простую истину — «интерфейс создается для конечного пользователя». А значит, пользователя нужно любить, лелеять и внимать каждому его отзыву. Но бывают случаи, когда юзабилист не должен слушать пользователя, давайте поговорим о проектировании интерфейса для профессиональных систем.
Случай из медицины
Не так давно мы занимались полной переработкой одной медицинской системы. В частности интерфейс процедурной сестры (которая регистрирует пациентов и помогает с выбором необходимых анализов) выглядел вот так:
Интерфейс этот очень плохой. И дело тут не в том, что он написан с помощью Экселя и не в графическом оформлении, просто он не выполняет многих задач, необходимых пользователю. Процедурная сестра, пользуясь этим ПО, вынуждена, во-первых, посещать несколько других ресурсов, чтобы ответить на ряд уточняющих вопросов, во-вторых, ей часто приходится искать глазами нужные строчки (поиск не работает), в-третьих, ей приходится писать от руки, потому что система не позволяет распечатать все необходимые документы. Одним словом, система неудобна для использования и занимает недопустимо много времени сестры на каждого пациента.
Недавно мне пришлось посетить один из филиалов этой медицинской сети, чтобы сдать анализы моего сына. Глядя на то, как процедурная сестра долго заполняет необходимые бумажки, я сказал ей, что вот прямо сейчас мы разрабатываем новый интерфейс для их системы. Милая девушка очень обрадовалась и сказала «наконец-то». Но продолжая разговор, я с ужасом понял, что ее пожелания к новому интерфейсу сводятся к «добавьте красивых котят». На мой вопрос, а удобно ли ей пользоваться сегодняшней системой, она уверенно ответила, что да, все нравится, все устраивает.
Если бы владельцы бизнеса слушали пользователей, то они ничего бы не стали менять (разве что добавили бы котят). Но к счастью, они люди здравомыслящие и понимают, что 6 минут на регистрацию одного пациента — это очень много и если сократить это время на пару минут и умножить на сотни филиалов по всей стране, то получится серьезная экономия.
Еще один случай
Второй подобный случай у меня произошел, когда я повторно записывался на массаж моей пострадавшей от остеохондроза шеи. Как и в первом примере, это тоже была сеть из нескольких филиалов. Первый раз я записался по телефону, а тут увидел, как девушка принимает звонки и записывает все вот в такую амбарную книгу.
Увидев такой олдскульный пользовательский интерфейс, я стал расспрашивать девушку, пытаясь выяснить, а вдруг это гораздо удобнее и эффективнее компьютера. Оказалось, что не удобнее и не эффективнее. Во-первых, отмененные сеансы массажа нужно замазывать белым «Штрихом», и действие «сдвинуть всех на немного» превращается в подвиг. Во-вторых, есть несколько массажных кабинетов и несколько мастеров-массажистов, которые работают не каждый день — это нужно держать в голове, отсюда ошибки. Естественно при таком методе записи о синхронизации нескольких филиалов сети (у нас в 7 вечера занято, но если вы подъедете в другой филиал) стоит забыть.
И в очередной раз меня удивило, что девушка очень позитивно относилась к этому бумажному пользовательскому интерфейсу. Признавала недочеты, но говорила, что ей все нравится и все очень удобно.
Эргономические показатели интерфейса
Лично мне кажется, что сказать «я уже два года вынужден пользоваться этим убогим интерфейсом» — это все равно что признаться, что ты неудачник по жизни. Впрочем, оставим психологам и социологам выяснять, почему люди любят свое окружение, ругают, но любят.
Лучше подумаем, как это может помочь при проектировании интерфейсов. Влад Головач в своей онлайн книге «Искусство мыть слона» предлагает использовать показатели Шнейдермана, согласно которым интерфейсы характеризуются:
скоростью работы пользователя;
количеством человеческих ошибок;
субъективной удовлетворенностью;
скоростью обучения навыкам оперирования интерфейсом.
При этом Влад совершенно верно отмечает, что «добиться высоких показателей можно только по любым двум, отбрасывая два оставшихся» (стр. 54).
Мне кажется, что для большинства профессиональных систем, которыми люди пользуются многократно, очень важны первые два показателя (скорость работы пользователя и количество человеческих ошибок) и абсолютно не важны вторые два (субъективная удовлетворенность и скорость обучения оперирования интерфейсом).
Говоря «не важны» я имею ввиду объективные показатели бизнеса, т.е. если процедурная сестра огорчена отсутствием «котят», это лично для нее бесспорно плохо, но для бизнеса абсолютно индифферентно (в отличии от скорости работы, к примеру). Скорость же обучения навыкам оперирования интерфейсом тоже обычно не важна, потому что лично я ни разу не встречал, скажем, продавцов с супермаркете, которые уволились бы потому, что не смогли за 10 минут освоить интерфейс кассового аппарата.
Нужно ли слушать пользователя
Итак, подведем итог и решим, нужно ли слушать пользователя при проектировании интерфейса профессиональных систем.
— Безусловно, нужно!
Да, да, слушать пользователей нужно всегда. Другой вопрос, что совсем не обязательно делать так, как пользователь просит.
А показатели Шнейдермана хорошо использовать при диалоге с заказчиком и обосновании, почему критерий «нам не нравится» для некоторых интерфейсов совсем не важен. Это что-то типа таксистского «вам шашечки или ехать».
В компании Digital Design выпускается ежемесячный электронный журнал для существующих и потенциальных клиентов. В каждом номере — специально подготовленное интервью с одним из экспертов компании. Один из выпусков был посвящен UX, и я дал интервью руководителю пресс-службы компании Ольге Кузнецовой. Это интервью я публикую здесь, в своем блоге.
— Что такое UX и зачем оно нужно?
UX или User Experience не имеет устоявшегося перевода на русский язык, самое близкое — это «проектирование опыта пользователя». Наверное, нет смысла углубляться в терминологические дебри, давайте будем упрощенно считать, что это модное название слова «юзабилити» (уже вижу, летящие в меня камни за такое упрощение).
Гораздо интереснее, зачем оно нам нужно. Поясню на примере авто рынка. На заре автомобилестроения было важно, чтобы автомобиль просто был, потом стало важно, чтобы он был надежным, потом — дешевым. И лишь когда рынок насытился, в добавок к наличию, надежности и дешевизне потребовалось, чтобы автомобиль нравился потребителям. А чтобы нравиться, мало сделать его сверкающе красивым, необходимо чтобы производитель думал об удобстве конечного потребителя с самого первого эскиза.
Тоже произошло и с индустрией программного обеспечения (включая веб). Наличие некого функционала за некую сумму денег уже не является единственным критерием выбора (ключевой момент тут, что этот выбор у потребителя есть). Бизнес все чаще требует, чтобы софт был удобным для конечного пользователя. Кажется, ну какое дело большому боссу до девушки рецепциониста, которая регистрирует посетителей в частной клинике — ну не удобно ей, ну и что с того? Действительно, часто «боссу» до девушки дела нет, а вот если эта девушка на регистрацию клиента потратит не 6 минут, а 4, а эти 2 сэкономленных минуты умножить на 500 филиалов по всей стране и несколько сот тысяч клиентов, то выйдет довольно крупная сумма экономии. Возвращаясь к авто индустрии, таксисты у нас в городи ездят на Фордах и Шевроле, а не на Ладах, не из-за комфорта клиентов, а из-за более выгодного соотношения цены к ресурсу автомобиля.
— Насколько оно развито в России?
В этой области, как и во многих других, наша страна в догоняющих. На западе (особенно в США) есть серьезное обучение в университетах, стабильный спрос, традиции. У нас в какой-то мере уже достаточно давно все это есть (об этом говорит хотя бы тот факт, что конференция UX-Russia проходит уже 10 лет), но при этом последние пару лет ситуация с UX похожа на лихие 90-е в бизнесе. Спрос явно превышает предложение, хорошие специалисты есть, но их недостаточно, а это хорошая почва для фирм-однодневок и чудо-целителей от юзабилити. Думаю в ближайшие два-три года UX-рынок в России устаканится.
— Как должно быть встроено UX-проектирование в производственный процесс?
Я вижу два основных пути внедрения данной компетенции в компанию. Первый путь — это выделенное подразделение, его относительно легко создать, достаточно нанять сильного ведущего специалиста и под него уже нанимать необходимых работников. Такое подразделение может выполнять внутренние заказы и давать достаточно быстрый эффект. Однако такое решение имеет и минусы — оно по определению немного чужеродно для производственных департаментов, кроме того, я видел, как с уходом лидера из компании уходили все юзабилии-специалисты в полном составе.
Мы в Digital Design выбрали второй путь — взращивание собственной UX компетенции в каждом департаменте. Это более сложный путь, но мы верим, для нас он более правильный. Сложный, потому что приходится менять производственный цикл в десятке подразделений, потому что в каждом этом подразделении нужно посадить росток UX, притом такой, чтобы через год он разросся, а не был задушен прочими нуждами. Почему мы считаем такой подход более правильным? Потому что, если руководитель бизнес-линии осознал, что UX ему нужен, полезен для бизнеса, и у него есть устоявшийся процесс и обученные специалисты — у такого подразделения уже нет пути назад, оно уже не сможет жить по-старому, и если вдруг уволится UX-дизайнер, ему быстро найдут замену.
— В каких продуктах и решениях UX необходим в наибольшей степени?
В тех, где есть пользователь. Ну, хорошо, пользователь есть во всех продуктах, скажу по-другому. UX важен в тех продуктах и проектах, где в зависимости от поведения пользователя бизнес может выиграть или проиграть. Иногда нужно, чтобы пользователю в первую очередь «нравилось», иногда, как в примере выше, бизнес выигрывает от скорости его работы в системе, также существует много систем (например, медицинских), где главным критерием является отсутствие ошибок при использовании интерфейса.
— Где взять хорошего специалиста по UX?
Как я уже говорил, спрос превышает предложение. При этом спрос будет расти в ближайшие годы, возможно даже скачкообразно. Кроме того, UX — это очень комплексная дисциплина, тут и аналитика, и психология, и дизайн. Готовых специалистов, покрывающих все эти дисциплины не так много. Поэтому мы предпочитаем их взращивать внутри компании. Для этого мы разработали методику комплексной оценки UX-специалистов, по результатам которой каждому присваевается определенный уровень. Также мы стараемся, чтобы каждый специалист знал ответы на два вопроса — «какая мне выгода от того, если я перейду на следующий профессиональный уровень» и «что мне для этого нужно сделать».
А еще в этом году в рамках нашей «Школы разработчика» мы открыли UX поток. В настоящее время у нас стажируется 12 студентов, с некоторыми из них руководители подразделений уже заключили договоренности о работе.
На днях я читал лекцию по проектированию пользовательского интерфейса (хотя строго говоря это был мастер-класс) в одном из ведущих университетов города — ИТМО. К сожалению, результат меня сильно разочаровал.
В нашей UX-школе занимаются студенты (половина из ИТМО) и они мне очень нравятся, потому что в свободное от учебы время, вместо того, чтобы пить интересную водку, учатся проектировать скучные интерфейсы. Видимо поэтому у меня сложилось чувство, что как-то незаметно от меня выросло новое поколение — прагматичное, трудолюбивое, без советских комплексов и попрошайничества.
Современные университеты представлялись мне сверкающими дворцами, давно пережившими безденежье девяностых, в которые довелось учиться мне.
Какого же было мое удивление, когда я увидел СОВОК. Совок был во всем — в здании, в охране, в аудитории, в столовой и, самое печальное, в студентах.
На мастер-класс люди пришли добровольно, никто их не заставлял. Но они были очень вялыми. Было видно, что они привыкли слушать лекции и тихо дремать. Я же задавал им вопросы, заставлял думать. И это удавалось с большим скрипом.
Возможно они просто устали под вечер и хотели есть. Но я думаю, что дело в том, что в стенах этого университета живет Совок. Живет советская система образования, чванливая своими ложными академическими достижениями и не имеющая никакого отношения к практической работе.
Конечно, я не прав, и многие меня справедливо обвинят в необъективном однобоком взгляде. Но я так увидел ИТМО в этот раз.
Через две недели у меня второй мастер-класс и, если здание вряд ли отремонтируют, то студенты просто обязаны покаяться и стать активными.
И знаете, я всерьез думаю купить им что-нибудь поесть.
Последние годы многие из IT-компаний в России столкнулись с острой нехваткой юзабилити-специалистов. За последние пять лет производители софта в основной своей массе дозрели до мысли, что для успеха на рынке им недостаточно выпустить продукт с некоторым функционалом, а нужно еще, чтобы он был удобным и красивым. Эта тенденция с одной стороны подогревается развитым рынком (нужный потребителю функционал есть у многих, поэтому выбирают уже «сердцем»), а с другой — китайские и индийские разработчики душат демпингом, лишая российских разработчиков софта такого важного преимущество как цена.
И вот, дозрев, многие компании стали искать не просто «дизайнера, который может нарисовать иконки», а серьезных и опытных юзабилити-специалистов. И тут оказывается, что их крайне мало.
Как ты, мил друг, зовешься?
Самое смешное, что толком не понятно, кого искать. Ну, как это человек называется? Юзабилист? UX Designer? А по-русски как, UX-проектировщик? Или, может быть, Interaction Designer — опять не по-нашему... Дизайнер интерфейсов? Хотя нет, это наверное больше по иконкам.
Но если без ясности в названии еще как-то можно обойтись, то без ясности в профессиональных навыках уже нельзя. И тут опять нет единого мнения среди работодателей. Вот некоторые навыки, которые ожидаются от подобных специалистов:
проектирование пользовательского интерфейса;
прототипирование;
юзабилити-исследования;
визуальный дизайн, веб-дизайн;
иконографика;
анализ пользовательских предпочтений, аналитика рынка;
бизнес-аналитика;
общение с заказчиком;
веб-верстка и js-кодинг;
и т.д.
Что из этих навыков важнее, а чем можно пренебречь? Каждый работодатель решает этот вопрос исходя из сложившейся ситуации. Но все равно встает перед мучительным вопросом: нужен скорее «рисовальщик» или «аналитик от UX»?
Так что я получу в итоге?
Дальновидный работодатель/заказчик сразу задается этим вопросом. А недальновидный бывает сильно удивлен, когда вместо ожидаемых им набора нарисованных экранов, получает аналитические отчеты.
— Где нарисованный интерфейс? — спрашивает руководитель проекта.
— Вы понимаете, я UX-специалист, я проектирую пользовательское взаимодействие, анализирую поведенческие реакции, я еще в самом начале процесса, — пытается оправдаться новый сотрудник нанятый два месяца назад на должность «дизайнер».
— Это все прекрасно, но ты работаешь уже два месяца, а я не могу дать разработчикам экраны в разработку.
— Ну вот же, я нарисовал, это называется Wireframes.
— Это не экраны, это черные квадратики и полосочки, я не могу отдать это верстальщику и программисту, — вскипает начальник.
— Детальный дизайн должен прорабатывать другой специалист, а не UX Designer.
— Но ты же дизайнер?
— Да, но понимаете, я занимаюсь несколько другим...
В результате оказывается, что нужно нанимать еще дизайнера, а на него денег уже нет. Вся аналитика и расписные персонажи выкинуты в мусор, потому что дедлайн и кодить нужно.
Так кто же нужен и где его найти?
Я ищу и нанимаю на работу дизайнеров интерфейсов более пяти лет, а последние два года занимаюсь внедрением UX практик в большие IT¬-компании. В результате у меня сформировалось определенное мнение и определенный подход, который состоит из двух принципов:
1) UX-специалист должен быть универсалом. Он должен и проектировать пользовательское взаимодействие, и заниматься аналитикой, и создавать Wireframes, и рисовать чистовой дизайн. Юзабелисты, которые не могут сделать «красиво» не нужны. Тонны аналитики и подробно расписанные пользовательские персонажи мало полезны, если нет итоговых экранов от этого же человека. В идею «один делает логику и wireframes , а другой рисует дизайн» я не верю, обычно выходит полная лажа. UX-специалист, проектирующий интерфейс, не обязан быть супер графиком (проработку графических тем, текстур и модных иконок можно отдать профильным дизайнерам), но он должен уметь делать аккуратно, красиво, чтобы это, при желании, можно было отдать в разработку без привлечения дизайнера.
2) Бери дизайнера и учи. Найти хорошего юзабелиста, да еще и с навыками дизайнера очень сложно. Поэтому мы практикуем найм дизайнеров у которых есть некоторый опыт работы с интерфейсами и большое желание двигаться в этом направлении. Мы учим их, как проектировать интерфейсы, как проводить юзабилити-тестирование. Наш опыт говорит, что научить дизайнера заниматься аналитикой, думать о пользователях, проводить юзабилити-исследования — легко. А вот научить аналитика «рисовать дизайн» — практически невозможно. Бывают исключения, но в основном это правило подтверждается.
Почем универсалы и почему дизайнеры?
Я уверен, что многие коллеги по цеху забросают меня камнями. Уверен, что есть миллион доводов о разделении труда, о том, что нельзя путать UX и графический дизайн, что хорошая аналитика важнее рисования экранов. Доводы это хорошо, но лично я не теоретик, мне нужно в этом году подготовить около 20 UX-специалистов для работы над реальными проектами.
Я хочу привести лишь один довод в защиту моей практики универсальных UX-дизайнеров. Этот довод — незрелый рынок.
У 90% производителей софта (в том числе и веб) пользовательский интерфейс (UI) и пользовательское взаимодействие (UX) настолько плохие, что им не до жиру. Интерфейсный дизайнер средней руки может колоссально улучшить большинство производимых в России интерфейсов. Мы пока не доросли до Америки, где в университетском курсе для юзабелистов половина предметов начинаются со слова «психология». Нам пока рано взращивать узкоспециализированных специалистов.
Нам нужны UX универсалы. Много. Поэтому мы в Digital Design обучаем дизайнеров и поэтому с этого года мы открыли поток по проектированию интерфейсов в нашей Школе разработчика. Сейчас у нас стажируются 13 студентов, но это уже тема отдельной статьи.
По загадочной причине 90% всех вакансий ужасны. То есть сами вакансии хорошие, а вот их описание на сайтах по трудоустройству чудовищны. Такое чувство, что роботы пытаются взять на работу других роботов.
Роботы, роботы пишут вакансии. Бессмысленные и беспощадные: «Требуется копатель. Обязанности: копать. Требование: целеустремленный и стрессоустойчивый». Написали много букв, но бедный копатель так и не понял: предстоит ему копать лопатой или быть оператором экскаватора.
Я не HR-специалист, но я часто ищу работников, в основном дизайнеров и веб-разработчиков. Давайте рассмотрим пример из моей недавней практики — поиск младшего дизайнера интерфейсов.
Как не надо писать вакансию (и как ее пишут в отделе кадров)
UX/UI Designer, Ineraction Designer (з/п не указана)
Наша компания бла-бла-бла, сто лет в обед, крута, динамичноразвивающаямся (абзац-два текста).
Требования: Photoshop, Illustrator, Corel Drow, PowerPoint (и еще много-много). Ответственность, обучаемость, стрессоустойчивость.
Обязанности: работа над современными сайтами, порталами, мобильными приложениями, верстка сайтов, создание маркетинговых и рекламных материалов.
Мы предлагаем: современный офис в центре города, корпоративные мероприятия, трудоустройство с соблюдением трудового кодекса (и еще много текста).
Что здесь не правильно
не понятно, чем именно нужно будет заниматься;
не ясно, какие перспективы;
не понятно, сколько платят и для кого эта вакансия, для начинающих или для опытных;
нет уверенности, что нужно уметь (хотя вроде бы указано, но есть чувство, что писал тот, кто не понимает сути вопроса).
Кстати.
Отдельная песня — вакансии (про)иностранных компаний на английском языке. Такое чувство, что попал на предвыборную программу президента. Две страницы высокопарного текста, а смысла — ноль.
Что же делать
Чтобы написать хорошую вакансию достаточно просто не быть роботом. Напишите простым русским языком:
кто вы такой — да, да, вакансию должен писать не робот не HR-специалист, а будущий начальник. Если из контекста понятно, кто вы (например, вакансия размещена в соц. сети) естественно не нужно представляться;
зачем лично ВАМ нужен работник, и чем ему предстоит заниматься;
укажите только самые необходимые вещи, без которых вообще нет смысла начинать разговор, но не более того;
напишите, какие есть перспективы (это касается и стажеров и директоров);
укажите зарплату или зарплатный коридор, если вы не уверены, какого уровня специалист вам нужен, то обязательно напишите, что зарплата зависит от профессиональных навыков;
не нужно писать про вашу компанию и условия работы в ней, об этом должно быть написано на вашем сайте или в профайле, а если не написано, то нужно написать. При большом желании можно очень коротко написать основные моменты.
Кто есть живой?
Неужели никто не пишет вменяемых вакансий? Пишут многие. К примеру я. Студия Артемия Лебедева пишет. Есть и другие (я встречал, но лень искать ссылки).
Пишут ли HR-специалисты хорошие вакансии? Не знаю, лично я не встречал. Мои попытки вразумить этих милых, умных и опытных людей почему-то заканчивались ничем.
В заключение приведу парочку хороших вакансий (на мой взгляд).
(Моя вакансия для Digital Design)
Младший дизайнер интерфейсов, 20 000 руб.
Привет, дизайнеры молодые и горячие!
Наша компания разрабатывает интернет-порталы и приложения под различные платформы. Нам очень не хватает дизайнеров для работы над интерфейсами. Мы приглашаем молодых специалистов, которые с одной стороны уже что-то умеют, а с другой готовы быстро учиться и осваивать новую для себя область дизайна. Мы же готовы предоставить возможность профессионального и карьерного роста.
Для начала мы хотим посмотреть ваши работы в любой области дизайна. Присылайте ссылку на образцы ваших работ: нас интересуют прежде всего сайты и интерфейсы, но подойдет и все остальное — логотипы, фирменный стиль, полиграфический дизайн, реклама. Если собственных работ у вас пока мало, мы предложим выполнить тестовое задание.
Авторы интересных работ или хорошо выполненных тестовых заданий приглашаются на собеседование. Не забудьте прислать номер вашего мобильного и адрес почты.
Мы предлагаем:
работу над интересными современными проектами;
обучение проектированию и дизайну интерфейсов;
хороший офис рядом с метро Приморская;
белая з/п, ДМС, бесплатные обеды в кафе и чай-кофе в офисе.
Меня зовут Анна Клейменова, и я ищу дизайнера интерфейсов. Нужен здравомыслящий человек, умеющий логически рассуждать, любящий структурные схемы во всех их проявлениях и никогда не выключающий мозг.
Необходимые таланты: быстро, но дотошно разобраться в любой среде или системе, понять как сделать взаимодействие с ней более удобным, затем изобразить и тщательно описать все улучшения. Важно внимание к мелочам и понимание интерфейсных принципов основных операционных систем. Кроме того, развитое чувство прекрасного и умение использовать популярные графические программы для отрисовки интерфейсов. Желательно хорошее знание русского и английского языков.
Если вы считаете, что подходите по всем параметрам, то пришлите мне иллюстрированный рассказ о том, как улучшить интерфейсы самых обыденных вещей. Не забудьте приложить ссылку на свой сайт или примеры работ.
А что думаете вы о вакансиях, с которыми сталкивались? Знаете ли вы примеры хороших вакансий?
В настоящее время существует несколько мобильных и десктопных платформ, у пользователей каждой платформы — свои привычки. UX-проектировщик обязан прочувствовать все эти системы на собственной шкуре.
Не так давно мы с моим двухлетним сыном посетили Ленинградский зоопарк. Большинство зверей сын прекрасно знал по фотографиям и рисункам, и, естественно, он хорошо представлял себе жирафа. Однако, увидев жирафа (довольно таки издалека), ребенок испугался и начал плакать. Оказалось, что жираф БОЛЬШОЙ. Мой сын знал, как он выглядит, знал что он милый и красивый, но он не ожидал, что он такой большой — книги не дали ему всей полноты картины, ее смог дать только личный опыт.
Также специалист, который проектирует пользовательские интерфейсы, не может получить всей необходимой информации о них, читая гайдлайны, книги и отзывы. Также не получит он необходимого опыта и просматривая многочисленные видео обзоры и скринкасты. Все эти инструменты нужны и полезны, но личного пользовательского опыта не заменит ничто.
Дай телефончик подержать
Ок, скажете вы, нужно просто попросить у коллеги его новый смартфон, потыкать в него полчаса и этого хватит, чтобы составить впечатление о платформе. Что тут сказать... пожалуй, чтобы понять масштаб «жирафа» этого достаточно, а вот, чтобы подружиться с ним — нет.
Юзабилист, помни, ты — ты не посетитель зоопарка, ты работаешь в нем смотрителем!
Если вы хотите проектировать интерфейсы под iOS, Android, Phone7, Win, Mac, Linux (нужно подчеркнуть), вам просто необходимо попользоваться данным устройством «для личных целей» как минимум 1–2 недели. Этот совет я получил от коллег проектировщиков, последовал ему и не раз убеждался в его ценности.
Люди мы небогатые
«Но где мне взять все эти дорогие девайсы», — вскричит читатель, — «я беден, денег едва хватает на поездку в Египет на новогодние каникулы». Думаю универсального совета тут не существует.
Когда мы учились делать приложения для iOS и Android, я настоял, чтобы закупили по паре устройств каждой платформы, аргументируя это тем, что все равно для тестирования они понадобятся через пару месяцев.
