Как стать автором
Обновить
45.78

Usability *

Удобство использования

Сначала показывать
Порог рейтинга
Уровень сложности

Как мы в PassportVision интерфейс делали

Время на прочтение11 мин
Количество просмотров23K
Проектирование интерфейсов — ремесло очень сложное. Увы, не очень понятно, как этому ремеслу учиться. Разумеется, на сегодняшний день существует огромное количество разных хороших книжек про разные хорошие подходы к этому самому проектированию. Однако практика подсказывает, что даже если вы их все вдумчиво прочитаете, то это не будет означать, что вы будете уметь в любой ситуации создавать идеальный UI. А всё дело в том, что подобная деятельность скорее является своего рода искусством, нежели следованием набору правил. Но как же этим искусством овладевать, если хорошие книжки не дадут необходимых навыков? Нам кажется, что ключевым фактором в этом деле всё-таки является опыт. Но учиться только на своём опыте — занятие долговременное, лучше бы и на других людей поглядывать (и это далеко не только к интерфейсам относится).

Давайте немного поговорим о том, как правильно перенимать чужой опыт. У нас есть много знакомых команд, которые разрабатывают действительно крутые приложения. И при показе нам своих интерфейсов они начинают рассказывать, что и как они сделали. А мы всегда спрашиваем, почему они так сделали, почему они пришли именно к такому решению. И нам кажется, что это самый правильный вопрос. Да, бывают гениальные люди, которым без всякой матчасти во сне привидится идеальный интерфейс без разного рода тяжёлых размышлений о том, как делать хорошо, а как делать плохо. Но таких людей мало, а на подобном опыте многому не научишься. Образное мышление действительно развивается, когда тебе рассказывают о мотивации каждого своего решения (даже самого маленького). Мол, мы сначала сделали так и так, но пользователям было неудобно ввиду вот этого, поэтому мы переделали всё вот так, и теперь все живут счастливо.

В этом посте мы хотели бы рассказать историю одной формочки, которую мы сделали при разработке нашего продукта PassportVision (о котором уже рассказывалось на Хабре). Это одна-единственная небольшая формочка, но мы её делали целый год. Насколько хорошо у нас получилось — судить вам, но пользователи весьма довольны (а разве не это критерий удачного интерфейса?). Мы многократно переделывали разные штуки, горячо спорили о разных мелочах, но в конце концов получилось то, чем удобно пользоваться. Впрочем, нам думается, что через год мы взглянем на этот пост, взглянем на наш к тому времени уже старый UI и скажем: «О Господи! Мы что, действительно отдавали это пользователям? Ох, стыдно, как же стыдно». Но всё правильно — интерфейс постоянно должен развиваться, эволюционировать, становиться лучше. А сегодня мы поговорим о том, что имеется на сегодняшний день и как же мы к этому пришли.

Читать дальше →
Всего голосов 55: ↑51 и ↓4+47
Комментарии29

«Эффект пустого пространства» или роскошь из ничего

Время на прочтение3 мин
Количество просмотров23K
image
Недавно, среди огромного множества материала о дизайне и его концепциях на глаза попались два интересных исследования, которые освещали влияние одного и того же эффекта в розничной и электронной торговле.

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

В качестве яркого примера автор приводит рекламную концепцию от Паркер (черно-белое изображение взято из описания исследования, но при этом можно утверждать, что Паркер сохранили эту концепцию до наших дней, т.е. на протяжении 10 лет).

Пример 1
Пример 2

Второе исследование было проведено в 2013 году. В ходе эксперимента были собраны статистические данные о том, как использование пустого пространства в дизайне интернет-магазина влияет на оценку стоимости товара посетителем.
Читать дальше →
Всего голосов 29: ↑20 и ↓9+11
Комментарии20

Как сэкономить время, запоминая сочетания клавиш

Время на прочтение3 мин
Количество просмотров21K
Brainscape Вы когда-нибудь задумывались над тем, сколько времени можно было бы сэкономить, если бы вы использовали сочетания клавиш каждый день? У парней из Brainscape есть ответ, и, между нами говоря, они насчитали что-то просто неимоверное!

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

Они сделали интересный тест, чтобы увидеть, сколько времени пользователь тратит впустую, когда он использует мышь вместо сочетаний клавиш, и результаты крайне удивительны. По их расчётам, пользователь может сэкономить в среднем 8 дней в год, если он будет использовать сочетания клавиш вместо кликов мыши.
Читать дальше →
Всего голосов 29: ↑25 и ↓4+21
Комментарии14

Решебник по геймификации. Задача #1: интернет проект с UGC контентом

Время на прочтение5 мин
Количество просмотров11K
image

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

Постановка задачи


Дано:


