Андроид «быстрый набор» и скрытые возможности – создаем ярлык на контакт. Звоним быстро: особенности использования встроенного телефонного приложения и менеджера контактов на смартфонах Samsung

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

Манифест для сайта – это простой JSON-файл, который позволяет вам настроить следующие вещи:
1. Какая будет иконка у пользователя, после того как он добавит ваш сайт на рабочий стол
2. Как будет запускаться ваш сайт (с адресной строкой, без нее или в полноэкранном режиме)
3. Splash screen
4. Цветовую тему
5. Ориентацию экрана
6. Начальный url
и многое другое

Подробнее

Чтобы показать, как manifest влияет на отображение сайта, я создал простое, тестовое веб-приложение, которые возвращает название региона по коду.

Сначала зафиксируем положение дел до добавления файла манифеста.

После того как пользователь добавил иконку, она будет выглядеть так (на Андроид 5.0)
Название браузер выдернул из тега tilte. Так что, если у вас нету файла манифеста, то хотя бы title должен быть нормальным. А вот иконка в виде буквы “G” появилась сама (не понятно, почему именно G).
А сам сайт будет выглядеть так

Тут, собственно, ничего особенного, кроме того, что мы можем убрать адресную строку, чтобы приложение было похоже на нативное.

Встречайте, manifest.json!

С примером манифеста можно ознакомиться по этой ссылке . Кратко пройдемся по параметрам:
name – имя, которое будет отображаться под иконкой, ну и вообще везде, где будет отображаться ваше «приложение»
short_name – будет использоваться в тех случаях, когда места для отображения полного имени недостаточно
icons – набор иконок разных размеров
start_url – определяет url, которые открывается при нажатии иконки (можно использовать, чтобы зафиксировать пользователей, которые открывают сайт через иконку на рабочем столе, добавив параметр, допустим, ?src=homescreen в url)
display – отвечает за то, как будет отображаться ваш сайт (с адресной строкой без нее и т.п.)
background_color – устанавливает цвет страницы до того как она загрузилась. Пока страница не загрузилась пользователь видит перед собой белое пустое поле. Чтобы как-то разукрасить его серые будни, можно изменить этот цвет. Например, поставить цвет фона сайта.

Генерируй и властвуй.

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

brucelawson.github.io/manifest - все что вам нужно – заполнить поля (есть краткое описание каждого параметра, так что процесс довольно легкий), остальное за вас сделает генератор.

www.favicon-generator.org - хоть прямое назначение этого сайта генерировать иконки, а не манифест. Он все же его создает и в отличии от предыдущего у вас уже будут и иконки (для iOS и Аднроид) и манифест. Правда, манифест придется подправить (изменить имя и прочее настройки).

manifest-validator.appspot.com - этот инструмент предназначен для валидации вашего манифеста.

Результат

Итак иконки нарисовали, манифест сделали. Дальше надо сообщить браузеру о манифесте, добавив в тег head следующие

Все. Смотрим, что получилось
Иконка:

Слева до. Справа после (иконка получилась невпечатлительная, с удовольствием поменяю, если пришлете лучше). Тут уже заметно, что Android использовал имя из поля short_name, так как name не помещается, видимо.

Загрузка приложения:

Тут самые приятные изменения. Во-первых, вместо белого экрана вы видите подобие splash screen, который сам создается системой из иконки, полного имени и цвета, указанного в манифесте (возможно, это происходит только на android 5.0 выше). Во-вторых, этот splash screen плавно исчезает, что визуально красиво.

Сам сайт:

Тут тоже все стало лаконично. Без UI браузера сайт смотрится гораздо лучше и больше похож на нативное приложение.

Я перечислил не все свойства, которые можно указать в файле манифеста. С полным списком можно ознакомиться

Время от времени меня посещает желание начать вести свой собственный блог или подкаст, но недостаток свободного времени для регулярной поддержки этого проекта, нежелание вести блог, обновляемый раз в год или около того, а иногда и банальная лень, этот природный тормоз прогресса, свойственный 99% населения земли, все время удерживают меня от этого поступка. Во время одного из таких творческих подъемов, который посетил меня прошлым летом, я написал значительную часть статьи, окончательный вариант которой и предлагаю сегодня к прочтению уважаемому сообществу незрячих пользователей Android. Поводом к публикации послужил вопрос о работе со стоковым менеджером контактов в смартфонах Samsung, поднятый в рассылке "Blinddroid". Эта статья, как мне кажется, слихвой может покрыть потребности даже самого требовательного пользователя. Будет ли жить мой блог дальше - большой вопрос, но смею надеяться, что материал окажется полезным и востребованным, а вы, уважаемые пользователи, еще обязательно посетите эту страничку. И так, переходим к сути вопроса.

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

