Tag Archives: пользовательские интерфейсы

Конференция User Experience Russia 2010 в Москве

30 Авг

Конференция User Experience Russia 2010

7-8 октября в Москве состоится самое грандиозное в России событие в области юзабилити –User Experience Russia 2010, которая пройдет в этом году в четвертый раз и будет посвящена вопросам юзабилити, проектированию и взаимодействию с пользователем услуг в интернете.

В этом году конференция пройдет при поддержке европейской ассоциации юзабилистов UPA Europe.

Одним из ключевых докладчиков этого года – Эрик Райс, гуру юзабилити. Он является одним из самых влиятельных фигур в области проектирования и информационной архитектуры. Его выступления вдохновляют многих и многих UX–специалистов, а признанные эксперты отмечают его яркие и уникальные доклады. Действительно, работы Эрика Райса являются поистине неоценимым вкладом в мировое развитие юзабилити. На конференции этого года Эрик Райс выступит с докладом “Killer content or content that kills”, а также проведет мастер-класс “Writing for the Web”.

Сильвия Циммерман выступит с докладом: «Проектирование взамодействия для телекоммуникационных сайтов». Сильвия — основатель UPA Швейцария, отвечает за швейцарский Институт эргономики программного обеспечения и юзабилити в Цюрихе, вице-президент UPA с 2008 года. Она является также соорганизатором европейской конференции UPA в области юзабилити и дизайна. Сильвия выступит с докладом: Проектирование взамодействия для телекоммуникационных сайтов»

«Добро пожаловать в Будущее UX!» — тема выступания Ронни Баттиста, который является директором сертификации Usability Professionals Association — International, главой UPA NY, исполнительным директором MISI Company.

Андрей Себрант (Яндекс) расскажет о «Churn rate крупным планом или как утекают пользователи». Андрей Себрант — директор по маркетингу сервисов Яндекса. Занимается вопросами маркетинговой стратегии и тактики компании, аналитикой российского интернет-рынка и конкурентным анализом, координирует деятельность по онлайновому продвижению проектов Яндекса.

Доклад Дмитрия Сатина (UsabilityLab) посвящен теме «Юзабилити услуг в Интернете». Дмитрий Сатин — генеральный директор UsabilityLab, один из ведущих юзабилити-специалистов в России, президент Российского отделения UPA, ответственный редактор User Experience Magazine по странам СНГ и восточной Европе, автор учебных курсов и рецензент международных конференций по юзабилити.

Всего в программе конференции ожидается 40 докладов ведущих экспертов области, а также множество подарков и сюрпризов! К примеру, американская компания Розенфельд Медиа выступила спонсором конференции и проведет розыгрыш книг от Розенфельд Медиа. Также каждый участник получит 20%-скидку на всю продукцию компании.

Зарегистрироваться на User Experience 2010!

via UsabilityLab

Реклама

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

19 Авг

И снова Юрий Ветров, пользователь сайта Хабрахабра и руководитель UI Modeling Company, сделал подборку интересных материалов за июль месяц. Для пользователей Хабрахабр — не забудьте перейти на его профиль и поднять кармы.

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

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

Creative ways to solve usability problems
David Travis из компании Userfocus предлагает унифицированный подход к решению проблем в интерфейсе, найденных во время юзабилити-тестирования и эксертной оценки. Он называется SCAMPER согласно основным принципам.

Инструменты

User Interface Design Framework
Коллекция шаблонов и стенсилов для Adobe Illustrator, которая содержит ключевые элементы интерфейса и навигации, а также часто используемые иконки.

How to prototype interactive iPad applications in 30 minutes using keynote
Amir Khella подробно рассказывает о том, как можно использовать iPad-приложение Keynote для проектирования интерфейсов. Статья подробно описывает процесс и сопровождается небольшим скрин-кастом. Travis Isaacs описал процесс в виде презентации, а Luke Wroblewsky подготовил обзор материалов по теме.

