Сегодня утром Сафари решил, что с меня хватит — начал тормозить на ровном месте. Я открыл Google Chrome и решил сделать его стандартным браузером во всей Mac OS X. Привычным путем я выбрал в меню Chrome › Preferences… и с удивлением не обнаружил реакции в виде нового окошка на свои действия. Я повторил вызов окна настроек, но опять не получил его. Оказывается, в окне браузера открылась новая закладка с настройками.

Гугл в который раз наплевал на удобство интерфейса. Всякий раз они делают с таким упорством и точностью, что у меня уже создается впечатление, что у них есть специальный отдел ужасного UX. Специально для таких безруких и безголовых ребят, как те, кто отвечает за интерфейсы в Гугле, в Купертино создали специальный набор правил и рекомендаций по созданию окошек, формочек и всего остального, что касается интерфейса. Благодаря продуманности этих рекомендаций и их относительной унификации, пользователи Mac OS X и получают такое удовольствие от работы с этой операционной системы. Даже Опера, которая достаточно вольно обращалась с интерфейсом одноименного браузера, не убрала окно настроек и не сделала его крайне неудобным ;)

Настройки

Вот так выглядит окно основных настроек в Сафари (похоже выглядит почти в любом приложении для Mac OS X):

Основные настройки браузера Chrome выглядят так:

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

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

в Хроме почти все настройки спрятаны под ничего не говорящим заголовком «Under the Hood» и представляют из себя перемешанное что попало.

Внешний вид

По сравнению с небольшой закладкой и всплывающим системным окошком в Сафари (шрифты в примерах меняются в зависимости от выбора в окошке)

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

Поиск

Гугл считает себя очень крутым поисковым сервисом и он заслужил это звание. В Хроме на поиск завязана даже неудобнейшая версия истории посещения страниц, которую я встречал. Увидев в закладке настроек поле поиска, я подумал, что это добавит хоть немного меда в ту бочку дегтя, которая уже есть. Я решил не концентрироваться на том, что если в настройках приложения необходим поиск, значит это Microsoft Word или просто беда с настройками. Ложку меда я так и не получил. При том, что в Mac OS X реализован замечательный и удобный механизм поиска по настройкам…

… Гугл пошел своим загадочным и непонятным путем:

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

***

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

Скриншот фрагмента сайта google.com с практически незаметным, но существующим отличием фона под видео

В честь дня рождения Джона Ленона (и за день до него) на google.com появился замечательный анимированный логотип, посвященный этому событию. Для того, чтобы им полюбоваться, небходимо зайти на google.com и кликнуть на логотип, на который вы никогда в жизни не нажимали и даже не знали, что он является ссылкой — на логотип Google. Но Гугл такой Гугл — ни один продукт не может быть сделан нормально до конца. Даже здесь цвета фона видео и страницы отличаются. Пора бы уже уделять больше внимания деталям, все-таки не стартап какой-то.

Всем тем, кто считает, что проблемы создает YouTube, хочу напомнить, что он принадлежит все той же компании Google. А если владелец сервиса не может справиться с искажениями видео, то что уж говорить об обычных пользователях?

Самый свежий факт о Чаке Норрисе: это он откусил кусок от логотипа Apple. Нет, это не шутка, он действительно это сделал. Если вкратце, то Чак обиделся, что его стрелялка в App Store плохо продается и обвинил в этом, кого бы вы думали, юзабилити магазина приложений. Чак терроризировал Apple тем, что уйдет со своей программой на платформу Андроид (почему-то для кого-то это имеет значение) и отвергал предлагаемые Apple варианты дизайна. Как обычно, пришлось браться за дело самому. В результате оказалась, что Чак Норрис куда круче справляется со счетом до бесконечности и путешествиями на Марс, чем с UX консультациями.

Что не так

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

Так выглядела страница приложения в App Store до вмешательства Чака (изображение я нашел в Google Images)

Так выглядит страница приложения сейчас, после того, как Чак применил болевые приемы к юзабилити

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

В App Store это не учли. Вот несколько примеров:

—

Кто-то может определить какая из этих полосок показывается состояние загрузки, а какая — полоса прокрутки? Они выглядят одинаково! При этом обе похожи на индикатор состояния

Ок, вот подсказка:

И все равно не очевидно

Я сначала подумал, что блок с приложениями загружается, пока случайно не кликнул туда и не увидел, что это, оказывается, полоса прокрутки. Даже у Гугла получилось не так плохо с их ужасными полосами прокрутки в Google Wave.

—

Вот задача посложнее: укажите все ссылки в текстовом блоке ниже.

Кроме синего текста (это очевидно) ссылками также являются «Report a Concern ›» и «Yes | No». Остальной черный текст, оформленный так же, не ссылка. Не спрашивайте почему

Кстати, синим цветом также отмечены заголовки, которые не являются ссылками.

—

«Хлебные крошки» тоже подверглись изменениям.

Вверху страницы они больше похожи на ссылки на сайты (подсвечены после краткого описания приложения), а не на «хлебные крошки», которые использует Apple по всему сайту и раньше использовала в App Store