Прежде чем начать, давайте договоримся о нескольких вещах. Во-первых, в качестве подопытного образца выступит мой Samsung Galaxy s5, так что на все 100% эта статья подойдет только обладателям данной модели и ее модификаций. однако, многое из того, о чем пойдет речь, вы найдете и в других аппаратах Samsung, получивших обновление до Android 4.4 и выше. Более того, поскольку речь пойдет о функциях довольно типовых и скорее привычных по старым кнопочным телефонам и желаемых, нежели революционных, Вполне возможно, что похожие функции обнаружатся и на смартфонах других производителей, и в популярных сторонних номеронабирателях. Поэтому, если вы не являетесь обладателем аппарата от Samsung, не спешите закрывать эту страничку. Быть может, найдете что-то интересное и для себя.

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

И так, приступим. Для экономии времени мы не будем говорить о том, что и так более-менее очевидно, например о наличии строки поиска в приложении "Контакты" и о возможности использования избранного или групп для более удобной сортировки контактов, а сразу перейдем к вещам, которые с первого взгляда заметны не всегда.

Ответ и завершение вызова аппаратными кнопками

Одна из первых проблем, особенно для незрячего пользователя - ответ и завершение вызова. Стандартная процедура хоть и доступна, не всегда удобна. Поэтому резонно упростить этот процесс. На некоторых аппаратах такая возможность предусмотрена прямо из коробки. Находится она в разделе "специальные возможности", который находится на вкладке "устройство". А дальше все просто: находим пункт "Ответ и завершение вызова", входим в него и активируем нужные нам флажки. Кроме ответа и завершения вызова аппаратными клавишами, есть также возможность выполнять эти действия проведением рукой над устройством и с помощью голосовых команд. Махать рукой не пробовал, может быть это и удобно, а вот отвечать голосом, на мой взгляд, идиотизм какой-то, к тому же, мне так и не удалось определить, какой командой можно заставить его ответить на вызов. Если в вас дремлет дух экспериментатора, то можете попробовать: возможно вы окажетесь более удачливы. Не стесняйтесь написать о своих результатах в комментариях.

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

В смартфонах других производителей возможность удобного ответа на звонок средствами заводского ПО либо отсутствует, либо реализована по-другому. Завершение вызова клавишей питания теоретически можно сделать на любом устройстве, и некоторые производители успешно это делают, а вот отвечать на звонок оказывается нечем, т.к. аппаратную клавишу Home имеют только смартфоны Samsung. Зато в некоторых моделях Lenovo например есть функция "Умный ответ", которая позволяет отвечать на звонок простым поднесением телефона к уху.

Звоним одним движением.

Помните, как все было просто на старых кнопочных телефонах: выбираешь нужный контакт, запись в журнале вызовов или даже СМС-сообщение от нужного человека, жмешь кнопку вызова и вот оно счастье. Теперь же все по-другому: выбираешь контакт - открывается его визитная карточка, выбираешь запись в журнале - открывается история звонков и сообщений с данным абонентом. Любимая кнопка вызова осталась только в приложении "телефон", которым пользуешься гораздо реже, чем контактами. Однако, не все так плохо. Слева от каждого контакта, записи в журнале звонков или беседы в приложении "Сообщения" есть графический элемент, с помощью которого можно быстро начать звонок или написать сообщение. Для того, чтобы совершить звонок, нужно дважды тапнуть по этому значку и, не отрывая палец от экрана после второго прикосновения, провести вправо. Чтобы создать сообщение, нужно сделать то же самое, но провести пальцем влево. Подобный алгоритм срабатывает и на смартфонах ряда других производителей.