Free Full Layered Facebook GUI PSD Kit
Компания SurgeWorks подготовила шаблон для Adobe Photoshop, который содержит основные элементы интерфейса Facebook. Прямая ссылка на скачивание — http://media.smashingmagazine.com/cdn_smash/wp-content/uploads/2010/07/facebook-gui-psd-kit.zip (ZIP, 6,5 МБ).

Mobile Prototyping Tools
Sheetal Dube из Evantgage Consulting пишет об инструментах для проектирования мобильных интерфейсов. Первая статья из серии посвящена Axure и его полезности на всех этапах процесса проектирования.

Touch Notation by Matt Legend Gemmell
Matt Gemell создал простую и понятную нотацию для проектирования тач-интерфейсов. Она позволяет описывать сложные жесты без перегруженных служебных иллюстраций и легко масштабируется до небольших размеров. Прямая ссылка на скачивание — http://mattgemmell.com/files/touch_notation.zip (ZIP, 200 КБ).

Windows Phone 7 UI Templates, Screenshots & Guidelines
Коллекция дизайн-шаблонов и руководств по интерфейсу для новой мобильной ОС Windows Phone 7. Хотя платформа еще в разработке, уже доступно достаточное количество полезной информации о ее интерфейсе. Особенно полезны официальная коллекция материалов для проектировщиков и дизайнеров инабор из 28 шаблонов для Adobe Photoshop (ZIP, 88 МБ).

Паттерны

UI Patterns — Symbian Developer Community
Библиотека паттернов, использующихся в интерфейсе мобильной ОС Symbian^3. Хотя вики проекта обновляется не очень активно, в ней собрано достаточно полезных материалов.

Процесс

Notes from The ROI of UX — Proving the Value of User Experience Design
Бывший менеджер по продажам Erin Lynn Young делится своим опытом работы с клиентами, которые она применяет на своей новой работе проектировщика. В статье масса полезных советов о том, как правильно подавать и продавать интерфейсные услуги.

Design Is a Process, Not a Methodology
Pabini Gabriel-Petit написала один из лучших и наиболее подробных обзоров процесса проектирования. Статья в деталях описывает три ключевых этапа — предварительные исследования, проектирование и дизайн, поддержку разработки — и основные методики для каждого из них.

Recruiting Better Research Participants
Jim Ross дает ряд советов о том, как подбирать респондентов для юзабилити-тестирования и других исследований пользователей. В статье дается масса полезных советов по всем частям процесса.

Design Better And Faster With Rapid Prototyping
Неплохой обзорный материал Lyndon Cerejo о процессе работы над страницами интерфейса — от скетчей до интерактивных прототипов. Хотя сама тема уже разжевана не один десяток раз, в этой статье дана хорошая выжимка для начинающих.

12 emerging best practice for adding user experience work to agile software development
Jeff Patton рассказывает о своем 10-летнем опыте работы над интерфейсами в agile-процессе разработки. Статья дает серию полезных советов о том, как начать работать в таком режиме и постепенно совершенствовать его.

Кейсы

Designing the Hilo User Experience
Отлично иллюстрированный кейс о том, как проектировался экспериментальный просмотрщик изображений Hilo. Идея продукта сама по себе вряд ли интересна, зато детальное описание процесса работы над ним снабжено тонной примеров постепенного развития концепции — от первых скетчей до работающего прототипа.

Quotes from the User
Коллекция забавных высказываний пользователей, произнесенных во время юзабилити-тестирований и других исследований.

Теория

Achieving and Balancing Consistency in User Interface Design
Michael Zuschlag пишет о целостности интерфейса — он должен быть максимально унифицированным для того чтобы пользователю не приходилось изучать его заново на каждой новой странице продукта. Автор использует термин «наименьшее удивление» в качестве основного посыла статьи.

The Real Life Social Network (A Presentation by Paul Adams)
Paul Adams из Google описывает результаты масштабного исследования поведения пользователей в социальных сетях — в каких группах и как интенсивно общаются их участники. Масса интересных фактов, которые пригодятся при проектировании социальных интерфейсов.

The Dirtiest Word in UX — Complexity
Хорошая обзорная статья Francisco Inchauste на тему сложности интерфейсов — нормальное ли это явление или с ним нужно бороться. Он рассказывает о разнице в задачах, культурах и подходах в управлении сложными продуктами.

