Дизайнер Аделин Ваат в своем блоге рассказала о том, как она создавала стикеры для iMessage. Оказывается, что это довольно простое занятие. Почему бы вам не попробовать?
Когда Apple анонсировала iOS 10, я была в восторге от стикеров в iMessage. Будучи активным пользователем iMessage, когда эмодзи не могли передать мои мысли, я рисовала картинки, делала фотографии и посылала их другому человеку (кто сейчас звонит?).
Мне нравилась идея увидеть некоторые из моих рисунков в ежедневных разговорах и общении. В этой статье я делюсь тем, как бумажные зарисовки превратились в стикеры Dim and Sum в iMessage App Store. Это моя первая попытка самостоятельно опубликовать стикеры / iOS приложение (это тот же самый процесс), и я рассказываю об этом с точки зрения дизайнера. Возможно, некоторые шаги можно улучшить, и я буду рада услышать об этом.
Весь процесс вкратце:
- День 1-3: Разработала концепцию, набросала на бумаге. Использовала Illustrator для создания цифровой копии своих зарисовок. Получила 24 стикера.
- День 4: Скачала и изучила Xcode для создания стикеров. Купила аккаунт Apple Developer и проделала массу другой работы для загрузки своих стикеров.
- День 5: Наконец загрузила мой первый билд для проверки в iMessage App Store.
- День 6: Статус приложения изменился на «Ожидает ревью».
- День 7: Статус приложения изменился на «В ревью».
- День 8: Стикеры прошли проверку и готовы к продаже!
Я разделила это руководство на две части – в первой я буду рассказывать про подготовку рисунков, а во второй о технических вопросах создания и публикации стикеров. Вы можете найти мою шпаргалку по стикерам iMessage здесь.
1. Подготовка стикеров в Adobe Illustrator
Обычно я работаю с Illustrator при создании векторных изображений. Я расскажу некоторые простые вещи, на которые следует обратить внимание при подготовке ваших стикеров.
- Знайте размеры ваших стикеров. Вы позднее в Xcode должны будете выбрать один из трех размеров (я рассмотрю это во второй части). Так что ваш артборд в Illustrator должен быть соответствующего размера. Как правило, чем больше у вас деталей, тем больший размер должен быть у стикера. Я использовала обычный размер (408х408 точек).
- Создайте отдельные артборды для каждого стикера. Нет точного количества стикеров (я не смогла найти эту информацию), которые нужны iMessage. Я полагаю, что надо просто сделать разумное количество, которое бы понравилось пользователям, особенно если вы собираетесь продавать стикеры.
- Помните, что это набор стикеров, так что постарайтесь сохранить визуальную однородность во всех них.
- Используйте функцию «Export for Screens». Экспортируйте PNG, убедитесь, что фон сделан прозрачным, @1x достаточно.
2. Создание иконку приложения
В работе над иконкой я выбрала Sketch. Вот полезный шаблон, который я нашла на Github для генерации иконок в Sketch. В общем, всего есть 12 изображений, которые вам понадобятся для Xcode и еще одна для iTunes Connect. Вот как они выглядят.
Некоторые советы по созданию иконок в Sketch:
- Если вы копируете вектор прямо из Illustrator, убедитесь, что вы заранее конвертировали кривые в контуры. Так вы избежите того, что некоторые кривые будут слишком толстыми или слишком тонкими при масштабировании до требуемых размеров.
- Сделайте ваши иконки символами. Таким образом, когда вы сделаете второй набор стикеров, вам понадобиться заменить только одно изображение.
- Экспортируйте их @1x и положите все в одной папке.
3. Переносим все ассеты в Xcode
Теперь, когда у вас готовы все ресурсы, настало время сконфигурировать их использование в Xcode – среде разработки от Apple. Вы можете скачать его бесплатно в Mac App Store.
Процесс копирования ассетов в Xcode довольно прост, вы можете посмотреть это видео. В принципе, весь он состоит из двух частей – перенос ваших рисунков и задание иконки приложения.
Основная часть работы по публикации приложения наступает после этого, особенно если вы делаете все в первый раз, как я. Я расскажу о настройке Xcode, тестировании, загрузке приложения в iTunes Connect и других необходимых вещах в следующей части.
Я была чертовски взволнована, когда впервые увидела свои стикеры в магазине приложений, отдайте им должное, если вам понравился мой рассказ :). Я надеюсь, что это руководство будет полезно для других иллюстраторов, художников и дизайнеров, которые думают о выпуске своих работ для iMessage. Также я сделала Шпаргалку для издания стикеров для iMessage, что должно упростить эту работу для всех. Увидимся во второй части!