Итак, есть интернет проект. Большая часть его контента, если не весь, должен генерироваться самими пользователями, он может быть разных типов.

Найти:


Сами участники должны публиковать контент, оценивать и модерировать контент, выложенный другими пользователями.
Читать дальше →
Всего голосов 37: ↑33 и ↓4+29
Комментарии8

46 простых советов для успеха вашего интернет-магазина

Время на прочтение3 мин
Количество просмотров28K
image
Роб Грин, владелец собственного консалтингового агентства в Лос-Анжелесе, уже долгое время работает в сфере SEO. За эти годы он видел множество интернет-магазинов и может четко сказать, чего не хватало большинству из них. Он собрал список из 46 самых актуальных советов, которые он давал своим клиентам.

1. Никогда не оставляйте письмо без ответа. Всего 48 часов, и ваш клиент перестанет ждать.

2. Дайте клиенту увидеть стоимость доставки без регистрации.

3. Если вы доставляете товар в различные регионы (страны), сделайте список регионов в алфавитном порядке.
Читать дальше →
Всего голосов 42: ↑34 и ↓8+26
Комментарии8

Каждому по Landing Page. Наболевшее

Время на прочтение6 мин
Количество просмотров240K
То ли с подачи Бизнес Молодости, то ли по иным причинам, сейчас только ленивый не предлагает разработку Landing Page. И на то есть причины. Согласно глобальной идее, лендинг – эта такая особая страница, которая технично должна превращать посетителей в лиды со значительно большей вероятностью, чем это умеет делать сайт в привычном понимании.


Сатира на большинство «лендинг пейджей»
Читать дальше →
Всего голосов 98: ↑85 и ↓13+72
Комментарии47

Видеозаписи докладов конференции DesignLab

Время на прочтение2 мин
Количество просмотров10K


DesignLab — двухдневная конференция по дизайну, которая прошла 17 мая 2014 года в городе Одессе, организованна командой GeeksLab.
Конференция проходила в два потока: Brand new design и Marketing & UI&UX
Презентации и видеозаписи докладов под катом.
Читать дальше →
Всего голосов 13: ↑13 и ↓0+13
Комментарии1

Порнотехнологии в расшаренных заметках Evernote или как не надо делать

Время на прочтение1 мин
Количество просмотров23K
Вот уже несколько недель, как некоторые мои коллеги, партнёры и друзья, не обладающие достаточным скиллом в технологиях, говорят мне: «мы не можем открыть твою страницу, нас просят создать аккаунт!»

Страница, о которой идёт речь — расшаренная заметка в Evernote. С недавних пор в расшаренных в вебе заметках сервис стал показывать вот такое вот «ненавязчивое» приглашение создать аккаунт:

image

Цель предложения понятна. Метод — непонятен абсолютно. Вся суть расшаривания контента любому человеку теряется полностью, новичок не сможет просмотреть контент, так как не заметят/не поймут, что на самом деле можно нажать ссылку «Skip». Да и любого IT-спеца попап будет раздражать. Я знаю, Evernote, вы читаете Хабр. Подумайте над более мягким способом предложить регистрацию в сервисе, сделайте милость!

Update


Попап показывается только для контента с непремиум аккаунтов.
Всего голосов 82: ↑54 и ↓28+26
Комментарии31

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

Время на прочтение8 мин
Количество просмотров21K
Тут мне во дворе рассказали, что говорить “фри-ту-плэй” уже немодно. Если делаешь игру, в которой концепция монетизации “всё бесплатно, но за некоторые вещи я бы советовал вам заплатить”, то называй это “фримиум”.
Продолжая модный ликбез, скажу, что ещё сейчас делают немодно – туториалы (от английского tutorial – учебник) – то, как разработчики объясняют игроку, чем же ему можно заняться в приложении. К счастью, социальные и мобильные игры не сводятся исключительно к механике три-в-ряд, поэтому пользователю не всегда понятно, что же ему нужно делать для достижения нирваны. И сейчас большинство туториалов не выполняют своей роли.



Погодите, а почему туториал важен?


— Это то, что видит игрок сразу после экранчиков загрузки, вступительного ролика и прочих неигровых элементов;
— Как следствие, плохой туториал – прямой путь к высокому проценту потери аудитории. Иными словами, бОльшая часть людей, запустивших игру уйдёт, так и не поняв, что же от них хотели;
— Если очевидные правила люди уловить способны (грядки нужно засаживать помидорами, замораживающий луч неэффективен против ледяных крокодилов), а туториал плох, то есть риск, что большая часть контента пройдёт мимо игроков. А это, с одной стороны, лишние трудозатраты, а с другой – весь выверенный баланс, кривая сложности и политика монетизации обрушивается. Например, игрок не понимает, где ему купить солдатиков, он вынужден убивать врагов, тратя золотые магические рубины – и в результате обиженно бросает игру с «зажравшимися разрабами, которые прямо со входа денег требует».

