Архив | Май, 2010

Прекратите спрашивать с меня подтверждение

26 Май

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

У пользователя G_Z решил написать про то, что у него наболело.

Подтверждение пароля

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

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

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

Тут нужно чуть свернуть с темы пароля и коснуться дублирования на примере e-mail.
Давно ли вы вводили последний раз основной e-mail руками?
Если разработчик формы не стал мудрствовать лукаво и дал полю формы «стандартное» имя «email» — адрес наверняка подскажет браузер.
Даже если ввели руками, вводите ли второй раз руками?
Повышается ли внимательность ввода при дубле? Наоборот: вводишь и материшь разработчика, его родственников и канарейку.
Думаешь: «ладно, вобью быстро руками» и тут же опечатываешься, вводя второй раз. Знакомо?
Потрачено время, нервы, толку — ноль.

Что пишет тебе форма «повышенной юзабильности» когда значения дублированных полей не совпали?
Правильно — «не совпадает».
Удивила, блин. Помогла.
Вот теперь сиди, ищи где и чего ты не так вбил. Где правильное значение? Где опечатка?
Нашёл? Вбивай по-новой, или копируй правильный вариант.
В e-mail ещё можно разглядеть ошибку, а пароль они скрыли, заботясь обо мне — вбивай оба снова, авось рука не дрогнет.

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

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

Придумать в такой ситуации сложный пароль нереально. Вернее, придумать — реально более чем, повторить и запомнить нереально.
Что вынуждает либо вводить давно придуманный и используемый пароль, либо придумывать его в ином месте — например, текстовом редакторе — и копировать в поле.
Ну, либо пользоваться менеджером паролей и копировать оттуда, в два места.
Разработчики формы проверяют моё умение копировать текст в поля?

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

Хорошо, может таким образом повышается внимательность при вводе пароля?
Ну да, когда ты вводишь его с третьего раза — поневоле будешь внимателен и пару раз сотрёшь наполовину введённое, чтобы не увидеть снова гадкую надпись про несовпадение полей.
А для чего внимательность? Чёрт подери, это всего лишь пароль! Моё имя и список увлечений важнее!

Ни одна из предполагаемых выгод не оправдалась.
Фарс.
«Как у всех». ©

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

Много ли нужно, чтобы кардинально изменить ситуацию?
Нет:
1. убрать дублирование поля;
2. дать возможность увидеть введённое значение.

Всё! Никаких нервов, сложные пароли, довольные процедурой регистрации пользователи.
Это же очень просто, даже работы становится чуть меньше — не нужно сверять два значения.

Товарищи, думайте о пользователях. Тестируйте формы на данных, отличных от «111» и «222», вам же самим потом подобным пользоваться.

Какую лучшую в плане юзабилити свободную (OpenSource) CRM вы знаете?

25 Май

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

Как показывает график — SugarCRM занимает первое место по удобству. Ну и пару скриншотов этой системы нам конечно не помешают:

Тренды веб-дизайна в 2010 году

25 Май

Говорят, что великие работы неподвластны времени. Да, в идеальном мире мы могли бы не обращать внимание на сиюминутные веяния моды.

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

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

Ясно, что в 2010 году дизайнеры продолжают сдвигать границы возможного в веб-дизайне, развивая собранные мной тенденции.

Полиграфический дизайн

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

Шрифты с засечками

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

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

Читать далее

Новые шаблоны для форм в Google Docs

24 Май

Google добавил 24 новые темы оформления форм в Google Docs. При создании тем использован Google Font API.

3D-жестикуляция. Интерфейсы будущего

24 Май

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

В поисках недорогих и надежных способов отслеживания жестов сотрудники лаборатории информатики и искусственного интеллекта Массачусетского технологического университета Роберт Ван и Йован Попович задались вопросом – почему бы покрасить в разные цвета руки (а еще лучше перчатки) работающего за компьютером? И сделать это таким образом, чтобы компьютер мог различать как разные части руки, так и отличать руку от остальных предметов. Перчатка разделена на двадцать участков, которые покрашены в десять разных цветов. «Следит» за перемещением цветовых пятен в пространстве обычная вебкамера

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

via engadget.com

Не прячьте выбор языка в выпадающие меню!

23 Май

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

Несколько примеров избавят от упрёков в голословности.

Last.fm
image

Mozilla
image

Twitter
image
Эти ребята на главной странице спрятали всё самое важное: и форму входа, и популярные темы, и собственно выбор языка.

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

via

Обзор свежих материалов, апрель 2010

22 Май

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

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

Обзор свежих материалов, апрель 2010

Методы и практики

Faceted Finding with Super-Powered Breadcrumb

Greg Nudelman предлагает интересный подход к построению навигации в интернет-магазинах и интернет-каталогах. Он показывает несколько примеров доработанных «хлебных крошек», которые позволяют гибко фильтровать список товаров и результатов поиска.

Controlling Privacy on Social Networking Services

