понедельник, 2 января 2012 г.

Пять месяцев разработки Android-приложения в словах и картинках от и до

Статья которая была опубликована на Хабре.


Перед началом работы над собственным проектом я почитал книжку по Java и посмотрел туториалы на YouTube, просто чтобы вспомнить основные операторы. В начале мне приходилось искать в интернете описание цикла for. Знания существенно сокращают время на поиски решения, но всего знать вовсе не обязательно, если есть интернет. Книги по Android на русском — бестолковые, не тратьте деньги и время. Наверное, только переведенный «Android за 24 часа» содержит кое-что полезное. В ней есть примеры для тех, кто не придумал себе вообще никакую идею. Эта книга есть в интернете. Из других полезных ресурсов, ищите подсказки на stackoverflow.com или в личных блогах разработчиков — там попадаются хорошие примеры. 

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

Первоначальная идея сильно отличалась от конечного результата (вы можете увидеть его в приложении) – по задумке приложение должно было предлагать пользователю изучение 300 наиболее популярных иностранных слов, самостоятельное создание иллюстрации к ним, а также несколько тестов для их закрепления. 

Написание приложения. Работа была разделена на несколько частей, каждая из которых состояла из четырех этапов: продумывание логики процессов, постановка задачи, поиск подходящего решения в интернете и попытка адаптации его под программу. Если в интернете не находилось ничего за 3–4 часа, я обходил этот момент и искал кардинально другое решение.

Я сделал базу иностранных слов, используя SQLite Expert, и скопировал ее в телефон. Картинки использовал из какого–то набора аватаров для форума, По задумке, иллюстрация должна была показываться сразу, а слово и перевод – по желанию. Реализовать анимированное «выплывание» оказалось очень просто (раньше я думал, что это долго изучают). Режим смены картинок вначале был реализован через галерею (Gallery), но потом я решил обойтись средствами ImageView. Здесь хорошо бы знать заранее, что при загрузке больших картинок все «падает». Создание меню и настроек труда не составило, к тому же дальше они практически не меняются. Я старался отказываться от всего ненужного, дорогого по времени или просто не по силам. От телефонного произношения методом text-to-speech пришлось отказаться — слишком неудобно устанавливать, да и хорошие tts-движки стоят денег. Случайно наткнулся на библиотеку языковых средств Google и привязался к нему. Кстати, кто знает, мне за это что-то будет?

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

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

Введение в программу фотоаппарата было просто потрясающим. Я решил использовать его для того, чтобы пользователи смогли сами создавать карточки с собственными иллюстрациями. Сначала хотел использовать встроенную камеру, но она делала копию в стандартную папку. В последствии, его основу я практически целиком переисл из книги Apress Android Pro Media. 

Помните о звуке. Он приводит приложение в законченный вид. Я записывал звуки, используя предметы у меня на столе. Для записи звуков желательно использовать *.ogg, с *.mp3 хватило проблем.

Защищайте программу от падений — только вы знаете о своей программе все, все возможные ее косяки. Добейтесь момента, в который поймете, что теперь можно нажимать куда угодно, и ничего не рухнет. Эмулятор для компиляции и проверки мне не нравится, и я им практически не пользовался. На раннем этапе работа шла на реальных устройствах: HTC Wildfire и планшет Acer A500.

Кстати, помните: первое, что стоит проверить — это манифест. Проблемы с запуском возникают чаще всего из–за него. А потом уже ваши косяки в коде.

Далее идет прогрессивный джепег: то есть, вы постепенно вглубь улучшаете то, что уже есть. В какой то момент я убрал Top–300, по крайней мере из первого версии. Вырезание кусков — тоже не простая работа: можно все убить, что–то где–то забыв, или переборщить с удалением. Действовать нужно смелее. Если неизвестно, делать или нет, то делать: изменения чаще улучшают, чем ухудшают, пусть даже они займут много времени. Торопитесь неспеша. Первый срок окончания я назначил себе за три месяца до действительного окончания работы.

