Михаил Елфимов об интерфейсах

Немного поработал на одного производителя онлайн игр. Вроде им понравилось. Хочу поработать еще на кого-нибудь. Проектирование интерфейсов, критика интерфейсов. Фриланс.

Я сижу на Mac OS X, и если надо иметь дело с приложением под Windows, то с вас компьютер в офисе на время работы с приложением.

Вот такие вещи меня просто пугают:

Это с сайта mobile-review.com. По маленькой кнопке «Bookmark» (да, сайт на русском, кнопка на английском) возникает огромное новое окно (про них еще Купер в About Face писал), в котором перечислено 36 (тридцать шесть) сервисов. Это окно предоставлено сайтом AddThis.com.

Я вот чего не понимаю. Ведь этими кнопками никто не пользуется. Те, кто используют какой-либо закладочный сервис, типа del.icio.us или Google Bookmarks — они вешают себе на панель браузера специальный скрипт.

Справедливости ради надо сказать, что внизу окна есть чекбокс — AddThis.com запоминает каким сервисом из перечисленных вы воспользовались, и при следующем нажатии на кнопку «Bookmark» открывает сразу, например, добавление ссылки на Google Bookmarks. Выглядит это вот так:

Есть такая штука, как «быстрые комментарии». Это буквально однострочные ответы на запись в блоге или микроблоге (twitter), очень компактно отображающиеся на экране. Например:

Подскажите, на каких еще сайтах такое используется? Какие есть варианты визуального представления?
На самом деле, больше интересны примеры как нарисовать «дайджест» комментариев — 5-10 цитат из комментариев, кликнув на которые можно перейти на страницу с полным представлением.

Напрягите мозг :-) Вспомните, пожалуйста, где такое вообще используется?

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

Журналисты меряют время в долях часов. Например, телефон работает в режиме MP3-плеера 8.3 часов. 8.3 — сколько это? Какие могут быть десятичные доли часа, если час состоит из минут?

Время работы телефона в режиме ожидания — 280 часов. Сколько это вообще? Зачем мне эта цифра, о чем она мне говорит? Почему нельзя написать 2-3 дня, ведь никому абсолютно не нужны результаты лабораторных изменений с точностью до часа. Мне интересно сколько дней этот телефон проживет при средней нагрузке.

Разрешение экрана 160×128. Сколько это вообще? Вроде это меньше, чем 1024×768. Да наверняка меньше. О, я помню у меня давным-давно был ноутбук с CGA-экраном 320×200. Нет, опять не то.

Скорость передачи данных 300 Кб/с. Кб/с. Почему не КМ/Ч? Что означает Кб — Кбайт, Кбит? Что, жалко потратить лишние 2-3 символа?

Так, телефон стоит около 210 евро или 370-400 долларов. Гм. Я уже года два как перестал понимать цены в долларах. И евро я каждый день не пользуюсь. Полтора года назад мы купили телефон за 3500 рублей. А, недавно я продал смартфон за 4700 рублей. Сколько это в долларах? Зачем мне это знать?

Журналист пишет статью для нормальных человеческих людей, почему он при этом думает жопой?

Рассказал о проектировании пользовательских интерфейсов в Digital Zone. На пару часов. Вроде неполохо получилось. Учитывая, конечно, тот момент что научить проектировать интерфейсы на семинаре невозможно. Как и нельзя научиться проектировать интерфейсы, читая книги.

Краткое содержание

Зачем в команде проектировщик интерфейсов. Плюсы, минусы.

Этапы процесса проектирования. Сбор данных. Концептуальное проектирование. Прототипирование. Тестирование прототипов. Внедрение.

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

Концептуальное проектирование. Диаграммы задач, workflow. Карта сайта. Информационная архитектура.

Прототипирование. Выбор детализации прототипа, среды, инструмента.

Детальное прототипирование. Тафти: data-inc ratio, соотношение полезных и вредных пикселей. Честность данных. Инфографика. Обоснование каждого интерфейсного решения. «Почему так». Единообразие решений, влияние контекста. Явная взаимосвязь между действием и ответной реакцией интерфейса. Использование стандартных элементов интерфейса. Паттерны проектирования. Обучение на примерах: Amazon, Google; критический подход к использованию чужих решений.

Внедрение. Спецификация интерфейса. Проверка реализации на соответствие прототипу.

Книги