Теперь о том, какие туториалы знает современная геймдевелоперская наука:

Виды туториалов:


  • «Сами разберутся»
  • «Мы умеем выдавать мессаджбокс»
  • «Заблокированный экран и тайна затерянной стрелочки»
  • «Чёрная амбразура ужасающей безысходности»
  • «Мы можем всем объектам добавить ещё одну анимацию»
  • «Направляющий луч»


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

Давайте рассмотрим
Всего голосов 37: ↑34 и ↓3+31
Комментарии11

Дэн Саффер — Микровзаимодействия (Microinteractions). Конспект книги

Время на прочтение21 мин
Количество просмотров39K
Microinteractions book cover«Детали — это не детали. Они создают дизайн.» — Чарльз Имз.

Успех цифровых продуктов определяется мелочами. Книга «Микровзаимодействия» Дэна Саффера научит вас проектировать эффективные функциональные элементы. А этот подробный конспект поможет лучше запомнить прочитанное или даже заменит англоязычный оригинал.

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

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

Читать дальше →
Всего голосов 49: ↑49 и ↓0+49
Комментарии2

Чек-лист по юзабилити интернет-магазинов

Время на прочтение7 мин
Количество просмотров90K
Апофеоз сотни холиваров и улучшения работы QA — чек-лист по юзабилити интернет-магазинов. В нем частично задействованы прошлые документы — чек-листы по формам и фильтрам. Пользуйтесь.


Читать дальше →
Всего голосов 68: ↑58 и ↓10+48
Комментарии4

Что не так с Google+

Время на прочтение6 мин
Количество просмотров109K
Этот пост был написан спустя год после запуска Google+, и пролежал в черновиках с тех пор ещё два года. Периодически я вспоминал про него, вздрагивая: а вдруг G+ взлетел и пост будет уже не актуален? Но время шло, Google+ всё никак не взлетал, и три года после запуска его соцсети, жизнь кипит в Фейсбуке, Твиттере и Вконтакте. Жизнь кипит и на Ютубе, где без G+ теперь ни лайк не поставишь, ни коммент не оставишь. И только в самом G+ жизни нет. А выводы поста не просто остаются актуальными, а подтверждены практикой. Поэтому просто выкладываю написанный два года текст как есть.

Конечно, понятие неуспеха относительно. В Google+ есть большое количество пользователей, бренды считают обязательным в свой «соцпакет» к представительствам в Фейсбуке и Вконтакте добавлять и G+. И тем не менее Google+ — это провал.


Читать дальше →
Всего голосов 236: ↑153 и ↓83+70
Комментарии282

Наш чек-лист для форм на сайтах

Время на прочтение6 мин
Количество просмотров88K
Это вторая часть наших чек-листов. В первой мы подробно разобрали требования к фильтрам. В отличие от фильтров, требования к пользовательским формам более универсальны. Однако нам потребовалось несколько жарких дискуссий, чтобы выработать более-менее единый формат. Видео с HolyWarModeOn рассказывает о типовых ошибках юзабилити в проектах. Сразу под роликом ищите подробный чек-лист для форм на сайте.



Читать дальше →
Всего голосов 27: ↑14 и ↓13+1
Комментарии11

Ближайшие события

15 – 16 ноября
IT-конференция Merge Skolkovo
Москва
22 – 24 ноября
Хакатон «AgroCode Hack Genetics'24»
Онлайн
28 ноября
Конференция «TechRec: ITHR CAMPUS»
МоскваОнлайн
25 – 26 апреля
IT-конференция Merge Tatarstan 2025
Казань

Как превратить Pale Moon в удобный браузер

Время на прочтение5 мин
Количество просмотров80K
Прочитав статью о богатом функционале старой Оперы, я решил рассказать о проблемах, которые я смог (и не смог) решить в браузере Firefox, а точнее его форке Pale Moon. Я коснусь не только вопросов, поднятых в той статье, но и других проблем, с которыми я столкнулся.
Читать дальше →
Всего голосов 12: ↑7 и ↓5+2
Комментарии8

Разработка через жалобы

Время на прочтение5 мин
Количество просмотров11K
В течение последнего года я мало писал, так как был занят разработкой нового средства для ведения дискуссий. Если вы, вслед за моими инвесторами, хотите знать, почему это заняло целый год, мне стоит объяснить, как именно я делаю программы, или, как минимум, как мы сделали Stack Overflow, Stack Exchange и, теперь, Discourse:

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

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

3. Начните использовать этот продукт вместе со всей командой, каждый день, весь день. Это не просто разработка: это вся ваша жизнь. Если вы не живете разрабатываемой программой каждый день, целый день… проект неизбежно ждет плачевный исход. И, честно говоря, если мне приходится вам это объяснять, то знаете что? Вы в заднице.