Очень важен дизайн интерфейса. Я думаю, пользователю плевать, насколько идеально написан код, главное — чтобы все работало и «такое красивое было». Любите своих дизайнеров, объясните им честно, что вы можете реализовать, а что лучше обойти вместе с ним. Думайте и спорьте, но последнее слово за дизайнерами. Объясните себе и ему, что и зачем нужно. Мой дизайнер Ваня не просто дизайнер, он еще крутой идея–мейкер. Просто дизайн вы можете и заказать. Я хочу работать только с фанатиками своего дела, вкладывающими душу. 

Вообще, когда работа удается – это удивительно приятно. Есть понятие потока, когда вы заняты чем–то любимым, время летит и тянется одновременно, вы не испытываете скуки, вы погружены. Если решаемая вами задача сложнее, то это подбешивает и учит, если легче — расслабляет. Можно проснуться в 10, сесть работать в 11 и сидеть до 4 утра, три раза по пять часов. Так когда ваша девушка в командировке. Ваша задача всегда срочная. Так можно работать неделю-две, включая выходные. Обычно можно два раза по пять часов, с 9 до 21. Если вам что–то нравится, вы делаете это хорошо и долго, сами и без «как себя заставить».

Для себя я выяснил, что программист не просто что–то там пишет, а решает или обходит проблемы, ищет лазеечки — на это я потратил 5 месяцев работы. Не считая первого месяца изучения Java.

Ниже я хочу показать ленты скриншотов от и до.


Первые попытки осуществления перелистывания карточек и последовательного вывода слов.


Добавлено меню и настройки.


Расширение работы настроек, изменения xml-интерфейса.


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


Обсудили с дизайнером как все будет, что дало первую сырую реализацию на первых попавшихся картинках. Реализованы напоминания на таймерах, которые не корректно работают во время сна. Две кнопки в центре запуск и остановка сервиса.


Вначале мы думали давать перевод в контексте примера, здесь слово для примера, потом отказались от этой концепции.


Проработка добавления нового слова в базу, на последнем скрине уже рабочая камера.


Камера работает, но вылетает при быстром повторном нажатии на съемку. Логическое продолжение добавления карточки, все сделано в одном активити.


На первом скрине к двум иконкам еще не придуман конкретный функционал. На втором ввод слова, далее мы подумали о излишности целого экрана на это действие и перенесли его на главный экран.


Продолжение изменений интерфейса под дизайнерские кнопки влево-вправо и размеры остальных.


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


Фотоаппарат может листать слова и делать фотографии на них. Добавлена подсказка на ввод и проверка на существование слова в базе.


Реализация первоначальной идеи со словарной базой, позже можно будет просто добавить 10 слов из 2500 в свою базу, удалить не нужные и отдельно загрузить свои.


Установка конечного фона, дизайнером прорисованы кнопки, на последнем экране — эксперимент с интерфейсом ввода, в последствии дизайнер отрезал эту ветку мысли.


Изменены диалоги сообщений о существующем слове, поиска и «создатели».


Завершены напоминания, загрузка выполняется в фоне и не тормозит телефон.


Общий вид людоедов.


Процесс добавления слова в карточки. Поиск, в итоге оставили только по слову.


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


Переработаны диалоги, добавлен диалог создания новых карточек, при их отсутствии.


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


Обучение, фотография первоначального дизайна через конечную программу.



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


Меню с новыми иконками и английской локализацией, фотоаппарат, настройки.


Оформление диалогов.


Напоминания, иконка 16х16 для статус-бара особая гордость.


Окончательный вид добавления и диалог удаления.


Окончательное обучение.

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

Если вам стало интересно, что вышло – Carton.

«Вы будете приятно удивлены, насколько легко и быстро можно учить иностранные слова. Метод карточек самый простой, а мы сделали его красивым и удобным. Используйте свое окружение для иллюстраций! А ещё мы добавили напоминания, чтобы вы не забыли вовремя повторить. Carton — ваш собственный способ учить английский»

Комментариев нет:

Отправить комментарий