Effective Prototyping for Software Makers, Jonathan Arnowitz
Information Dashboard Design: The Effective Visual Communication of Data, Stephen Few
Designing Interfaces: Patterns for Effective Interaction Design, Jenifer Tidwell

Что-то, конечно, мог не успеть или забыть. Участники, напишите, пожалуйста, как оно вам.

(Отзывы можно прочитать также в Livejournal)

Наткнулся на плагин для Firefox, называется FireShot. addons.mozilla.org/en-US/firefox/addon/5648

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

Написано что бета-версия. Я к сожалению не попробовал сам — в Mac OS X не работает (и как они так умудрились сделать).
* * *
Кстати, я понял, почему ru_ucdesign забит исключительно вакансиями и анонсами семинаров. Мой пост про FireShot urbansheep удалил, потому что, видите ли, FireShot упоминался месяцем раньше, в комментариях. Это очень напоминает историю с СУПом и отменой базовых аккаунтов. Обе истории о том, что в одних людях нет уважения к тому, что делают другие люди.

Заодно удалили пост igrok2 о визуальном поисковике searchme.com. Между прочим, интересный пост.

О заголовках постов @elfimov.com/everything

Судя по всему, существует два подхода к заголовкам записей в блоге: подход Livejournal и подход RSS.

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

Фактически, заголовки постов используются только в архиве записей за определенный месяц и в некоторых темах оформления выводится summary постов на странице. Даже сервис blogs.yandex.ru спроектирован так, чтобы избегать заголовков — в топ записей выводятся цитаты из текста, а не заголовки.

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

RSS-сервисы, вроде Яндекс.Ленты или Google Reader, спроектированы думающими людьми. Поэтому посты отображаются так, как это принято в популярных блогохостингах — заголовок, потом полностью раскрытый текст (если он отдается RSS-источником). Тут заголовки — приятное дополнение.

Таким образом, писать или не писать заголовки — исключительно вопрос выбора аудитории. Если ваш блог находится в Livejournal или копируется туда автоматически — заголовки необязательны. Если у вас отдельностоящий блог, и аудитория пользуется традиционными RSS-читалками — заголовкам надо уделять серьезное внимание.

Влияние цвета на отдачу с рекламы @Электронная коммерция, habr

Как и предыдущие ссылки, эта имеет ценность в том, что основана на реальном опыте, а не измышлениях или чтении Якоба Нильсена, Артемия Лебедева, и т.д.

8) По возможности, текст для сайта должен исключать личные обращения к клиенту. Это не любят. Текст не должен мотивировать клиента низкой ценой. Описывайте достоинства товара.
Пример: Т.е. не “уважаемые господа, предлагаем вам дешево приобрести”, а “оригинальные композиции, редкие сорта роз будут радовать и доставлять удовольствие”. Это очень интересный момент, основанный на 3 недельном тестировании магазина в двух режимах: с текстом-обращением и нейтральным. Нейтральный текст принес на 25% больше прибыли.

Организация продвижения товара @Электронная коммерция, habr

Личное наблюдение: слишком быстрая реакция на заказ пугает клиента. К примеру, из 30 звонков, произведенных мной в течение 10 минут после оформления заказа клиентом, лишь 10 полностью (т.е. без удаления нескольких позиций или полного отказа) подтвердили заказ. Оптимальное время для связи с клиентом — 15-30 минут. (25 человек полностью подтверждали). Но, чтобы избежать шаманства, отмечу: это моя практика, почему это так, я могу только предполагать.

Продвижение товаров интернет-магазина @Электронная коммерция, habr

Apple's design process @businessweek.com

— Pixel Perfect Mockups
— 10 to 3 to 1
— Paired Design Meetings
— Pony Meeting

Последний пункт особенно хорош, ниже перевод.
Это возвращает нас к истории, рассказанной ранее (Michael) Lopp, в которой он рассказывал как главные менеджеры описывают что они хотят от каждого приложения: «Я хочу WYSIWYG… Я хочу чтобы оно поддерживало осноные браузеры… Я хочу чтобы оно отражало дух нашей компании». Или, как переводит Lopp, «Я хочу пони!». Он добавляет «А кто не хочет? Пони — это прекрасно». Проблема, по его словам, заключается в том, что эти люди описывают то что они думаю что хотят. И даже если это чушь, их мнение нельзя игнорировать — они платят деньги!