Я поведаю вам о мобильном приложении, которое завоевало огромное количество фанатов. Само собой разумеется, я говорю о ?????.
Вы также являетесь носителем одного языка и не понимаете, как ????? переводится? Не переживайте, это совсем не имеет значение. Отзывы на App не/меньше Store говорят сами за себя:
“Несложный интерфейс”, “Перевод и не нужен”, “Легко играться, даже если вы не можете просматривать по-японски!” Как же это приложение взяло такую ??немыслимую обратную сообщение?
Я скачала его, дабы разобраться в этом. Это само собой разумеется не имело ничего общего с жаждой иметь такую игру в собственном телефоне. Это было чистым изучением.
Одна из самых эффектных заставок. Кроме этого одна из немногих на британском – либо cat-English в этом приложении.
Приложение весьма простое. У вас весьма узкий задний двор с видом на переулок. Вы имеете возможность приобрести игрушки и еду и покинуть их во дворе, завлекая кошек.
Вы иногда в течение дня контролируете приложение, дабы заметить, какие конкретно кошечки посетили ваш двор (они самых цветов и разных пород!) и додаёте еды. Вы получаете сардины, каковые вы имеете возможность израсходовать на игрушки и еду. В случае если вам повезет, вы поймаете кошку, в то время, когда она играется во дворе!
В случае если нет, издание продемонстрирует вам, каких кошек вы не поймали.
Играясь в эту игру и заметив, как скоро и с каким наслаждением я обучалась применять это приложение, не обращая внимания на все надписи, каковые были пугающими, я осознала, что это простое, радостное приложение может преподать урок о хорошем пользовательском интерфейсе.
Давайте посмотрим, как это приложение само поведает, как оно трудится.
Кому необходимы слова, в то время, когда все разумеется?
Affordance (очевидность) – это по существу интерактивный элемент в дизайне. Среди разных “очевидностей” существуют следующие:
- Физические: интерактивные элементы, как “3D” кнопки
- Языковые: применение языка для объяснения вероятных действий – тип “очевидности”, что не нужен, если судить по ?????
- Шаблонные: везде употребляющиеся элементы, значение которых ясно, такие как “X” – “закрыть”, либо круглая иконка – “обновить”
- Символические: изображения, применяемые для обозначения действия либо содержания, как логотип птички Twitter намекает на то, что вы имеете возможность послать твит
Вы имеете возможность привлечь около 40 разных кошек, а эта серо-белая кошка отпугивает их и может все съесть сама.
Не обращая внимания на столь плоский, мультяшный интерфейс, что визуально не через чур отличается от настоящего заднего двора, ????? применяет физическую “очевидность” в виде кнопок в левом правом и верхнем углу нижнем углу приложения. В случае если мы надавим на верхнюю левую кнопку, мы откроем меню приложения.
О, смотрите! Мелкий котенок с сообщением в меню!
????? применяет шаблонные “очевидности”, элементы большинства приложений, такие как начать/войти и закончить/закрыть. Мы нашли меню, по причине того, что верхняя кнопка слева обычно открывает хорошее меню. Более того, кнопка меню преобразовывается в X, давая нам осознать, что чтобы выйти из меню, вы имеете возможность надавить X.
Я уже упоминала символические “очевидности”? Просмотрите опции меню. У меня уже были кое-какие предположения, перед тем как я надавила на них:
Мордочка кота: взглянуть на кошечек?
Сумка: Приобретения!
коробка и Мяч: Перечень моих игрушек?
Камера: Сделайте снимок!
Кошка в центре: Сначала я не додумалась, но скоро осознала, что эта иконка для вашего двора. В случае если надавить на нее, то меню закроется и вернет вас к хламу и кошечкам, разбросанному по вашему двору.
Сардина-самолет? Я понятия не имела, что это, но, учитывая, что валюта – рыба, я высказала предположение, что это взаимосвязано. Эта опция меню показывает вам, сколько вы получили за кошек, каковые посетили ваш двор с момента последнего применения приложения.
Сардина-самолет “с момента вашего последнего визита”: куча бродячих кошек, каковые пришли, покушали, поиграли с моими игрушками, а также не поблагодарили.
Механизм: Хорошая иконка настроек.
News: Одна из немногих языковых “очевидностей” в этом приложении, не смотря на то, что в том месте не столько “новости”, какое количество реклама вторых приложений, а также игры ninja panda.
Меню-сетка: Мне казалось, что в том месте легко больше вариантов меню, и я не совершила ошибку. Это собственного рода FAQ раздел и раздел сообщений, оба из которых, к сожалению, являются ненужными для носителей вторых языков.
Пара вещей в вашем дворе кроме этого кликабельны, не смотря на то, что менее понятны, чем другие “очевидности”. Вы не имеете возможность надавить на любую из ваших игрушек, но вы имеете возможность надавить на еду, дабы наполнить миску, и надавить на самих кошек, дабы определить о них и взглянуть – это новая кошка либо возвратившаяся попрошайка.
У меня большое количество возвратившихся попрошаек.
Как мне определить, какие конкретно мультяшные коты уже были в моем дворе?
Способом ошибок и проб
Я знаю, что кот приходил ко мне, по причине того, что я уже сфотографировала его и добавила фото к его ID-карте (ниже). В случае если оказалась новая кошка, квадратик показывал маленькую, неизвестную мордочку котенка, но в случае если я нажимала на громадную белую мордочку котенка, я имела возможность выбрать из сделанных мною фотографий кота ту, что мне нравится больше всего для карты.
Серо-белый кот возвратился для “призыва к новым действиям”
Это может показаться мало изнурительным в техническом замысле, в действительности это не верно, но мне потребовалось время, дабы изучить это. В то время, когда вы открываете опцию выбора изображения вашего кота, если вы не фотографировали, эта область будет безлюдной.
Но! По окончании того, как вы сделали фотографии (не забывайте иконку камеры?), вам не требуется тревожиться какие конкретно фотографии относятся к тому либо иному коту: приложение сделает это за вас!
Я совершила неточность, надавив на одну из кнопок, которая делается дешёвой, когда у вас будет пара фотографий для выбора: Delete. Вы ‘наказаныза это воздействие в том смысле, что вы теряете собственную фотографию, но это легко преодолеть, поскольку а) кошки довольно часто возвращаются и б) в то время, когда они приходят, они остаются на одном месте и делают то же самое, исходя из этого легко сделать новую фотографию.
Удаление снимков – нехорошее, что может произойти в данной игре. В то время, когда вы мало покопаетесь в приложении, вы определите, как трудится интерфейс, вы определите, что он требует два нажатия для завершения действия, предоставляя вам выбор – вправду ли вы желаете выполнить воздействие и дает вам возможность отмены.
Совершить ошибку в этом приложении практически нереально, и несложная отмена действия разрешает пользователю ощущать себя спокойным и увеличивает его желание изучать приложение – и, соответственно изучать интерфейс да и то, как игра устроена.
Что касается выполнении и навигации определенных действий, то вас ничего не расстроит в этом приложении. У вас имеется возможность легко отменить любое воздействие, которое вас смущает либо которое вы не желаете выполнять. Либо вы имеете возможность экспериментировать с действием, в котором вы не уверены без каких-либо негативных либо неудобных последствий.
Имеете возможность ли вы себе представить, что ваше банковское приложение так же легко изучить?
“Очевидности”, способ ошибок и проб что еще делает это нечитаемое приложение таким понятным?
“Три закона UX” в действии
Вот три закона UX:
- Сузьте выбор: пускай вариантов будет мало, и упростите их.
- Громадную кнопку тяжелее пропустить.
- Не перегружайте память: запоминаемых предметов должно быть 7 либо меньше.
Кошкам весьма нравится хвастаться собственными хвостиками.
Как показывает мой разбор меню, это приложение не утомит вас громадным числом действий. Значительно чаще вы не станете руководить такими опциями, как настройки, сообщения и новости/ответы, и останется всего пара главных опций.
Кроме того в самих опциях предстоящие варианты весьма несложны. К примеру, камера: в то время, когда вы надавите на нее, покажется графика хорошей камеры, дабы ни делали кошки, вы имеете возможность сфотографировать их. В режиме камеры, вы имеете возможность заметить две новые опции рядом с кнопкой закрытия “X”.
Одна показывает кошку (сфотографировать кошек!), вторая показывает целый вид (сделать снимок всей картины!). Весьма легко понять и еще легче руководить.
Любой, у кого когда-либо был кот, знает, как они не обожают безлюдные миски.
Независимо от того, какое воздействие вы делаете, варианты очевидны. К примеру, дабы убедиться, что у ваших кошек имеется еда, надавите на миску во дворе, которая наглядно продемонстрирует вам, как она полна. Вы имеете возможность заполнить ее (опция золотого цвета) либо выйти (серый вариант).
Кнопки громадные и их легко понять.
Но я не сама осознала воздействие кнопок “заполнить чашу” либо “отменить”. Я следила за вторым пользователем. И я как раз так определила об этом приложении.
“Из уст в уста” – действенная и приемлемая форма обучения пользователей приложению
Мой дорогой друг, что увлечен играми, поведал мне об этом приложении. По окончании того как я скачала его, он растолковал главную задачу: К тебе должны приходить кошки.
Если бы он не растолковал мне главную цель игры, я бы, возможно, скоро удалила это приложение. Уходит большое количество времени (и еды, и игрушек), дабы привлечь кошек, так что без понимания задачи, вы в конечном счете поразмыслите, что вы загрузили японское приложение – “наблюдай на безлюдный задний двор”.
Благодаря небольшой непредсказуемости и новизне этого приложения, о нем хочется сказать.
Поглядите на его мелкие сапожки!
Мало поиграв, я выложила пост в Facebook. К моему удивлению, у большинства моих друзей уже было это приложение, и они без устали обсуждали его. Обсуждение стало еще более горячим, в то время, когда я объявила, что мой двор посетил неуловимый “кот пират”:
В итоге, я назвала этого кота En Garde.
И вот так я определила о еще одной новой функции. (В тексте с картины говорится, что в случае если кликнуть на имя, то возможно переименовать кота)
Обратите внимание на то, как легко растолковать функцию. Мне не требуется копаться на страницах в форуме, искать необходимый пост, а после этого направляться долгой пошаговой инструкции. В ходе дискуссии одной функции, разговор стал причиной открытию еще одной функции, о которой я не знала.
Помимо этого, новая функция достаточно несложна, что приятель смог растолковать мне ее в одном предложении.
Я упомянула форумы и долгие пошаговые руководства, по причине того, что видела, что такое обычно есть простым подходом самопомощи пользователей, и это скорее приведет в неистовство, а не окажет помощь. Кое-какие компании выявляют самый обсуждаемые проблемные вопросы и вносят трансформации в собственный продукт, упрощая его применение.
Однако, я кроме этого видела, что вместо упрощения, компания FAQ из топ-рейтинг сообщений на форуме, либо дает ссылки на те посты, где поднимаются такие же вопросы. Это заставляет клиентов ощущать себя беззащитными и игнорируемыми.
Символ хорошего продукта
Разумеется, что нельзя сравнивать каждое приложение, SaaS либо второй продукт с аналогичной игрой. Но все же, я пологаю, что это японское приложение может преподать урок о хорошем UI:
Сделайте ваши “очевидности” достаточно понятными, такими, что язык не будет нужен (либо применяйте язык как возможно меньше)
Предоставьте пользователям способ ошибок и проб и легкую отмену действий
Пускай опции будут несложными, уменьшите их количество
Простые функции приводят к несложным и приятным беседам с клиентами, что содействует распространению продукта способом “из уст в уста”
Поразмыслите о приложении, которое вы используете либо, возможно, которое вы создали сами. Как вы думаете, смогут ли люди применять это приложение, в случае если удалить все языковые обозначения? Из-за чего да либо из-за чего нет?
Конечно же, это не лучшее решение для каждого продукта, но задуматься о том, как пользователь может изучить приложение и выполнить задачу без применения языка, непременно, пища для размышлений о UX.
Благодарю, что прочли эту статью! Если она вам понравилась, прошу вас, покиньте комментарий.
И еще:
Тогда как в заглавии статьи говорится лишь о UI, мы кроме этого затронули вопрос о UX. Не обращая внимания на то, что это различные понятия, UI и UX воздействуют друг на друга, и, надеюсь, что эта статья иллюстрирует, как хороший UI содействует хорошему UX.
Перевод статьи.
Высоких вам котоконверсий!
Случайные статьи:
- 5 Принципов дэвида огилви для продвижения мобильных приложений
- 7 Способов ускорить адаптацию к продукту без спама
Разведопрос: Андрей Ваджра о книге \
Подборка похожих статей:
-
Советы по созданию хорошего пользовательского интерфейса: часть 2
Продолжаем серию статей о секретах создания качественного UI и проектирования действенных лендингов. 28. Значения полей по умолчанию Умные значения полей…
-
Советы по созданию хорошего пользовательского интерфейса: часть 1
Хороший интерфейс пользователя (user interface, UI) охарактеризовать несложно: таковой интерфейс показывает высокие коэффициенты конверсии и эргономичен…
-
Onboarding-процесс: как создать хорошее первое впечатление?
В большинстве случаев, людям требуется всего пара мгновений, дабы организовать первое чувство. Специалисты уверены в том, что при знакомстве мы можем…
-
Почему хороший рекламист похож на инвестора
Алексей Иванов Директор по рекламе, Столичная область Алексей Иваново том, какими особенностями обязан владеть продукт, дабы его возможно было действенно…