Два правила хорошей иконки iPhone приложения

    Иконка iOs приложения это ваш самый первый визуальный контакт с пользователем. Где бы он не нашел приложение в топе, в поиске, по ссылке на AppStore, вначале он обратит внимание на иконку приложения. И часто именно от нее зависит пойдет ли он мимо или на страницу с подробностями.

    Из этого следует два простых правила. Я попробую продемонстрировать их на наглядных примерах.





    Первое правило: иконка должна быть красивой


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

    Стоит ли ожидать превосходного интерфейса и функционала от приложений с такими иконками?


    А с такими?



    Сделать красивую иконку очень просто, достаточно нанять дизайнера :) и самому отслеживать хорошие приложения в AppStore.

    Второе правило: иконка должна выделяться


    Взглянем на небольшую выборку из платного топа Social Networking:


    Когда я смотрю на это у меня в голове пульсируют буквы WTF?! :) Как пользователь должен выбрать из этого многообразия? Где приложение для аудио, где для видео, где более быстрый клиент?

    Что если поставить себе все пять, как отличить одно приложение от другого на экране iPhone?

    Если вы хотите, чтобы ваше приложение скачали — выделяйтесь. Выделяйтесь в своей категории, выделяйтесь в общем топе.

    В отличие от красоты иконки второе правило проверить очень просто. Возьмите свою будущую иконку и «примерьте» ее в топе нужно категории, в общем топе и на экране iTunes. Эспериментируйте с цветом и формой, пока иконка не станет самой заметной.

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



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

    Удачи вам с приложениями и побольше хороших иконок! ;)

    BTW. Мы ищем C# разработчиков для создания качественных мобильных приложений.

    UPD. А покажите свои иконки, если есть.</b.
    Touch Instinct
    83.01
    Разрабатываем мобильные приложения
    Share post

    Comments 40

      +4
      Надо еще добавить, что глянец уже приелся и в большинстве своем смотрится уродливо. Лучше его отключать.

      ЗЫ смотрим удачный пример иконки чуть выше и левее=)
        +1
        Про глянец абсолютно согласен. Он приглушает цвета иконки и смотрится не так сочно.
          +1
          А как бы вы обозначили «более быстрый клиент» на иконке? Пририсовали ветер?
            –3
            Я ни разу не дизайнер. Но да, достаточно показать движение буквы характерным размытием.
        +27
        Третье правило: сделайте действительно хорошее приложение.
          +4
          по-моему лягушка больше всего внимание привлекает
            0
            спасибо, это мы тестируем иконку :)
              +3
              Ее просто больше всего на скринах )) Точнее, есть на каждом, и не захочешь — примелькается.
              0
              Не очень хорошо, что справа, на рабочем столе, твоя иконка только в верхнем ряду показывается. Сложно оценить заметность, зная где она.
                0
                Сделать красивую иконку очень просто, достаточно нанять дизайнера :)

                А вы какого дизайнера наняли? У него портфолио есть?
                  0
                  У нас штатный :) Мы же аутсорсеры.
                  +1
                  Чувствуется, что затеяли все ради лягушки, так вот она на фоне булыжной мостовой (вверху справа) фоном своим теряется. Рамочку бы ей, что ли?

                  Кстати, на тех же скринах есть иконка Одноклассников — не знаю чем, но нравится она очень и очень. Куда сильнее лягушки, уж извините ))
                    0
                    Лягушка попала на все скрины по принципу «последняя в Downloads» я скрины делал в своем же сервисе :)

                    С иконкой одноклассников соглашусь, очень качественная работа.
                    +1
                    Меня вот раздражает что иконки сильно отличаются друг от друга.
                    У одних есть рамка, у других нету. А на андройде вообще страх. Они мало того что с рамкой/без, так еще и разных размеров и формы. Квадратные, с закруглёнными углами, прямоугольные. Поменьше, побольше.
                      0
                      Все очень просто. Напишите свою мобильную ОС
                        0
                        … свой автомобиль, свой ресторан, молоток, ноутбук…
                      +1
                      Вам надо развить ваш сервис.

                      1. После заливки иконки, пользователю дается ссылка на тестирование его иконки.

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

                      3. Сделать возможность изменения фонового изображения.
                        0
                        спасибо за идеи, в будущем попробуем. Что имеется ввиду под изменением фонового изображения?
                          0
                          Видимо, замена кирпичиков на что-то своё. Или просто выбор из нескольких вариантов. Например, можно сделать листалку из нескольких стандартных айфонных обоев.
                        0
                        BTW. Мы ищем C# разработчиков для создания качественных мобильных приложений.
                        Почему именно в офис?
                          0
                          У нас так принято. Если вы крутой и умеете работать удаленно — пишите.
                          0
                          Да. Скайп и фейсбук вот выехали исключительно на иконках. Думаю тут как с мужской красотой
                            0
                            Иногда возникает мысль, что пользователи iOS покупают не сами приложения, а их иконки.
                              0
                              Часто так и бывает. Если приложение платное, многих не волнует что с ним происходит после закачки. Деньги уже заплачены :)
                              +1
                              А отчего бы и не показать:


                              А вот эту нарисовал для нас легендарный Турбомилк:


                              Еще? ;)
                                0
                                P.S. Читал вчера о иконочном сервисе авторов топика на известном мифическом блоге. Мир тесен ;)
                                  0
                                  А можно ваши цены и рисуете ли вы иконки для Android тоже? :)
                                    0
                                    Верхняя мне нравиттся больше :) А так иконки — супер.
                                    0
                                    image
                                    А вот я щас такую дорисовываю)
                                      +1
                                      картинка пропала
                                        –1
                                        image
                                        Видать маленький сервер не выдержал хабраэффекта) Переложил на фотохостинг)
                                          0
                                          супер! Но я бы упростил фон, гадальный шар теряется. Хотя я не дизайнер ни разу :)
                                            –1
                                            кстати спасибо за реально полезный сервис по тестированию иконок))
                                            залил туда эту — смотрится симпатично)

                                            а то всегда было как-то лениво брать скриншот айфона и вставлять туда иконку для показа заказчику)
                                      0
                                      image — публикуется

                                      image
                                      image
                                      image
                                        0
                                        первые две хорошо. Вторые мне не вообще не нравятся (и это не из-за блика :).

                                        А что делают последние приложения?
                                        0
                                        Да, мы над ними тоже сейчас работаем немного — планируем делать полный редизайн со следующим апдейтом.

                                        Приложения сейчас довольно простые:
                                        — первое предоставляет информацию по актуальным курсам валют и позволяет их перегонять друг в друга. В скором времени будет обвязано с нашим новым серверным роботом и станет куда вкуснее)
                                        — второе, приложение для «коллекционеров». Позволяет хранить оцифрованные версии ваших коллекций, и в следующем мажорном апдейте будет обвязано с социальными сетями, в минорном пока есть много работы над юзабилити
                                          0
                                          Хороший сервис. А как на счет iPad? Хотелось бы и для него экраны.
                                            0
                                            Надо апдейт под новый магазин iOS 6 еще запилить. Вот готовый GUI App Store dribbble.com/shots/761351-IOS-6-GUI-Itunes-App-Store-2x для фотошопа.
                                            И надо сделать функцию «не хранить иконку».
                                              0
                                              поддерживаю по обоим пунктам
                                              0

                                              Only users with full accounts can post comments. Log in, please.