Что касается аппаратов Samsung, то для пользователей TalkBack есть аш три новости, и, как это не странно, две из них - хорошие. Начнем, тем не менее, с плохой, ну или, как минимум, нейтральной. При попадании на значок TalkBack говорит "Дважды нажмите, чтобы прослушать более подробные сведения о контакте". Я не знаю, что по мнению производителя должно быть понятно из этого сообщения, но лично мне понятно, что начинающему пользователю, который не имеет возможность увидеть форму этого элемента управления, вряд ли самому придет в голову провести по этому значку пальцем. Хорошие же новости слихвой перекрывают плохую. Во-первых, использовать данный функционал можно не только находя нужный контакт с помощью "изучения касанием", но и обыкновенными смахивающими жестами. В этом случае жесты выполняются практически в любом месте экрана. Не стоит только начинать жест звонка близко к левой границе экрана, где расположены соответствующие графические значки, т.к. существует вероятность перемещения фокуса доступности с выбранного контакта на значок контакта, который находится под вашим пальцем в момент выполнения жеста. В результате, вы позвоните не тому, кому собирались. Во-вторых, вы можете делать двойной тап с проведением в сторону не только на значках контактов, но и непосредственно на имени, что для незрячего пользователя гораздо удобнее.

Повторяем последний вызов.

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

Выносим ярлыки частых контактов главный экран.

Существует 2 способа вынести ярлык контакта на главный экран. Первый добавляет на главный экран ярлык контакта, т.е. при его активации будет открываться визитная карточка контакта, и вам будут доступны все действия с контактом, как если бы вы открыли его непосредственно в приложении. Этот способ может быть актуален в том случае, если у контакта несколько номеров и есть необходимость все время звонить на разные. Второй позволяет добавить на главный экран виджет быстрого вызова, таким образом будет вызываться заранее выбранный номер контакта. Этот способ актуален для контактов с одним номером или если вы звоните на какой-то из номеров контакта чаще, чем на остальные.

Рассмотрим первый способ. Чтобы вынести ярлык карточки контакта на главный экран, выберите нужный контакт и откройте его двойным тапом. В окне информации о контакте войдите в меню по кнопке "Другие параметры" в верхней части экрана или длительным нажатием на левую сенсорную кнопку внизу. В открывшемся меню выберите пункт "Добавить ярлык на главный экран". Ярлык будет создан на той странице главного экрана, которая была активна перед открытием приложения "Контакты". Если на этой странице нет свободного места, то ярлык будет создан на первом попавшемся свободном месте любой из страниц. Если все страницы главного экрана заняты, то будет создана новая страница, на которой и окажется ваш ярлык. Логика здесь такая же, как при размещении ярлыков приложений, так что она не должна вызвать ни каких затруднений.

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

Быстрый набор

Для начала предлагаю вам сделать небольшой и, на первый взгляд, казалось бы ненужный экскурс в историю функции быстрого набора, Давайте мысленно перенесемся с вами лет на 8-10 назад, когда в мире преобладали кнопочные телефоны, и попробуем вспомнить, как на них была устроена функция быстрого набора. Не стану утверждать, что все написанное ниже относится абсолютно ко всем телефонам того вренени, но в общем и целом картина была примерно такой: для назначения номера быстрого набора обычно было доступно 9, а иногда и 8 из 10 цифровых клавиш аппарата. Вызов заданного номера осуществлялся удержанием нужной кнопки в течении нескольких секунд. Запомнить какая кнопка за каким номером закреплена конечно реально, но вот насущной необходимости в этом не было, во всяком случае, не было ее у подавляющего числа пользователей мобильных телефонов.

С широким распространением в мире сенсорных устройств притерпели серьезные изменения и сценарии использования телефона, и методы взаимодействия с ним. Бывшие долгое время стандартом де факто джойстики и кнопки уходят в прошлое, а быстрый набор, которым и с кнопками-то почти никто не пользовался почему-то остается. Мало того, в Samsung вместо привычных 8 или 9 ячеек становится доступно целых 999. Зачем? Попробуем разобраться.

Как и многие другие фишки в приложениях Samsung, быстрый набор предельно прост и функционален. Чтобы им воспользоваться, достаточно ввести в окне номеронабирателя любую числовую комбинацию от 1 до 999, удержав палец на последней цифре. Если на введенную комбинацию уже назначен номер быстрого набора, то при удержании вызов начинается автоматически. Если номер быстрого набора на комбинацию еще не назначен, до приложение предложит выбрать нужный номер из списка контактов. Просмотреть уже назначенные номера, удалить существующие назначения, а также произвести новые можно в соответствующем диалоге, который вызывается из контекстного меню телефонного приложения активацией соответствующего пункта. Диалог предельно аскетичен. Ячейки поделены по 100 штук на страницу. Сама страница представляет собой прокручиваемый список, занимающий большую часть экрана. Над списком расположена панель перехода. На ней слева и справа кнопки для перехода на предыдущую и следующую страницу, а в середине информация о том, какой диапазон ячеек отображается в данный момент. Справа от каждой ячейки отображается закрепленный за ней контакт, а еще правее кнопка "Удалить". Если ячейка свободна, то справа от нее находится единственная кнопка "Добавить контакт".

