Домашка с курса Артёма Горбунова
Опубликовано 29 июня 2009 в Без рубрики
Недавно закончился трёхдневный практический курс Артёма Горбунова — «Пользовательский интерфейс и представление информации». В целом впечатления очень положительные, несмотря на то, что курс рассчитан в основном на начинающих специалистов в области проектирования и дизайна интерфейсов. Было довольно приятно заниматься любимым делом не потому что надо, а просто ради удовольствия :)
Выкладываю своё домашнее задание. Это всего лишь концепция — без объяснений может быть не очень понятно. Многое я рассказывал во время презентации работы.
Задание было следующее: «Автомат для покупки билетов на метро. Стоимость не зависит от дальности поездки. Можно купить билеты на 1, 5, 10, 20 50 или 100 поездок, а так же проездной на день, неделю, месяц или год».
Так как я не особо силён в 3d-моделировании, попытался средствами Adobe Illustrator показать внешний вид автомата:
Первый экран:
Внесено 120 рублей. Подсвечены доступные покупки:
Внесено 20 рублей. Для покупки выбрана 1 поездка:
Покупка на уже существующую карточку с поездками:
Покупка на уже существующий проездной. Заодно показано как работает +/- на поездках:
Результаты других практических занятий можно посмотреть во FriendFeed — friendfeed.com/azart/25bdd353, friendfeed.com/azart/06ebdf8c и friendfeed.com/azart/89db14c5/pie-chart.
Дима написал(а):
Есть вопросы.
Не уверен, что подписей «Поездки», «Цена в рублях» и «Проездной билет» достаточно слева в одном экземпляре. Нужно больше времени, чтобы понять. Это может быть интерфейсе для опытных пользователей, но в метро много людей, покупающих билеты редко (приезжие). «2 поездки 40 руб.», «5 поездок 90 руб.» и т. д. — понятнее.
Вот по этому http://axme.ru/wp-content/uploads/03-Money-In-20.jpg вопросы.
Почему не сделать покупку просто по нажатию на нужный квадрат? Нужна ли действительно корзина? Большинство людей разве не покупают дефолтные конфигурации?
Еще есть ощущение, что «вернуть деньги» и «купить» конкурируют между собой. То есть кажется, что одна возможность искючает другую (сбросит).
Вообще в плане информационного дизайна — много областей с белым текстом на синем фоне — слишком однообразно, сложнее привыкнуть.
А с полупрозрачными купюрами красивая идея.
Александр Хмелевский написал(а):
Ну на счёт «Поездки» и «Проездной билет» это спорный вопрос. Писать у каждого элемента такую подпись я не считаю необходимым и так всё понятно. Что касается рублей, то да, может быть и стоило бы подписывать.
На счёт корзины, тоже согласен, очень спорный момент. Стоило бы подумать над этим. Насколько я помню, я руководствовался желанием сделать защиту от случайной покупки. Кроме того, предполагается, что я сначала могу внести деньги, а потом выбрать один из доступных вариантов или наоборот сначала выбрать нужный, а потом внести деньги.
Я конкуренции между «Вернуть деньги» и «Купить» не вижу :) На счёт однообразности тоже не совсем понял. Почему сложно привыкнуть? Вы думаете стоило бы кнопки сделать более выделяющимися?
Дима написал(а):
>> Кроме того, предполагается, что я сначала могу внести деньги, а потом выбрать один из доступных вариантов или наоборот сначала выбрать нужный, а потом внести деньги.
Это точно нужно? Обычно ведь сначала выбираем товар, потом платим.
Кстати вот в современных терминалах довольно простая схема: выбираешь услугу, дальше запускается процесс оплаты в несколько шагов. При этом каждый шаг крайне примитивный, максимум пара опций (вперед-назад).
Действительно ли нужно всё умещать на одном экране? Не будет ли такой интерфейс сложнее для простых людей?
>> Вы думаете стоило бы кнопки сделать более выделяющимися?
Думаю, да.
Руслан написал(а):
Довольно странным мне кажется вывалить весь функционал пользователю на стол. Я понимаю, что это легко, в один шаг предоставить все возможности, но зачем это здесь. Я понимаю, что профессионалу всегда хотелось бы иметь быстрый и полный контроль над всем, но давайте посмотрим для кого это сделано.
Итак ранее утро. Я сонный подхожу к аппарату, чтоб побыстрей уже купить билет (ведь я уже минут 15 простоял в очереди), и что я вижу… Какие-то цифры по две в квадратике.. какие-то плюсы и т.д… хорошо, если я им пользуюсь уже пару лет, я тогда бы понял что к чему.. Но ведь я пользовался им всего пару раз! И вообще чем отличаются поездки и проездной билет.. что мне надо.. и на сколько мне надо… может пять.. может десять.. или нет вот до этого числа хочу… А очередь сзади начинает меня пинать… Им тоже охото на работу! Им тоже нужен билет!
Вообщем, на мой взгляд такие интерфейсы должны быть не более чем с 3-4 вариантами дальнейшего пути, а лучше с двумя. Лучше путь будет на пару шагов больше.
1)Первый шаг: покупка на поездки, покупка на кол-во дней.
2)Второй шаг: выбор количества/внос денег (при вносе хорошая подсветка кнопок).
3)Третий шаг: Большая кнопка: Получить билет. Маленькая кнопка: Назад. Ещё меньше: вернуть деньги.
И при этом не нужно показывать всего остального, а то пользователь точно не дойдет до кнопки «Купить». И надо подписывать поездки дни и рубли.. иначе все будет плохо…
Александр Хмелевский написал(а):
Дмитрий, Руслан, спасибо за комментарии.
Я с вами согласен, что, возможно, такой вид подачи усложнит работу, но люди же не идиоты. Я как раз наоборот хотел избавиться от пошаговости нынешних терминалов и не ограничивать пользователей в своих действиях. Мне было просто скучно делать по стандартам и я решил попробовать такой вариант. Хотя, скорей всего, это не совсем правильное решение.
В любом случае, мы с вами можем только догадываться, опираясь на собственный опыт и знания, как себя поведет пользователь, оказавшись один на один с таким автоматом. Необходимо провести тестирование, чтобы на 100% быть уверенным в несостоятельности такого подхода.
В ближайшее время я продолжу работу над этим интерфейсом и попробую привести его в более понятное и удобное состояние, но не используя стандартное решение с пошаговостью. Для это надо проработать как можно больше сценариев взаимодействия и постараться учесть все нюансы.
Кстати, Евгений Главницкий вчера основательно прошелся и по визуальной части: http://www.free-lance.ru/blogs/view.php?tr=453367
Руслан написал(а):
Да, я видел эти комментарии, но я решил критиковать ту часть, где являюсь профессионалом сам )
Мне кажется, что возможен уход от большого количества шагов, так и его сокращение, но тогда нужно сделать все более явным.
Вы видели, как люди покупают билеты в новых ЖД аппаратах? я видел, как пытались это сделать 4 человека по очереди. Естественно билетов никто не купил, пошли к кассе. Хотя шага там было 3-4, а я бы сделал 5-6. Они сократили количество шагов за счет того, что вбухивали на один экран все логичное. И вроде было все логично, но не удобно.
Я буду очень рад, если вы придумаете интерфейс, который бы давал простоту для новичков, уверенность в выборе для середняков и множество функций для профи. Но мне кажется, что именно здесь этого не требуется.
Чем больше мы заставляем человека думать, тем сложнее ему кажется процесс покупки. И никто здесь не идиот. Я не хочу думать, когда открываю входную дверь, я подбираю ключ на автомате. Я не хочу думать, когда покупаю билет, я хочу тыкнуть пару раз (интуитивно) и получить билет.
А что касаемо поведения пользователей, то его очень легко спрогнозировать (если у Вас есть опыт юзабилити-тестирований, если нет советую провести, хотя бы над знакомыми), если мы знаем в каких условиях и кто будет этим пользоваться. Выделить несколько ролей и дать два-три пути…
Хотя это лично моя позиция.