История

Know Your Icons — A Brief History of Computer Icons
Хорошо иллюстрированная примерами история развития пиктограмм в интерфейсах. Начиная с Xerox Star — первого коммерческого продукта, использующего концепцию GUI — статья показывает развитие метафор и стилистики в иконографике.

Inside the Mundaneum
Красиво поданная и отлично иллюстрированная история бельгийца Paul Otlet, автора идеи фасетной классификации. Буклет рассказывает о его проекте Mundaneum, который многие называют прототипом интернета.

Тренды

UX Storytellers
Регулярно обновляемый блог, который собирает интересные материалы по теме storytelling из разных отраслей. Этот подход сейчас активно продвигается в интерфейсном сообществе, так что многое окажется полезным в работе.

Checkout Abandonment on the Rise
Исследовательская компания Forrester провела опрос пользователей интернет-магазинов, в котором они рассказали об основных причинах брошенных корзин. Наиболее популярны 5 причин — высокая стоимость доставки, неготовность к покупке прямо сейчас, простое сравнение цен, слишком высокие цены, желание сохранить список покупок на будущее.

Материалы конференций

Web App Masters Tour 2010 Coverage — Reports, Presentations, Workbooks
Отчеты, презентации, конспекты и видео с серии мини-конференций Web App Masters Tour 2010, проходившей с марта по июль в Сан Диего, Миннеаполисе, Филадельфии и Сиэттле.

Как фотографии людей удваивают конверсию

21 Июл

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

Это было подтверждено двумя независимыми экспериментами

Я проанализировал результаты двух A/B тестирований пользователей сайта Visual Website Optimizer и пришёл к выводу, что верный способ привлечь внимание посетителей — это разместить людские фотографии на сайте.
RSS2LJ[idarwin]3588b04e213785d4038ef736c96badb0

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

Давайте рассмотрим оба эксперимента.

Пример первый

Ребята из Medalia Art продают бразильские и карибские картины через интернет. Недавно они были приятно удивлены, когда фотографии художников на главной странице сайта увеличили число посетителей на 90%. Это не было их первое A/B тестирование, они до этого уже “игрались” со своей главной страницей. В прошлом им удалось уменьшить процент отказов на 20%, экспериментируя с размещением рекламных сообщений.

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

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

Ниже я привожу скриншоты вариантов исследования.

Первый вариант с картинами — контрольный.
image

А второй с фотографиями — победивший.
image

А вот результаты в цифрах

Вариант Конверсия Улучшение в %
Контрольный с картинами 8,8% —-
С фотографиями 17,2% +95%

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

Пример второй

Блог EmptyMind Джейсона Томпсона посвещён веб-аналитике и оптимизации. В боковой панели сайта находится большая иконка телефона, ведущая на страницу с контактными данными. В отличии от Medalia Art у Джейсона была причина провести сравнительное тестирование иконки против фотографии.

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

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

Контрольный вариант
image

С фотографией
image

Вариант Конверсия Улучшение в %
Контрольный с иконкой телефона 3,7% —-
С фотографией 5,5% +48%

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

Выводы

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

Я рекомендую вам провести подобное A/B тестирование, чтобы проверить, поможет ли людское фото чудесным образом вашему бизнесу.

И если у вас получится, то возможно, мы нашли великую формулу увеличения конверсии на сайтах. Удачи!

via lexxscorp

Raskin. MacOs X глазами Джефа Раскина

17 Июн

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

Узнать это на практике вы можете сами с помощью файл-менеджера Raskin, созданного поклонниками гения и опирающегося на его основные идеи отображения информации на экране компьютера.

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

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

С другой стороны, нельзя не признать новый подход к привычным вещам, что интересно. Но, кажется, именно с этого мы и начинали? 😉

Системные требования: Mac OS X 10.6 и выше.
Условия распространения: trialware.
Скачать (2,4МВ).

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

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 занимает первое место по удобству. Ну и пару скриншотов этой системы нам конечно не помешают:

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

23 Май

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

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

Last.fm
image

Mozilla
image

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

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

via