От скициране до iMessage App Store за 8 дни: Част 1

Хареса ми идеята да виждам някои от рисунките си в ежедневни разговори и разговори. В тази статия споделям как скици от хартия станаха стикери Dim и Sum в iMessage App Store.

Дизайнерът Adeline Vaat в своя блог разказа как е създала стикери за iMessage. Оказва се, че това е доста просто упражнение. Защо не опиташ?

Когато Apple обяви iOS 10, бях страхопочитан от стикерите iMessage. Като активен потребител на iMessage, когато емотиконите не можеха да предадат мислите ми, рисувах снимки, правех снимки и ги изпращах на друг човек (кой се обажда сега?).

Целият процес накратко:

1. Подготовка на стикери в Adobe Illustrator

Обикновено работя с Illustrator, когато създавам векторни изображения. Ето няколко прости неща, на които трябва да обърнете внимание при подготовката на вашите стикери.

Знайте размерите на вашите стикери. По-късно ще трябва да изберете един от трите размера в Xcode (ще разгледам това в част втора). Така че монтажната ви плоча в Illustrator трябва да бъде подходящо оразмерена. Като цяло, колкото повече подробности имате, толкова по-голям трябва да бъде размерът на стикера. Използвах обичайния размер (408x408 пиксела).

Създайте отделни монтажни плочи за всеки стикер. Няма точен брой стикери (не успях да намеря тази информация), от които iMessage се нуждае. Предполагам, че просто трябва да направите разумна сума, която потребителите биха искали, особено ако ще продавате стикери.
Не забравяйте, че това е набор от стикери, затова се опитайте да запазите визуалната последователност на всички тях.
Използвайте функцията "Експортиране за екрани". Експортирайте PNG, уверете се, че фонът е прозрачен, @ 1x е достатъчно.

2. Създаване на икона на приложение

За дизайна на иконата избрах Sketch. Ето един полезен шаблон, който намерих в Github за генериране на икони в Sketch. Като цяло има общо 12 изображения, които ще са ви необходими за Xcode и още едно за iTunes Connect. Ето как изглеждат те.

Няколко съвета за създаване на икони в Скица:

Ако копирате вектора директно от Illustrator, не забравяйте предварително да преобразувате кривите в пътеки. Това ще попречи на някои криви да бъдат твърде дебели или твърде тънки, когато се мащабират до размера.
Направете вашите икони символи. По този начин, когато правите втория комплект стикери, трябва да замените само едно изображение.
Експортирайте ги @ 1x и ги сложете в една папка.

3. Прехвърляме всички активи в Xcode

След като вече сте готови за всички ресурси, е време да ги конфигурирате да ги използват в Xcode, средата за разработка на Apple. Можете да го изтеглите безплатно от Mac App Store.

Бях развълнуван по дяволите, когато за първи път видях стикерите си в магазина за приложения, дайте им кредит, ако историята ви ви хареса:). Надявам се това ръководство да е полезно за други илюстратори, художници и дизайнери, които мислят да пуснат своите произведения на изкуството за iMessage. Направих и мамят за публикуване на стикери за iMessage, което трябва да улесни тази работа за всички. Ще се видим във втората част!