В то же время «хлебные крошки» внизу страницы не изменились

—

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

Если приложение бесплатно, то нет ни слова «Buy», ни слова «Download», на кнопке просто констатация факта

—

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

Эффект мокрого пола менее агрессивный и затрудняющий чтение при оценке приложения

Неужели все плохо?

Нет. Общая гамма стала светлее, что, наверняка, облегчит кому-то чтение (если были трудности с этим ;). Тем не менее, это изменение сделало iTunes Store скорее похожим на сайт, открытый внутри iTunes, чем на его часть, которым он выглядел раньше.

Факт

Чак Норрис очень плох в роли UX эксперта, а Apple испортила интерфейс по непонятным причинам.

Украинский парламент решил ввести цензуру в интернете. За законопроект, принятый в первом чтении, проголосовало 404 человек (у реальности отличное чувство юмора ;) Вкратце: закон, прикрываясь борьбой с детской порнографией, обязывает провайдеров записывать всю активность своих пользователей в сети. Эти записи в дальнейшем могут быть использованы для выяснения, занимался ли пользователем чем-то нелегальным. Что считать нелегальным решили определить как-нибудь потом. Таким образом, правительство создает государство, где каждый должен жить в страхе — на всякий случай. Я описал это в своем livejournal’е и вместе с Бо (ее пост с детальными объяснениями) мы стали одними из инциаторов того, что уже выливается в протесты в интернете и СМИ.

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

Отлично сказано: больше разговоров об инвайтах, чем о самой Google Wave. Я помогу Гуглу и поговорю о Google Wave. Сразу хочу выразить грусть по поводу того, что инвайтов у меня нет и, скорее всего, не было — узнать это каким-либо законным путем вряд ли возможно, потому что об инвайтах даже в разделе «Помощь» ничего не найти. О, Гугл, ты такой… такой… ррррр! Лишь потому, что пока действует система приглашений, не каждый может насладиться общением с этим, будем откровенными, гипотетически клевым, но практически бесполезным сервисом. Я опишу, как Гугл приложил все усилия, чтобы воплотить свою уникальную философию ужасного UX в еще одном интерфейсе. Не бойтесь, я кратко — расскажу лишь о трех самых вопиющих неудачах новинках в интерфейсе ;)

Google Wave собственной персоной

Полосы прокрутки

Эти мне не понравились больше всего. Такие блестящие штуковины, которые иногда позволяют прокручивать по всей высоте блока, а иногда лишь в его части. Поначалу я решил, что Гугл решил реализовать полосы прокрутки как на DesignCharts, но быстро понял, что ошибался. Полосы прокрутки на DesignCharts куда удобнее, чем разработанные для GoogleWave. Вообще-то, самой полосы нет, есть лишь бегунок. Нельзя кликнуть на фон и прокрутить на страницу вверх или вниз. Можно либо тягать сам бегунок, либо нажимать на нем стрелочки — в этих случаях какая-то темная штуковина на фоне будет двигаться в указанном направлении. Содержимое блока тоже прокручивается, но это не выглядит чем-то похожим на причину и следствие во время работы с полосой прокрутки. Конечно, мы привыкнем и к этому, пользуемся же мы Паверпоинтом, но почему бы не сделать удобно сразу, а не переучивать нас? UX! UX!

Если у вашей мышки есть колесо прокрутки, то вы сможете пользоваться им, что сделает работу намного удобнее. У меня Ваком и Mighty Mouse, так что мне пришлось смириться с работой с полосами прокрутки.

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

Работа с панелями

В то время как все двигаются вперед и знают, что модальные интерфейсы отжили свое, Гугл прокладывает собственную дорожку в стремлении создании чего-то неудобного. Мне кажется, что кнопки в заголовках панелей — предвестники интерфейса Google OS. И образцом для подражания, похоже, выбрана Windows XP. Добро пожаловать в будущее интерфейсов.

Итак, у нас есть три кнопки: свернуть вверх, развернуть и закрыть. Что они делают? Первая «сворачивает» окошко вверх к логотипу Google Wave — очень не очевидно (ожидаешь, что она просто свернет его в заголовок и оставит на том же месте) и, я уверен, большинство пользователей в первые разы ищут потерянные панели по всему экрану. Кнопка закрытия закрывает панель — ничего необычного. А вот кнопка развернуть устраивает ужасное «заполнить все 23″ этим контентом». Мне повезло — окно броузера не распахнуто на всю возможную ширину и высоту, так что «разворачивание» удалось локализовать.

Механизм закрытия окон отличается от случая к случаю — либо есть возможность нажать на × или кликнуть за пределами окна, либо × нет и остается только клик.

Итог: если это прототип интерфейса Google OS, то создателям не помешало бы поискать ролевую модель лучше, чем копирование недочетов Windows XP.

Семантика

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

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

Итог: достаточно сравнить две одинаковые панели с кнопками, чтобы увидеть, что кнопки на них выглядят по-разному. Не так уж и целостно, не правда ли? ;)

Фанатам и фанаткам Гугла