Все в этой картине на первый взгляд выглядит просто прекрасно, но возникает резонный вопрос: каким образом лучше подбирать ячейки для контактов, чтобы это потом как-то запомнить? Естественно, в этом вопросе вас ограничивает только ваша фантазия. Я например вижу здесь 2 разных случая. Если вам нужно звонить с помощью быстрого набора на несколько основных номеров, то все предельно просто: вам подойдет диапазон от 1 до 9, а как вы распределите нужные вам номера - уже ваше дело. Порядок может быть произвольным, алфавитным, ну или рискните составить рейтинг ваших друзей и родственников по важности для вас. Второй случай сложнее. Часто приходится звонить на одни и те же номера, но номеров этих 10 или более. В этом случае одни из рассмотренных вариантов оказываются невозможными в принципе, а другие приближают задачу запоминания соответствия ячеек и номеров по сложности к запоминанию самих этих номеров. Здесь напрашиваются 2 более-менее логичных варианта: либо закреплять нужные номера за ячейками, соответствующими последним трем цифрам этих самых номеров, либо использовать соответствие первых двух-трех букв фамилии цифрам, на которых эти буквы располагались бы на цифровой клавиатуре телефона. Очевидно, что реализовав поддержку быстрого набора на 999 ячеек, Samsung намекает нам именно на такой вариант использования этой фишки. К тому же, на это нам намекает и еще одна ценнейшая, на мой взгляд, функция. Поговорим об этом в следующем разделе.

Дополнительные возможности Поиска по контактам в окне номеронабирателя.

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

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

Если вы помните последние 3-4 цифры номера человека, которому хотите позвонить, то просто введите их. В этом случае совпадение при поиске почти всегда будет стопроцентным. Для звонка вам останется только нажать на подсказку вверху экрана и кнопку вызова.

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

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

Секрет. Доступ к контактам телефонного справочника или электронной книги.

Чтобы не искать контакт, который вы используете больше всего.

Действия:

1. Продолжительным нажатием на свободном месте рабочего стола, вызываем контекстное меню (в зависимости от версии андроид либо внизу экрана либо сразу над пальцем), в котором выбираем "Добавить ярлык"(add shortcut – часто бывает, что в неоригинальной версии данная фраза на английском).

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

Если необходимо часто писать СМС сообщение, для определённого абонента, то необходимо при настройке ярлыка выбирать "Контакт" или написать СМС.

Теперь вы овладели одним из секретов Андроид ОС и способны мобильно набирать нужных вам абонентов. Стандартный способ добавление номеров в избранное и использование 10 номеров быстрого вызова известный и не представляют большого интереса у пользователей Андроид устройств, потому для доступа к клавиатуре необходимо еще трижды нажать по экрану. А в этом случае на главном экране у вас сразу после разблокировки будут необходимы номера и приложения.

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

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

Почему человеку вообще пришла в голову идея использовать значки, вместо слов?

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

Почему мы так любим значки?

Потому что у них есть ряд преимуществ:

  • Они бросаются в глаза;
  • Они быстро передают информацию;
  • Они запоминаются;
  • Они экономят место;
  • Они понятны на любом языке.

Иконки интерфейсов имеют еще ряд преимуществ:

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

Но главное, чем должна обладать любая иконка — это ЯСНОСТЬ .
Если пользователь не поймет значение иконки, он либо будет ее избегать, либо путаться.

С мороженым — нельзя, с сигаретой — нельзя, с единорогом — можно

Чтобы решить проблему с ясностью иконки, можно пойти несколькими путями:

1. Объяснять новую иконку текстом, давать подсказки, учить юзера использовать ее правильно

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

Сегодня иконку отправки личных сообщений поменяли на более ясную.

Поэтому рассмотрим 2-ой вариант.

2. Бороться за ясность, создавать иконки максимально понятные пользователю
И именно о том, как это сделать и не ошибиться в выборе, пойдет речь далее.

Почему иконки интерфейсов не всегда понятны пользователям?
Давайте разбираться в причинах.