Matthew C. Clarke описывает проблемы современных социальных сервисов с приватными данными пользователями — в первую очередь то, как сложно управлять их настройками. А также предлагает несколько решений проблемы.

UXmatters Q&A — Putting a Paper Form Online / Avoiding Dropouts and False Information / Applying Aesthetics

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

Designing with Lenses

Методика использования «линз» в проектировании и дизайне от Билла Скотта из MeeBo. Способ позволяет посмотреть на интерфейс под разными углами, сопоставив его по одной из «линз» (например, точный или схематичный показ лиц). Коллекция паттернов «линз» доступна на сайте проекта.

Designing for iPad — Reality Check

Компания Information Architects рассказывает о процессе проектирования и дизайна для iPad. Команда успела собрать неплохой опыт работы в этом направлении и дает оценку адекватности официального руководства по интерфейсу.

Eye Tracking — Best Way to Test Rich App Usability

Обзор методики тестирования с помощью eye-tracking, ее особенностей и ограничений от James Breeze. Он рассказывает о возможных способах проведения eye-tracking-тестирования и эффекте каждого из них.

Инструменты

Mobile Chart Options

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

Google Drawings Wireframe Stencil

Набор wireframe-стенсилов для онлайн-инструмента проектирования Google Drawings. Хотя он изначально и не был предназначен для работы над интерфейсами и сильно уступает специализированным инструментам, его возможности совместной работы выглядят интересно.

Putting Together Simple Wireframes Using OmniGraffle

Краткое и емкое руководство от компании CX Partners по проектированию с помощью OmniGraffle. 3-страничный PDF-документ предлагает пошаговое руководство по созданию wireframes.

Паттерны

Touch Gesture Reference Guide

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

iPad UX Interactions

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

Design Patterns for Mobile Faceted Search

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

Maps in Modern Web Design — Showcase and Examples

Обзор примеров реализации карт в вебе и набор советов по их правильному использованию. Автор статьи Zach Dunn рассказывает о способах использования карт и дает примеры для каждого из них.

Процесс

Sustainable UX (презентация Nick Finck)

Презентация Nick Finck с конференции UX Web Summit о процессе проектирования. Хотя тема раскрывалась уже сотни раз, это один из лучших материалов по теме с хорошими иллюстрациями и удачной структурой.

Planning Your UX Strategy

Renato Feijo пишет о том, как постепенно интегрировать процесс проектирования в общую работу компании. Он рассматривает 6 степеней взаимодействия — от полного безразличия и первичного интереса к теме до активного вовлечения специалистов и их полной интеграции.

Managing User Experience Teams

Блог Margaret Gould Stewart и Graham Jenkin из Google, рассказывающий об управлении интерфейсными проектами в компании. Хотя многие материалы описывают общие для проджект-менеджмента вещи, в них упоминается много интерфейсной специфики.

Using a Collaborative Parallel Design Process

Описание процесса совместного дизайна и практики его применения от Mike Myles. Он рассказывает, как группа специалистов по интерфейсам, их коллег из других отделов и пользователей могут совместно прорабатывать интерфейс.

Кейсы

The FedEx Journey

Tom Wicinski и Brice Stokes из FedEx рассказывают о том, как построен процесс работы над интерфейсами в компании. А также том, как он выходит за рамки компьютеров в более общую сторону customer experience.

The Evolution of a GUI and the Pulsating Life of a UX

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

Case Study of Agile and UCD Working Together

История редизайна крупного информационного сайта Computer Weekly. Хотя agile тут упомянут скорее как модное слово (описания взаимодействия команд почти нет), в статье приведен полезный график проекта.

Теория

Navimation — Exploring Time, Space & Motion in the Design of Screen Based Interfaces

Jon Olav H. Eikenes и Andrew Morrison предлагают новый термин «навимация» для современных интерфейсов. Они активно используют анимацию для того чтобы показать переходы между экранами, объектами и состояниями системы.

Eight Principles of Information Architecture (презентация Dan Brown)

Хорошая обзорная презентация Dan Brown о ключевых принципах информационной архитектуры — внимание к контенту, большой выбор усложняет выбор, постепенное раскрытие информации, множественные точки входа и способы классификации и т.д.

История

Into the Groove — Lessons from the Desktop Music Revolution

Dave Cronin из Cooper Consulting описывает историю развития интерфейсов специализированных программ для музыкантов — от аналоговых и простейших цифровых устройств до сложных компьютерных программ и необычных инструментов.

Bob and Beyond — A Microsoft Insider Remembers

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

History of the Button (презентация Bill De Rouchey)

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

Тренды

Natural User Interfaces are Not Natural

Дон Норман размышляет о тренде «естественных» интерфейсов и приводит несколько причин о том, почему они не совсем естественные.

Игровые механизмы и элементы в интерфейсах

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

Свежие ссылки можно также отслеживать по мере появления во Friendfeed-ленте User Experience.