Привет! Спасибо за то, что прочли. Я знаю, что Google Wave еще в стадии предпросмотра (создание бет и никаких релизов в течении тысячелетий — их стиль жизни) и я знаю, что все будет намного лучше. Я не очень-то люблю Гугл, но обожаю Gmail (который, вообще-то, считает, что все мои письма — спам) и ожидал Волн не меньше вас. Этот пост написан для того, чтобы помочь Гуглу сделать интерфейс получше. С Оперой почти получилось ;)

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

Мой день

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

Допустим, к восьми часам утра я уже нарисовал какой-то макет, придумал схему организации сложнейшей системы фильтров и довольный собой отправил всем, кто об этом мечтал. Спокойно попивая чай и слушая «Rudebox» Robbie Williams’а, я дружелюбно жду комментарии и готов закончить реализацию всего, что предстоит реализовать. К десяти часам приходят комментарии, которые, разумеется, не имеют ничего общего со здравым смыслом и портят настроение невероятно. В 11 часов утра мне уже ничего не хочется, я зол и ненавижу весь мир. До свидания, воюйте со своими дедлайнами без меня!

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

Нормальный день

Если бы я встал как все нормальные люди в 10 утра, то лишь к двум-трем завершил бы часть работ. В 16-17 часов мне испортили бы настроение. Тогда можно было бы с чистой совестью идти гулять, общаться с друзьями или просто почитать хорошую книгу — день уже подходит к завершению и все отлично. Мало того, все считают, что ты работаешь на износ и очень стараешься сделать все побыстрее.

Придется мне научиться спать дольше ;)

Пару минут назад я закончил читать одну из шуток вида «техническая поддержка против клиента». Я никогда не считал их смешными, но эта уж точно не смешна. За последнюю неделю я много обсуждал модальные окна и даже вступил в сражения насчет других аспектов создания GUI с юзабилити наци. Якоб Нильсен назвал 10 удобных нововведений в интерфейсах, появившихся в 2008-м году (насчет многих можно поспорить). И не смотря на все это стремление к простоте, я по-прежнему не вижу то, что я печатаю в поле ввода пароля.

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

Клавиатура для безопасного ввода паролей — какую бы клавишу с символом не нажал пользователь, он печатает •

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

Вот так в айфоне удовлетворяют скрытую страсть к паранойе

В таком случае, пользователь хотя бы видит, что «а» превратилось в «•» и понимает этот процесс. Если же кто-то предательски выскочит из-за его спины с целью подсмотреть супер-секретный пароль, то увидит лишь точки и, возможно, последний символ пароля. Отлично, у нас есть способ помочь параноикам вводить пароли, но почему же не дать возможность отключать точечки и астериски тем, что не живет в мире, где все хотят подсмотреть его пароли? Я хочу вводить поля ввода, а не «секретные» символы.

В Mac OS X в поле ввода пароля на всякий случай появляется иконка, если пользователь нажал Caps Lock

Я уверен, что дай мы, разработчики интерфейсов, пользователям возможность видеть то, что они набирают на клавиатуре, как сразу же будет решено много проблем юзабилити, связанных с введением паролей. Например, очень часто пользователи не замечают, что у них включен Caps Lock и набирают свои пароли не том регистре, который нужен. Любой человек заметит что он вводит ЗАГЛАВНЫЕ БУКВЫ, если мы ему их покажем. Даже красивая иконка не понадобится.

Если это можно сделать при вводе пароля wifi, то почему нельзя на уровне операционной системы?

Признаюсь честно, я бы лучше вообще не вводил ни одного пароля для того, чтобы добраться до моего аккаунта на last.fm или просмотреть статистику посещений. Я не умру, если кто-то ознакомится со списком моих друзей на last.fm или увидит, сколько тысяч подписалось на мой RSS. Но это уже другая тема для обсуждения, включающая в себя также это мерзкое «ваш пароль слишком легко взломать, выберите другой». Мне, например, нравится мой пароль «аааааа» для не важных для меня сайтов. Он напоминает мне о пении и счастье.

Пароли и работа с ними — чуть ли не наиболее неудобные элементы современных интерфейсов, разве нет?

***

Похоже, что Якобу Нильсену понадобилась пара месяцев на то, чтобы посмотреть, кто на него ссылается, прочесть этот пост и согласиться со мной. Обратная ссылка была бы крайне приятна ;)

Watchmen — полный и абсолютный провал.

Надо быть гением, чтобы снять фильм, по сравнению с которым Австралия и Загадочное дело Бенджамина Баттона выглядят не только увлекательными, но и полными событий! Вот еще одна деталь, чтобы подчеркнуть бездарность экранизации комикса Watchmen: в фильме нет финальной и самой узнаваемой в комиксе фразы «I did it!». Я разочарован.

Или c1rca уволили всех телепатов, или наши продавцы обуви сошли с ума, но результат на полках: нет ни одной пары кроссовок моей любимой модели c1rca cx101. Я остался без обуви на следующий год. Отчаявшись даже подумываю о покупке DC, ethnics или даже Vans, но пока храню верность самым красивым кроссовкам в мире.