10 ошибок в дизайне иконок интерфейсов

1. Неточность дизайна образа иконки

Для начала проведем небольшой тест.

Это как раз и есть пример иконки, которую нельзя однозначно интерпретировать, а значит она может вызвать недоумение у пользователя.

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

Ответ клиента был таков: «Мне не совсем понятно, почему вы нарисовали иконку фильтра в виде бокала для мартини!» 🙂

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

2. Неясность ассоциации

В отличие от первой причины, в этом случае обычно сам образ передан правильно, но пользователю не ясно, почему использована именно эта иконка и что она означает.
Посмотрите еще раз на пример со старой иконкой для отправки личных сообщений в Instagram. Образ вполне уловим — изображен ящик. Но с чем у вас ассоциируется ящик? Сохранить? Входящие? Добавить новый файл? Ассоциация слишком тонкая, пользователю нужно думать, значит образ подобран неудачно.

Вот еще один наглядный пример того, как меня запутал интерфейс.

Как потом выяснилось, при наведении курсора на иконку всплывает подсказка.

Гораздо яснее для пользователя в этом случае был бы образ мусорного бака.
Кроме того, здесь интерфейс позволяет разместить слова “Удалить аккаунт”, и в этом случае использование текста вместо иконки выглядело бы оправдано.
Вот еще один пример, когда возникает диссонанс значения иконки и ее образа:

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

С одной стороны, иконки в интерфейсе должны подходить по стилю и смотреться целостно и гармонично, чтобы не получилось вот так:

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

Вот еще один пример:

4. Не учтен предыдущий пользовательский опыт

Вы помните, как в Viber при отправке сообщения рядом висела иконка с изображением стрелки?

Многие новые пользователи путались, считая, что стрела имеет значение “Отправить сообщение”. Почему? Потому что многие новые пользователи пришли в Viber из Skype и других мессенджеров, где стрелка означала именно отправку сообщения и располагалась в том же месте.

Стрела в интерфейсе Viber означала отправку данных геолокации. Не удивительно, почему все мои друзья в то время были в курсе, где я;)
Сейчас интерфейс Viber выглядит иначе:

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

5. Не учтены ментальные особенности ЦА

Некоторые значки могут по-разному интерпретироваться в разных странах.
Подобно тому, как в разных странах неоднозначно воспринимаются жесты, также неоднозначно могут быть поняты иконки.

Если вы создаете универсальное приложение, ориентированное на многие страны, то используйте более универсальные иконки.

Хотя, признаться, их не так уж и много. Сейчас среди них можно назвать изображение принтера (печать), дома (возврат на главную страницу), лупы (поиск) и практически все. Иконка, обозначающая меню-гамбургер , вскоре тоже может стать универсальной. Однако, некоторые тесты показывают, что пользователям привычнее видеть кнопку с надписью “Menu”, чем 3 горизонтальные полоски.

Если ваше приложение ориентировано на целевую аудиторию конкретной страны, учитывайте ее особенности восприятия.
Так, например, для жителей США более привычной будет иконка с тележкой супермаркета (shopping cart ) для обозначения покупки ( ).

Для жителей Великобритании в пользовательском интерфейсе привычнее видеть корзину (basket ) или сумку (bag ).

6. Неправильный посыл

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

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

7. Устаревшие образы

Здесь нужно быть предельно аккуратным. Иконки стареют, как и люди.

Поймет ли новое поколение эту иконку, если оно никогда не держало дискету в руках?

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

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

Приглядитесь к иконке, которая используется в Твиттере для написания нового твита. Иконке придали форму гусиного пера, чтобы передать смысл “Кликни сюда и ты сможешь писать”.

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

8. Перегруженный дизайн

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

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

9. Использование текста или его отсутствие

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

10. Скалирование иконок

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

Поэтому всегда просите дизайнера прорисовывать элементы вручную при создании новых размеров.

Выводы

Почему мы выделили именно эти 10 ошибок, а остальные, не менее важные оставили без внимания? Потому что эти ошибки влияют на ЯСНОСТЬ иконки, вызывают недоумение, запутывают пользователей и могут повлиять на конверсию.
Как видите из примеров, одна лишь неверно подобранная иконка может заставить пользователя удалить аккаунт, отказаться от покупки или от использования неудобного приложения.
Так что, выбирайте правильные иконки и лучше доверьте это



Есть вопросы?

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: