ТЕКСТ: ЕВГЕНИЙ БРЯНЦЕВ. Привет. Я — разработчик приложений для iOS. На прошлой неделе мы с моделлером Натальей Лутцевой и программистом Михаилом Голубом выпустили забавное приложение для детей Буквоед. Это такая азбука, в которой буквами надо кормить милого, но вечно голодного персонажа. Тащишь букву или несколько к Буквоеду, он пережевывает и произносит название буквы. Приложение работает на айпаде, айфоне и айподтаче. Я расскажу, как мы разрабатывали персонажа, интерфейс и снимали ролик.
Идея
Cамая простая — монстр ест букву и сразу ее произносит. Это понятно и прикольно.
Персонаж
Персонаж должен был быть милым, с большой пастью, чтобы буквы помещались и такой чтобы нравился детям.
Сначала мы думали сделать монстра двухголовым, чтобы он одной головой ел, а второй произносил. Но смотрелся он ужасно. Подумал сделать монстра с головой и дополнительным хоботом, которым он мог бы произносить буквы, но смотрелся он неоднозначно. По-этому решили сделать процесс естественным — монстр ест букву и произносит ее. Вместе с Наташей мы начали делать карандашные эскизы и довольно скоро получился персонаж, похожий и на жабу и на осьминога и на дракона одновременно.
Стали прорабатывать варианты фактур. Пробовали мохнатенькие фактуры, чтобы персонаж был похожим на чувачков из Big Planet, но тут фактуры явно не катили.
Получался ковер настенный :) это явно не то. Решили делать просто матовым зеленым.
Продолжили работать с формой, анимацией жевания, прической, эмоциями и начал появляться какой-то конкретный персонаж.
Получившейся образ мы проработали в деталях и сделали рендеры всех кадров анимации.
Интерфейс для айпада, выбор фона и шрифта
Я уверен в том, что все хорошие приложения для детей до 6 лет должны быть без меню с кнопкой Start, без рекламы, а в бесплатных и лайт версиях не должно быть ссылок на полную версию. Потому, что дети жмут все подряд и не ожидают, что вдруг откроется эпстор или диалоговое окно. В Буквоеда мы даже не встроили rate me. Для большинства приложений можно избежать ненужных, непонятных этапов для ребенка. Приложение должно запускаться и быть готовым к работе. Так мы и сделали. После запуска появляется сразу весь алфавит и можно кормить Буквоеда.
Шрифт
Мы очень долго искали подходящую гарнитуру. Конечно же выбрали Букварную. Тоненькая, красивая, легкая. И сразу видно чем буквы различаются между собой. Именно этой гарнитурой раньше набирали азбуки и учебники.
Почему такой простой деревянный фон? – Все очень просто. На градиентных фонах буквы висят в воздухе. А если фон имеет рисунок дерева, то легче запоминать расположение буквы, изгибы выносных элементов. Да и просто приятней. Фон не должен отвлекать. Мы перебрали несколько цветовых сочетаний, фактур, контрастов, букв с фоном.
Остановились на зеленом фоне и бело-желтых буквах. Яркость подобрали такую, чтобы буквы были заметны и видны днем на улице. Потом подобрали максимально возможные расстояния между буквами, чтобы детские пальчики не ошибались. Строчки сделали с разным количеством букв, чтобы избежать коридоров. Асимметричные смотрятся приятней.
Озвучка
С нами согласился работать актер Александр Кудринский. Он и посоветовал нам хорошую студию звукозаписи. Работать с профессионалами очень приятно — Саша придал персонажу характер и очень забавно озвучил. На каждую букву мы делали около 20 записей — озвучка должна была получаться игровой, мультяшной, но с правильной дикцией.
Звуковые файлы для прослушки: 1.wav, 2.wav, 3.wav
Отобрав звуки принялись за иконку и надпись – логотип. Тут с первого раза получилось неплохо.
Все, можно собирать. Отдали материалы Мише Голубу. Он довольно быстро, за несколько часов собрал рабочую версию и мы при случае начали давать играть детям. Детям сразу понравилось, это было приятно.
Хоть мы и собрали рабочую версию быстро, но на то, чтобы отловить все баги и подогнать анимацию ушел примерно месяц. И ура! Миша собрал готовую версию под айпад. С ней мы уже могли начать снимать рекламный ролик.
Хорошо, когда есть друзья. Да еще с белой комнатой, двумя камерами, светом и умеющие снимать. С нами работал Алексей Антонов из студии Yatta! Мы решили сделать все просто — снять детей и то, как они играют с Буквоедом. Собрали всех знакомых мам с маленькими детьми, привезли в студию, включили свет, дали айпад, запустили Буквоеда и стали снимать. Мы очень обрадовались, что детям Буквоед понравился. Они первый раз увидели его и все эмоции сняты честно. Не знаю, правда, чтобы я делал, если бы он им не понравился) Ролик смонтировали уже через 3 дня.
Интерфейс для айфона
Теперь пришла очередь версии под айфон. И тут с моей стороны, как дизайнера и проектировщика случился факап. Дело в том, что на айфоне было бы глупо отображать всю кириллицу сразу — буквы были бы мелкими. Я решил делать слайдер из трех букв. Первая и последняя видны только на половину, а той, что по середине можно кормить Буквоеда. То есть вправо-влево тащишь — переключаешь буквы. Тянешь вниз — тащишь букву на съедение. Но я вовсе не подумал что эти зоны перекрываются. То есть телефону непонятно, тащишь ты буквы на кормление или просто скроллишь буквы влево-вправо.
Миша предложил следующее решение — когда тянешь влево-вправо до 30 градусов к горизонтальной оси — работает скролл. Когда тянешь вниз — буква тащится на кормление.
Так решили сделать. Запустили. Интерфейс хоть и стал работать, но срабатывание по-прежнему осталось непредсказуемым. Этого не должно быть. Добавлять кнопки скролла влево-вправо тоже не решение. Мы все думали как сделать правильно, а время шло. Мы выбрали такой вариант, когда буквы скроллятся по нажатию на одну из крайних. То есть нажал на крайнюю буквы — ряд сдвинулся на одну букву. Конечно, такой способ не “интуитивный”, зато дает четкий предсказуемый результат. Так решили и сделать. Собрали билд и отправили на проверку. Ровно через 7 дней приложение прошло проверку и попало в магазин. Мы обрадовались и стали раздавать промокоды разработчикам и друзьям, слушать отзывы. Выловили баг на айподтаче — там было две Г. На айфонах все пытались тянуть букву и скролл не срабатывал. Уже после релиза мы опять принялись думать над тем, как правильно сделать переключение и драг буквы. И нашли решение: для корректной интуитивно – понятной работы со слайдером и дрэгом надо развести зоны их срабатывания — просто опустить центральную букву на строчку ниже. Тогда все круто работает. Пользователю понятно наглядно, что именно эту букву надо тащить на кормление. А при перетягивании крайних букв срабатывает скролл и буквы летают по прикольной дуге.
Именно это решение мы встроили в обновление вместе с фиксом багов на айподтаче. Если у вас есть идеи того, как можно решить проблему с интерфейсом на айфоне другим способом — буду рад выслушать, а если она будет лучше последнего варианта, то мы даже внедрим ваш способ. Спасибо за внимание. Очень надеемся, что детишкам наш веселый Буквоед придется по вкусу :)
iPhone + iPad: $0.99 [iTunes link]
(1 голосов, общий рейтинг: 5.00 из 5)
52 комментариев
Форум →ооо! здорово!! отличное описание процесса!!!
как приедет малыш с каникул со своим айпадом-тут же куплю ее ему, я как раз искал “алфавитную” програмку ему
@ruslanred, спасибо)
Что-то мне это напоминает?
http://itunes.apple.com/us/app/id402798311?mt=8
Можно было и промокодов дать пяток :)
@iRoccka, к сожалению промокоды разлетелись за два дня
милый зверёныш :)
хорошая программа, качественная, люблю когда подходят к делу профессионально
@ZESTxKiLL, Спасибо)
Описание супер! Жаль давно вырос из возраста, в котором это приложение могло бы быть мне интересно, и ещё не дорос до того, чтобы иметь детей.)
По поводу скрола на айфоне: если перетягивать можно только центральную букву, то почему бы не сделать только скрол(без перетягивания), а при тапе на буквоеда он бы вытягивал шею и сам ел центральную букву? Конечно тут опять придётся рисовать, но зато процесс поедания будет более динамичен, что может понравиться детям…
@Ahiless, Лучше, чтобы ребенок долшье смотрел на букву и запоминал связь начертания буквы с ее названием
@bryantsev, дольше)
“Дело в том, что на айфоне было БЫВ” – исправляйте.
Спасибо, статья действительно интересна
@Awaking, да, что-то много автозамен ;)
Есть предложение – сделайте вариант “наоборот”: “Буквоед” сначала говорит букву, а потом ждёт когда её ему скормят, если не верно – выплёвывает и морщится =). В текущем варианте ребёнок кормит ему всё подряд, то, что это весело – понятно, но, по-моему скромному мнению, усвоение материала было бы лучше чередуя упражнения.
З.Ы. Переключение режимов сделать не в игре, а в настройках, действительно, детям лишние кнопки и переключатели ни к чему.
@ttyd0, Согласен. Вариант с “наоборот” можно было бы сделать как другой уровень/режим обучения…
@ttyd0, лучше мы сделаем, чтобы Буквоед требовал какие-то конкретные буквы и немножко толстел, если правльную скормить. А если напрвильную, то худел бы)
@ttyd0, Точноно, точно…
http://itunes.apple.com/us/app/id402798311?mt=8
Поддерживаю предложение ttydo.
Купил, доволен, для моего малыша когда еще чуточку подрастет будет как раз. Пока пробежались бегло по программе, и хотелось бы выразить пожелание – когда берешь 2-ве буквы, было бы здорово что бы они произносились вместе (вместо М, А, сочетание как МА…, или же стандартный набор слов – МА…ма, т.д.)
Думаем ребенку так было бы еще интереснее комбинировать буквы что бы услышать знакомое или незнакомое слово :)
@Deeen, пока достаточно азбуки)
@Deeen, это правильный ход мыслей, но учить детей читать надо не по слогам. Насколько я знаю учить читать надо слова целиком, начиная с односложных. Исправьте меня, если я ошибаюсь
Кстати да, пусть будет такой режим наоборот. В качестве проверки усвоенного материала. А на счет сколов для айфон, а нужен ли он вообще? Пусть появляется буква, зверь ее съедает, и на ее месте появляется другая ранжиром или по алфавиту. Зачем там скрол?
@valexv, Не ранжиром, а рандомом и не скол, а скрол. Ох уж эта автозамена.
@valexv, Ну есть буквы, которые нравятся и тем более, что подряд все делать неинтересно)
баг нашелся))
буквы Г и Д:
http://dl.dropbox.com/u/13142374/Bukvoed_bug.MOV
ps: тоже ЗА поддержку идеи ttydo
@rh1no, в новой версии уже исправлен этот баг и внедрен новый интерфейс для айфонов. Буквоед обновится через несколько дней
И я внесу предложение))
В настройках сделать опцию с “десткой” фонетикой. Т.е. некоторые буквы произносить так, как они понятны для совсем маленьких детей, а именно вместо Эф – Фэ, вместо Эм – Мэ… И так далее.
@direktor, да, ссамого начала мы записали и названия букв и звуки (глухие и звонкие). Но звучание буквы в слове зависит от соседних букв. И лучше не путать ребенка, дать ему возможность выучить именно названия букв.
@bryantsev, дело в том, что маленьким детям лучше учить не столько буквы, сколько звуки, соответсвующие этим буквам. Так гораздо проще научить детей читать (цель ведь научить читать, а не просто буквы выучить). Вам это скажет любой логопед. Почему разработчики не консультируются с детскими педагогами – непонятно. Я еще не видел ни одной программы-азбуки, где произношение звуков было бы поставлено правильно. А это, пожалуй, столь же важно, как и проработанная графика.
Как вариант, в следующие обновления включить ещё персонажей, возможно даже с in app purchase, по $0,99 их сделать и доп. доход иметь с этого.
@mikla, спасибо, но я уже писал, что в детских приложениях не должно быть функционала касающегося не игры, а покупок, статусов или ретинга игры
Программа примитивна, а расписали процесс как-будто инфините блейд создавали, но по видео детям, вроде, нравится, но тоже предполагаю на минут 10 не больше.
Про наоборот отличная идея! А так программа глупая.
@Stylusss, если бы вы принялись учить названия букв с нуля, она бы не показалась вам примитивной, а наоборот — максимально удобной и продуманной
Ждем хакнутой версии ;)
@DanSmir, она стоит того, чтобы купить, а не воровать ;)
DanSmir, жди бан))
Брату очень нравитсо)) рад, что есть ткие разработчики) Спасибо!
@snake302, рады, что есть для кого делать)
@snake302, кстати, у нас еще есть две бесплатные клевые детские программы, думаю тоже понравтся
@bryantsev, названия в студию )
А как стать художником для рисования приложений? програмить я не умею, а всякие красивые штуки нарисовал бы
@ONESTEP, надо просто много рисовать и найти того, кому это все понравится
@ONESTEP, надо войти на форуме в раздел Поиск работы для разработичиков и запостить пост о себе. Вас заметят.
@ONESTEP, По поводу рисования графики для игр пиши мен на мыло. ([email protected]). Думаю что-нибудь да сообразим.
сПокольку ребёнок как раз вошёл в возраст “буквоедства”, на айфонах семьи есть практически все имеющиеся в русском аппсторе азбуки/буквари. И ребёнок их активно юзает!.. После прочтения данного материала таки купил буквоеда(ранее, сталкиваясь с ним в аппсторе, игнорировал поскольку не вызывал никакого интереса)… Что хочу сказать – не знаю как прога выглядит и юзается на айпаде, но на айфоне – это форменный кошмар! – анимация убогая, герой прорисован как инопланетяне в голливудских фильмах двадцатилетней давности… Управление настолько ненативно по отношению к концепции мультитач от эппл, что пользоваться программой не хочется. – Это я на Wndows CE тапал стилом(пальцем) куда-то для того чтоб подвинуть контент. Apple подарил нам мультитач-жесты! И та скорость, с которой дети их усваивают(самостоятельно!!!) однозначно показывают степень их нативности! Так почему программка для детей ХХI века пытается вернуть их в эпоху динозавров?.. И не надо нам тут рассказывать про то что бедный сенсор путается в управлении – мы знаем что это не так(конечно при условии что дизайнер интерфейса профи).
– Вполне предсказуемо – ребёнок скормил две буквы и сказал “не нравится. я лучше лягушку конфеткой покормлю” и запустил Cut the Rope… :)
В общем, неуд вам, господа газработчики!
@ArTiKo, в новой версии отличный интерфейс и нет багов. На афйоне и аподе тач работает отлично.
@ArTiKo, Вот это попробуйте http://itunes.apple.com/us/app/id402798311?mt=8
@ArTiKo, Честно говоря именно “геймплей” отталкивает меня от покупки данного приложения, по этой же причине моему ребенку не понравилась Живая азбука – нет действий, листать буковки конечно хорошо, но не очень интересно, здесь мне кажется так же…, а вот “Азбука” обзор которой был недавно на этом сайте пришлась по душе, она правда очень хорошая – ему нравится двигать предметы и слушать стихи, некоторые он уже начал повторять =)…
Как по мне так это правда занятие на несколько минут(сужу только по своему ребенку), поскольку ребенку тяжело усидеть на одном месте, кормя монстра буквами, но кроме как произношение – монстр не производит каких либо действий, он не подпрыгивает от радости, не читает стихи про букву, в него нельзя поторкать пальцем, он статичен 90% времени которое проводит ребенок с приложением, именно игнорирование детской психологии и восприятия игр то что останавливает меня от покупки приложения… Это конечно ИМХО, но основано оно на наблюдениях за ребенком и то как он “играет” с азбуками на моем афоне.
@uzipof, Живая азбука нам понравилась – дизайн хорош. И хоть интерактив не очень большой, мой регулярно в ней копается – там медийки достаточно много.
Азбука, которую тут обозревали мы тоже юзаем. Мой нашёл в ней чит-код!!! :) – заставляет азбуку читать стишки хором из двух дядь сразу!!! Я офигел! :)
Оказывается для этого по стишку надо тапнуть не пальцем, а локтем! Я когда первый раз увидел этот жест, чуть в осадок не выпал! :) Правда вместо детского локтя сгодятся два взрослых пальца как оказалось – срабатывает практически всегда…
Сегодня вышла версия 1.1 с новым клевым интерфейсом для айфона и айпод-тача в которой иcправлены все ошибки!
Ну вышла новая версия… Обновился… Как было на 4ом айфоне две буквы “Г”, так и осталось… Буквы теперь скролятся. Это конечно хорошо. Но почему у скрола нет инерции? – Одним свайпом можно запросто с буквы А до Я пролистнуть, что у ребёнка как раз постоянно и получается!.. Почему нельзя скормить хомячку соседние от центральной буквы? – Коль скоро они тянутся пальцем – это было бы логично. Потом, почему соседние буквы располовинены? Неужели нельзя было сделать видимую “параболу” с зонами уменьшения(линзами) слева и справа? – Чтоб буква по центру была большая, а крайние маленькими, но видимыми полностью. Ну или чтоб они были в виде пиктограммок-подсказок с указателями – туда листнёшь, на букву С попадёшь, обратно двинешься – к П вернёшься. Такое впечатление складывается, что прога предназначена для скучных корпоративных нужд, и безусловно рассчитана на взрослого, усидчивого представителя офисного планктона с высшим образованием – настолько зануден интерфейс…
И опять – как верно подмечено выше – персонаж статичен и анимирован так, что живым не выглядит вообще. Не партнёр по игре, а страшила.
В общем, всё же неуд Вам, господа разработчики! :(
@ArTiKo, Буквы видны наполовину, чтобы сосредоточить внимание на той букве, которую сейчас будут произносить и не путать ребенка.
Нельзя скормить соседние буквы, потому-что появляется путаница и ложные срабатывания в интерфейсе — мне кажется, вы невнимательно прочли статью.
Размер букв не меняется — ребенку должны быть хорошо видны все буквы.
Мне кажется в было бы тупо делать пиктограмки-подсказки-указатели “обратно двинешься – к П вернёшься” для ребенка, который еще не умеет читать, а учит буквы. Согласитесь.
Основная задача, чтобы ребенок брал какую-то букву и сразу узнавал, как она называется. Сам искал буквы. Детям не нужны указатели.
Интерфейс не занудный. Он простой. Не надо этого боятся. Вы сейчас читаете черным по белому, не занудно ведь? ;)
И самое главное, что Буквоед сделан для детей. Хорошо, просто и главное понятно. Не для офисного планктона, не упячка. Неверное представление, что для детей надо делать все размалеванное, переливающееся и с мишкой. Для них надо делать просто и хорошо. Им нравится. Они просто играют и учат буквы. Проверьте)
Уважаемые товарищи разработчики и их потенциальные клиенты. Выкладывать непроверенную версию программы ценою в 1 бакс в аппстор совсем не дело. Не айс. Впредь буду относиться к вашим программным продуктам с осторожностью. НЕ РУКОМЕНДУЮ и НЕ СОВЕТУЮ НИКОМУ. Уважающая себя и своих клиентов компания так не делает. Неуд.
http://www.youtube.com/watch?v=JmK38RkQVAM
Нашли орфографическую ошибку в новости?
Выделите ее мышью и нажмите Ctrl+Enter.Что означает ошибка «Профиль приложения больше не доступен» в iOS
Как не палиться, когда читаешь сообщения в мессенджерах
Почему в macOS Monterey происходит утечка оперативной памяти
Почему после смены Apple ID на iOS запрашивается пароль старой учётной записи
Можно ли подключить AirPods к старым iPhone и iPad
Как отобразить или скрыть процент заряда батареи в macOS Big Sur
Как исправить ошибку iTunes «от устройства получен недействительный ответ»?
По какой цене продавать б/у iPhone и Mac?