С чего начинается разработка приложения
Основные шаги в разработке приложений для новичков
В этой теме я постараюсь максимально точно объяснить основные шаги в разработке мобильных приложений. Итак, начнем:
1. Первым делом выберите платформу, на которое будет создаваться Ваше приложение. Существует несколько ведущих мобильных ОС:
iOS – платежеспособная, активная аудитория пользователей. Попробуйте начать свою разработку с этой платформы, если хотите сделать свое приложение платным.
Android – большая и растущая аудитория. К сожалению, пользователи Android не столь активны и очень редко платят за приложения. Этот вариант подойдет Вам, если Вы собираетесь сделать свое приложение бесплатным для скачивания.
Windows Phone — не советую брать, из-за маленькой аудитории и неплатежеспособной аудитории. Но если же Вы решили брать ее, то попробуйте, может быть Ваше приложение станет популярным именно в этой платформе.
2. Выберите устройство, на которое Вы будете опираться при разработке приложений: смартфон или планшет. Несмотря на одинаковую операционную систему, это абсолютно разные устройства и их сценарий использования совершенно разный.
По статистике, за 2012 год, в России количество устройств iPhone составило 3 000 000, а iPad 700 000. При этом 50% устройств iPhone приходилось на Москву и
20% на Санкт Петербург.
Что касается Android, количество устройств в России на данной ОС составило 5 000 000. Это намного больше, чем у компании Apple, по причине того, что устройства на Android более доступны.
3. Купите смартфон, замените им свой привычный телефон. У каждого устройства своя экосистема, поэтому если Вы планируете разрабатывать приложение для iOS, купите устройство именно с этой операционной системой. То же самое касается и Android.
4. Когда Вы определились с платформой и устройством, начните свое проектирование с брифа. Определитесь с Вашими бизнес-целями:
— продажи или поиск новых клиентов
— поддержка бизнес процессов
— имидж и продвижение бренда
Попробуйте вообразить идеальный результат через год. Обязательно запишите все задачи в бриф.
По статистике Google от 2007 года, пользователи пользуются своими смартфонами в 3 случаях:
— Если им скучно (метро, пробки, ожидание друзей и т.п.)
— Если им срочно (купить билет, заказать еду, найти место и т.д.)
— Повторяющийся сценарий потребления информации (котировки акций, скидки, погода и т.д.)
Постарайтесь думать в этих 3 ключах: какую потребность пользователя Вы пытаетесь удовлетворить своим приложением, какие задачи пользователь решает через Ваше приложение, выберите 1-2 самые главные задачи и обязательно запишите эти задачи в бриф.
5. После того как Вы закончили с брифом, приступаем к проектированию интерфейса приложения. Используйте навигационную схему, она нужна для того, чтобы Вы поняли общую массу функционала, экранов и как пользователь сможет между ними переходить. (см. рисунок ниже)
6. Следующий момент в проектировании приложения – это концепция дизайна. Она включает в себя 1 главный экран приложения, также, если у Вас есть второстепенные экраны, их можно не отрисовывать в концепции. Достаточно отрисовать самый главный экран приложения и в дальнейшем опираться на него, когда Вы будете работать над дизайном.
7. После отрисовки концепции, отрисуйте отдельно каждый экран Вашего приложения. Как было сказано выше, опирайтесь на концепцию.
8. Переходим к самому главному, к непосредственной разработке Вашего приложения. Я рекомендую разрабатывать мобильные приложения исключительно итеративно, итерациями в 1-2 недели, потому что ни навигационная система, ни концепция дизайна не передает всех особенностей взаимодействия пользователя с приложением. Очень много значений имеют анимации, переходы в интерфейсе приложения, скорость работы приложения. Постарайтесь начать разработку с основных функций, сделайте рабочие сборки, и тестируйте приложение с самого начала, потому что если Вы поймете, что что-то идет не так, Вы можете все изменить.
9. После того, как Вы закончили с разработкой, поняли, что приложение полностью решает свои задачи, самое время приступить к тестированию. Тестирование приложения очень важно, потому что, если приложение будет работать неправильно, Вы получите много негативных отзывов, а это скажется на количестве постановок на конверсии в дальнейшем. При этом приложение нужно тестировать на всей массе устройств, которое может быть у пользователя. Например, если Вы разработали приложение на iPhone, протестируйте его также на iPhone 3GS, iPhone 4, iPhone 4s, iPhone 5, iPod touch. Обязательно тестируйте обновления, всегда следует помнить о том, как поведет себя приложение на устройстве пользователя при обновлении с предыдущей версии на следующую. Проверьте Ваше приложение на пользователях (тестерах), прежде чем выпускать его в свет.
10. При заказе приложения или при самостоятельной разработке, задумывайтесь о встраивании системы аналитики. Используйте Google Analytics или Flurry. Это даст Вам большую пользу и Вы сможете посмотреть сколько пользователей установили Ваше приложение, сколько пользователей им пользуется, сколько из них новых, как часто они его используют, узнаете какие экраны популярны и т.д. Это даст Вам отличную статистику для анализа Вашего приложения и поможет понять, что нужно делать с приложением дальше и позволит его улучшить.
На этом все, все основные шаги я расписал, и в конце хотелось бы добавить, чтобы Вы не забыли про обратную связь, чтобы пользователи смогли сообщить Вам о недоработке Вашего приложения.
Этапы создания мобильного приложения: проектирование, дизайн и разработка
Практическое руководство от команды студии мобильной разработки Winfox для тех, кто начинает делать свое приложение.
Что именно входит в создание приложения? Вопрос, который нам чаще всего задают клиенты. Они хотят знать, сколько денег и времени от них потребуется, как строится работа, с чего начать и как в результате заработать, а не потерять.
Этот важный вопрос, на который нельзя ответить в двух словах, вдохновил нас на публикацию этого цикла статей. В них не будет туманных советов из серии «как сделать приложение: три простых шага». Зато будет опыт, накопленный нами за пять с лишним лет работы на рынке мобильной разработки, примеры из практики и руководство к действию.
В предыдущих материалах мы рассказывали:
Сейчас поговорим о том, что включают в себя три следующих этапа разработки приложения: проектирование, дизайн и разработка.
Здесь наша работа делится на два направления: UX-дизайн, то есть проектирование, и UI-дизайн, то есть дизайн привычном понимании.
UX-дизайн направлен на повышение уровня удовлетворенности клиентов. На этом этапе мы упаковываем сложные процессы в максимально простое, понятное и полезное приложение, которое работает без глюков и багов.
UI-дизайн определяет то, как будет выглядеть приложение, каким будет его пользовательский интерфейс.
Иногда заказчик говорит: «А давайте не будем тратить время на проектирование и сразу займемся дизайном?». Не делайте так. Допустим, мы исключили проектирование и сделали дизайн. Посмотрели его, и у вас появилась куча идей, как все улучшить. Мы вносим правки и перерисовываем дизайн. Трудозатраты и стоимость проекта вырастают в два раза, а скорость работы вдвое снижается. Дизайнер выгорает, а вы как заказчик недовольны, что проект стал дороже. Все в минусе.
UX-дизайнер продумывает взаимодействие между элементами дизайна, чтобы увидеть, как приложение работает при всех распространенных пользовательских сценариях. Как проходит регистрация и авторизация, как выглядит начальный экран и личный кабинет, как происходит оформление заказа и оплата покупки. Мы проверяем логику приложения и корректируем ее, чтобы сделать пользовательский опыт максимально положительным. В результате получаем прототип — схематичную модель будущего приложения.
Проектирование особенно важно для проектов с большой долей неопределенности. Например, для стартапов.
UX-дизайн — это непрерывный процесс. При выпуске каждого обновления вы должны помнить, как люди используют ваше приложение. Если после обновления пользователям стало не так удобно совершать покупки или им надо сделать больше кликов, чтобы попасть в личный кабинет, значит, вы отклоняетесь от курса и пора поработать над UX-дизайном.
Лучше делать интерактивный прототип, например, в Figma. Перейдя по ссылке, можно пользоваться приложением так, будто оно уже готово и установлено на ваш смартфон. Вы можете перемещаться по разделам, нажимать на кнопки и выполнять различные действия.
Такой прототип полезен как на этапе проектирования, так и для заказчика. В первом случае он помогает выявить несоответствия в сценариях и быстро их исправить. Во втором случае заказчику не придется на словах объяснять, для чего нужен сервис и как он будет работать. Можно просто показать все на интерактивном прототипе, благодаря чему шансы быстро найти инвестора и реализовать проект возрастают.
UI-дизайнер отвечает за внешний вид будущего приложения. Он подбирает шрифты, выбирает цветовое решение, отрисовывает элементы интерфейса: кнопки, иконки, слайдеры, пуш-уведомления.
Если у заказчика есть корпоративный стиль, мы берем гайдлайн и делаем дизайн по нему. Если стиля нет, предлагаем свое видение с учетом трендов, специфики бизнеса и аудитории. В любом случае мы всегда рекомендуем работать по гайдлайнам от Apple и Google.
В зависимости от масштаба проекта дизайн может занять одну неделю или несколько месяцев.
Программирование — один из главных этапов. Написание кода любого приложения делится на фронтенд и бэкенд.
На этапе фронтенда разрабатывают клиентскую часть сервиса, то есть интерфейс пользователя и бизнес-логику приложения.
На этапе бэкенда разрабатывают серверную часть приложения — она отвечает за передачу данных между пользователями или ресурсами.
Что в результате: первый релиз приложения.
Есть множество подходов к разработке интерфейса. Но вам как заказчику не нужно в них углубляться. Достаточно знать два основных.
Нативные приложения написаны для конкретной мобильной платформы: iOS, Android, Windows. Язык программирования, который используется для написания таких сервисов, поддерживается только одной платформой. Например, Swift и Objective-C понимает только iOS, а Java или Kotlin — только Android.
Делайте нативное приложение, если оно должно стать важной частью бизнеса и влиять на продажи.
Нативное приложение может максимально использовать аппаратные и функциональные возможности смартфона или планшета, благодаря чему им очень удобно пользоваться. Но вместе с тем можно использовать оригинальные компоненты и шаблоны.
Плюсы нативных приложений:
Минусы нативных приложений:
При создании таких приложений используются общие наборы средств разработки (SDK). Из-за этого кроссплатформенные сервисы не используют все нативные преимущества каждой платформы. Зато сделать такое приложение дешевле — это оптимальный вариант для проектов с ограниченным бюджетом.
Делайте кроссплатформенное приложение, если нужно быстро проверить гипотезу или протестировать новый продукт.
Плюсы кроссплатформенных приложений:
Минусы кроссплатформенных приложений:
Исходите из своих бизнес-целей и ответьте на следующие вопросы:
Главное отличие между нативным и кроссплатформенным приложением — в скорости и отзывчивости работы. Это как проехаться на Porsche Cayenne и Hyundai Solaris. Оба авто едут по дороге, разгоняются, маневрируют и входят в повороты. Но разница чувствуется сразу.
После того, как вы определились, какое приложение будете делать — нативное или кроссплатформенное — надо разобраться с серверной частью.
Любое приложение отображает данные: показывает, какие товары есть в наличии в интернет-магазине, сколько запасов лежит на складе и кто из контрагентов должен вам денег. Все эти данные хранятся на сервере. Чтобы создать сервер, который эффективно обменивается данными с внешним интерфейсом приложения, надо его тщательно продумать.
На этапе бэкенда участие заказчика минимальное. Вам не надо думать, где хранить данные и нужно ли использовать бессерверную архитектуру — это решают разработчики. Мы в WINFOX всегда выбираем оптимальные для клиента решения. Единственное исключение — это когда надо вписать приложение в уже существующую среду. Тогда вы можете сказать: «Делайте на PHP, а не на Java».
UX-дизайн направлен на повышение уровня удовлетворенности клиентов. На этом этапе мы упаковываем сложные процессы в максимально простое, понятное и полезное приложение, которое работает без глюков и багов.
UI-дизайн определяет то, как будет выглядеть приложение, каким будет его пользовательский интерфейс.На этапе фронтенда разрабатывают клиентскую часть сервиса, то есть интерфейс пользователя и бизнес-логику приложения.
На этапе бэкенда разрабатывают серверную часть приложения — она отвечает за передачу данных между пользователями или ресурсами.
Делайте нативное приложение, если оно должно стать важной частью бизнеса и влиять на продажи.
Делайте кроссплатформенное приложение, если нужно быстро проверить гипотезу или протестировать новый продукт.
В следующий раз мы расскажем, что вам нужно знать про тестирование, стабилизацию и публикацию приложения в сторах.
Этот цикл статей основан на книге, которую мы недавно сделали для своих клиентов. В этой книге мы постарались ответить на основные вопросы, которые у них возникают:
Остались вопросы? Не согласны с нами? Хотите высказать свою точку зрения или поделиться опытом? Пишите в комментариях. Давайте обсуждать!
Разработка мобильных приложений: с чего начать
В нашей работе мы проходим все стадии жизненного цикла создания мобильного приложения, и я бы хотел поделиться нашим опытом в этой сфере. Под катом — рассказ об основах мобильной разработки: от выбора платформы до создания, размещения в магазине и последующего мониторинга.
Тенденции
Чем пользуются владельцы мобильных телефонов?
Статистика
За 2012 год в РФ продано порядка 12,6 миллионов смартфонов: Россия считается одной из быстроразвивающихся в этом плане стран.
Если взглянуть на такой же график по всему миру, то увидим, что и тут Android в авангарде с ¾ рынка.
За второй квартал 2012 года по всему миру было продано 104 миллиона телефонов Android — как население довольно крупной страны. Но нас как мобильных разработчиков интересует не только наличие смартфона, но и то, как с ним работают. Существенная доля обладателей устройств на Android пользуется ими как обычными телефонами: SMS, звонки — и все. Они не активируют устройство в Google Play, не скачивают приложения.
Не все люди обзавелись телефонами в 2012 году, поэтому реальное распределение сил среди мобильных операционных систем демонстрирует наша внутренняя статистика. В эту статистику входят Россия и страны СНГ: Украина, Белоруссия, Казахстан, Узбекистан.
Установка приложений
При выборе платформы, под которую будет разрабатываться приложение, важно знать статистику по уже существующим приложениям. Графики исследовательской компании App Annie от сентября 2012 года показывают, как растут два конкурирующих магазина Apple и Google.
По количеству скачиваний на первом месте Google Play: больше устройств, больше скачиваний, больше трафика и рост при этом +66% по сравнению с январем 2012 года. Рост iOS оказался в два раза меньше, порядка 30%. Но главный график – какую выручку приносят пользователи. И здесь ситуация в корне иная. Проще зарабатывать на iOS, но деньги есть и в Google Play, если уметь их забирать.
Типы мобильных приложений
На практике можно разделить приложения для мобильных устройств на три типа.
Мобильные сайты, веб-приложения
Это самый распространенный тип приложений для мобильных устройств. Современные смартфоны в состоянии отобразить обычный сайт. Им доступно все то, что мы привыкли видеть в десктопных приложениях — поддержка HTML5 делает свое дело. Помните, что веб-приложения отлично подходят для стартапа: именно они позволяют получить большой результат за маленькие деньги и за небольшой срок. Еще один плюс мобильного сайта по сравнению с другими мобильными приложениями – это кроссплатформенность. Однако есть и минус, притом весомый: с ними достаточно сложно заработать.
При таком подходе вы получаете доступ ко всем плюсам API операционной системы: приложение обрастает push-уведомлениями и другими приятными плюшками, кроме того, теперь ваш продукт можно размещать в сторах. При этом основной контент все еще представляет собой платформонезависимую страничку с версткой, размещенную на сервере. Это позволяет вносить косметические изменения в продукт без выпуска новой версии: достаточно залить изменения на сервер. Гибридные приложения – отличное решение для тех, кто начинает бизнес или хочет проверить свою идею, показать ее инвестору, друзьям.
Этот вид приложений самый ресурсоемкий, но вместе с этим он позволяет по максимуму использовать возможности, предлагаемые каждой конкретной операционной системой. Как следствие, нативные приложения выигрывают как по функционалу, так и по скорости работы у других типов мобильных приложений. Именно к такому подходу сейчас приходят те компании, которые делали комбинированные приложения. Например, Facebook начинала с комбинированного приложения: нативные контролы (переключатели, вкладки и так далее) и веб-страница в качестве контента. Несмотря на то, что это неплохое решение, проблемы с производительностью приводят к тому, что разработчики отходят от комбинации с вебом.
Статистика
Приведу статистику скачиваний на примере наших мессенджеров.
Во-первых, у нас есть приложение ICQ, которое постоянно развивается: среди последних изменений стоит отметить аудиозвонки. Второй мессенджер Mail.Ru Group – Агент. В Агенте реализован примерно тот же функционал, и, хотя у него была немного другая история развития, мы выпускаем версии практически под все платформы и его можно найти в любом сторе.
Основная разница между двумя этими приложениями – это их аудитория. ICQ – это международный продукт. Программа скачивается не только в России, им активно пользуются жители Европы, Латинской Америки. Агент же изначально делался в России и для русскоязычных пользователей.
Тем интереснее сравнить статистику скачиваний из магазинов.
Большая часть 62% иностранной аудитории идет в Google Play. Примерно 1/5 идет в AppStore, 14% — в Ovi Store. И уже оставшиеся 5% делят магазины для платформ Windows Phone (4%) и Samsung Bada (1%). С Агентом ситуация в корне другая: доли Google Play и Ovi примерно одинаковые. Ну а 10% AppStore наглядно демонстрируют любовь к «яблочной» продукции в нашей стране.
Процесс создания мобильного приложения
Итак, перейдем к самому вкусному: процессу разработки мобильного приложения.
Прежде всего, необходимо определить, что и для кого мы пишем. Ответы на эти вопросы оформляются в User Story. На картинке вы можете посмотреть на реальный тикет в нашем трекере. Он описывает, как существующий пользователь ICQ может войти в приложение, и какие проблемы он может встретить. На этом этапе важно проработать все возможные сценарии, чтобы не было неприятных сюрпризов на более поздних этапах разработки.
Важно понимать, что за каждым пунктом в вашем to-do листе скрывается огромный айсберг функционала. Старайтесь фрагментировать и конкретизировать задачи. Крупные хотелки лучше всего разделить на несколько этапов (релизов в стор). Однако это тема отдельной дискусии, вернемся к этапам создания приложения.
Проектирование и дизайн
После составления User Story начинается проектирование и разработка дизайна.
На этом этапе мы используем прототипы, которые мы вешаем на доску и стрелочками показываем, как будет происходит навигация.
При разработке дизайна обязательно используются гайдлайны.
Гайдлайн в общем понимании – это документ, который выпускает компания, и по которому дизайнеры и разработчики понимают принцип построения взаимодействия приложения с пользователем. Условно говоря, для iOS кнопки надо делать круглыми, а для Windows Phone – квадратными. Однако мы используем и внутренние гайдлайны для разработчиков. Таким образом результат работы дизайнера чаще всего состоит из макетов, гайдлайнов и нарезки графики.
Макеты лучше всего подавать «перелинкованными», например с помощью ProtoTypr, чтобы была понятна логика переходов. Гайдлайны содержат в себе информацию об отступах, размерах, визуальных эффектах, механике анимации и пр. Этот этап можно пропустить, если в вашем проекте один дизайнер и один разработчик, сидящие рядом друг с другом. Третья часть результата — нарезка графики — должна содержать минимум необходимых графических ресурсов (заботимся о весе приложения), иметь версии для разных разрешений экранов. Чаще всего мы рисуем для ретины и xhdpi-экранов. Далее идет подготовка для неретины и mdpi автоматизированными средствами (если допустимо их использование). Чаще всего руками приходится готовить hdpi-ресурсы.
Передача в разработку. Обсуждение и необходимые правки описания
После получения макетов, гайдлайна и нарезки, начинается работа разработчика. Мы передаем в разработку все то, что придумали, и ожидаем ранний результат. Это не значит, что работа над архитектурой и пользовательским интерфейсом закончена. Иногда у разработчиков появляются интересные идеи, которые вносят коррективы в изначальный план. Когда разработка завершена, наступает стадия тестирования.
Существует немалое количество способов протестировать приложение.
В мобильной разработке тестировщик – это человек, вокруг которого одни телефоны. У нас есть огромный шкаф, в котором лежат как старые телефоны, так и самые свежие новинки. Внутри мы стараемся тестировать по тест-кейсам. Если внедряется новая фича, по ее описанию составляется тест-план.
Существуют сервисы, помогающие в тестировании. Мы используем HockeyApp – приложение, позволяющее раздавать наш продукт бета-тестерам. Мы пишем в социальных сетях: «Ребята, у нас новое крутое приложение. Кто хочет попробовать?» Желающие получают билд, пользуются приложением, а сервис собирает статистику, составляет креш-репорт и отправляет все это нам.
Также есть сервисы, позволяющие протестировать приложение на разных операционных системах — например, все Android-прошивки версии 2.1 или 2.3. Вы отдаете приложение, сервис скриншотит весь путь, который вы задали, присылает картинки вам на почту, и вы проверяете, все ли в порядке.
Итак, вы разработали, протестировали приложение, залили его в стор. Для отслеживания статистики скачиваний можно использовать сервис Distimo. Он показывает статистику по пользователям, которые приходят в стор, чтобы скачать приложения, и агрегирует комментарии.
Важно понимать, что люди более склонны оставлять негативные комментарии. Если у человека все хорошо, он чаще всего просто пользуется приложением, не комментируя. При стабильной работе наших приложений мы получаем 40-50 комментариев ежедневно. В день ошибки количество записей может доходить до 400 на одной платформе. Поэтому имейте в виду, что комментарии – это не полная оценка вашей работы, скорее еще один баг-трекер.
Изменить ситуацию может довольно распространенных «хак» — окно Rate Us. С предложением оставить положительный комментарий в сторе, а в случае проблем написать разработчику. Эффект достаточно сильный, главное — правильно продумать алгоритм показывания диалога юзеру.
Помимо комментариев Distimo показывает количество скачиваний, заработанные деньги, а также откуда скачивают ваши приложения.
Еще один интересный мониторинговый сервис – Flurry. Он помогает собирать клиентскую статистику. Flurry предоставляет отчет о том, что делает пользователь в вашем приложении: сколько раз он нажал на кнопку, сколько раз возвращался в приложение и более общие параметры — аудитория, география, пол, возраст и пр.
В некоторых мобильных продуктах мы также используем подсчет клиентской статистики с помощью Google Analytics. Разницы при сравнении с Flurry нет практически никакой. Минусы в скорости работы и обработки логов есть в обоих случаях, однако, если вы привыкли работать с гугловским интерфейсом, можете использовать этот инструмент.
Несмотря на большое количество сторонних сервисов, у нас есть собственная статистика. Какими бы хорошими не были внешние источники, их нужно проверять. Мы способны сами оценивать статистику, но для этого необходимо строить инфраструктуру для генерации отчетов, еженедельной отправки отчетов по email и других вещей, упрощающих жизнь. Поэтому нам проще использовать такие сервисы, как Flurry и Distimo, а к внутренним логам обращаться при возникновении вопросов. Наша практика показывает, что такой подход оправдан: периодически наши данные и данные сервисов несколько разнятся. Если вы склонны проверять статистику, используйте разные источники.
Специфика
Заключение
Я постарался рассказать вам о базовых особенностях и подводных камнях мобильной разработки, которые встречались нам на нашем пути. Надеюсь, пост оказалась вам полезным. Если у вас остались вопросы по теме, или вы знаете что-то, что может быть полезно нам, давайте обсудим это в комментариях.