Читать дальше →
Всего голосов 42: ↑38 и ↓4+34
Комментарии9

Сравнение юзабилити современных браузеров со старой Оперой

Время на прочтение6 мин
Количество просмотров129K

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

Старая Опера была для меня почти эталоном браузера. В ней было реализовано столько прекрасных вещей, которых почему-то нет в современных браузерах, что порой диву даёшься — почему такие светлые идеи никто больше не реализовывает.

Чуть больше года назад компания Opera объявила, что они делают новый браузер на основе форка Chromium от Google (Blink).

Прошёл год, но от того User Experience, который был раньше, Опера ой как далеко, жалкий младший брат Chrome. Даже относительно молодой Яндекс.Браузер развивается куда стремительнее и имеет своё лицо. Я буду сравнивать старую Opera с Chrome, как представителем браузеров на WebKit и Blink, и Firefox. И прошу учесть, что это, всё-таки, моё личное мнение.

Осторожно, много картинок
Читать дальше →
Всего голосов 265: ↑239 и ↓26+213
Комментарии410

Иной взгляд на оформление заказа в интернет-магазине

Время на прочтение4 мин
Количество просмотров63K


В странах СНГ не менее 75-80% заказов приходятся на cash-and-delivery (оплата заказа при доставке). Это отличие российского и западного потребителя легло в основу редизайна оформления заказа Сотмаркета еще в 2012 году. Тогда впервые в России интернет-магазин перестал требовать авторизации или регистрации клиента перед совершением покупки.

Фоновая регистрация и авторизация пользователей


Хотя авторизация на последнем шаге покупки и не несет никакой ценности для пользователя, это западное клише глубоко укоренилась в Рунете. Со средней частотой покупки (техники) раз в 9-10 месяцев люди зачастую не запоминают регистрационных данных: эл. почты, логина, пароля. Парадокс в том, что большинство интернет-магазинов с готовностью принимают заказы по телефону, но при этом создают искусственные препятствия при совершении покупке онлайн.

Это наблюдение легло в основу концепции фоновой регистрации и авторизации пользователей.
Читать дальше →
Всего голосов 93: ↑80 и ↓13+67
Комментарии83

Обучающие видео по работе в Axure

Время на прочтение2 мин
Количество просмотров59K
«Всем привет, меня зовут Егор Камелев и сегодня я расскажу вам…»
Если вы уже слышали эти слова, то, скорее всего уже встречались с одним или несколькими из моих обучающих видео по работе в Axure. Прошло уже довольно много времени с тех пор, как я добавил первое из них (тогда ещё для Акшуры какой-то древней версии), и я решил сделать некий сводный список того, что уже есть, чтобы вам не пришлось мучиться с поиском на моём канале. Да, конечно, в этом списке только те ролики, которые имеют отношение в Акшуре седьмой версии! Итак, поехали.
Читать дальше →
Всего голосов 27: ↑25 и ↓2+23
Комментарии5

ProfsoUX-2014 — видеозаписи и краткий обзор

Время на прочтение6 мин
Количество просмотров5.2K
Пару недель назад в Питере прошла юзабилити-конференция ProfsoUX-2014, своим «профсоюзным» названием обозначающую именно индустриальность проблем, заслушанных на собрании ленинградских трудящихся в области Usability и UX. Как бы прикол, хотя реальность развивается в таком направлении, что скоро действительно появятся «профсоюзы работников человеко-ориентированного проектирования интерактивных систем для электронно-вычислительных машин ГОСМИНЭРГО».

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

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

Вот, в качестве иллюстрирующей видеокартинки — трехминутный обзорный ролик обо всех докладах конференции.


А теперь, под катом, предлагаю краткий обзор-классификацию с ссылками на видео, так, чтобы вы могли посмотреть именно то, что вас потенциально интересует.
Читать дальше →
Всего голосов 26: ↑24 и ↓2+22
Комментарии13

Конференция по дизайну «DESIGN LAB»

Время на прочтение3 мин
Количество просмотров4.1K


Geeks Lab приглашает всех 17-18 мая в Одессу на двухдневную конференцию по дизайну «DESIGN LAB».

Первый день будет разделен на два потока:
  • «Brand new design» — поток, посвященный развитию новых направлений, течений и тенденций в дизайне, сайтах, мобайле и приложениях.
  • «Marketing & UI&UX» — поток, будет посвящен связи маркетинга и дизайна, новым тенденциям, которые диктует интернет-маркетинг бизнесу через призму дизайна.
Читать дальше →
Всего голосов 7: ↑5 и ↓2+3
Комментарии2

Вклад авторов