Любите использовать смайлики? Теперь вы можете научиться делать самостоятельно!
Мы все используем смайлики / эмодзи (значки эмоций) в наших чатах, приложениях и онлайн-комментариях. Emojis — очень интересный способ показать наши чувства без слов. Хотя многие приложения предлагают бесплатные смайлики, вы не должны ограничиваться только ими. Создайте свой собственный!
Сегодня вы шаг за шагом узнаете, как настроить и спроектировать небольшой набор смайликов халидзи. Мы будем работать с основными инструментами Adobe Illustrator и ярлыками, чтобы создать персонажа женского пола с различными выражениями, и перейдем к использованию Xcode для экспорта изображений.
Проверьте GraphicRiver, чтобы вдохновиться другими дизайнами смайликов .
1. Как сделать эскиз и установить артборд Emoji
Шаг 1
Во-первых, нам нужно набросать нашего персонажа.
Общие «красоты» черты, которыми ближневосточные женщины генетически наделены, но не ограничиваются ими:
- полные брови
- большие глаза с кольцами и завитые ресницы
- оливковый цвет лица
- пухлые губы
- густые волосы
Помните об этом и нарисуйте «неэмоциональное» женское лицо, и добавьте хиджаб, чтобы она выглядела «Халиджи» (из Персидского залива).
Затем используйте один и тот же базовый эскиз лица и умножьте его, чтобы проиллюстрировать девять различных эмоций, которыми вы могли бы поделиться с друзьями и семьей, таких как счастье, любовь, удивление, плач и т. Д.
По сути, вы можете изменить выражения, просто изменив брови, глаза и рот исходного эскиза. Посмотрите, как я изменил свои эмоции.
Шаг 2
Настройте новый документ ( Command-N):
- Количество артбордов: 1
- Ширина: 618 пикселей
- Высота: 618 пикселей
- Единицы измерения: пиксели
- Цветовой режим: RGB
Шаг 3
Используйте ярлык « Поместить» ( Command-Shift- P ) и поместите эскиз. Затем заблокируйте ( Command-2 ) эскиз вниз, чтобы мы могли начать трассировку сверху.
2. Как отследить начальный дизайн Emoji
Шаг 1
Давайте начнем отслеживать, рисуя глаза.
Выберите Ellipse Tool (L) , на панели инструментов .
- С помощью инструмента «Эллипс» (L) создайте радужную оболочку — коричневый
#7C3722
круг размером 60 x 60 пикселей (#7C3722
) . - Нарисуйте зрачок глаза, коричневую (
#351105
) заливку размером 40 х 40 пикселей и поместите его над радужной оболочкой. - Используя Ellipse Tool (L) , создайте два блика отражения глаза: один повернут 26 х 17 пикселей и 14 х 14 пикселей (
#FFFFFF
) заполнить круг.
Затем с помощью инструмента «Выделение» ( V ) выберите все четыре эллипса и сгруппируйте их ( Command-G ).
Шаг 2
На панели « Инструменты» выберите инструмент «Перо» ( P ) и с помощью ( #FFFFFF
) белая заливка, нарисуйте «склеру» — белизну глаза.
- Object > Arrange > Send Backward ( Command- [ ), чтобы расположить его позади фигур зрачка.
- Затем скопируйте (Command-C) .
- И вставьте перед (Command-F).
- Object > Arrange > Bring Forward ( Command-] ), чтобы расположить его перед фигурами зрачка.
Нам нужно создать обтравочную маску для учеников.
С помощью инструмента «Выделение» ( V ) выберите группу «склера + зрачок», « Объект» > « Обтравочная маска» > « Создать» ( Command-7 ).
Теперь ученики в масках.
Шаг 3
Используя Pen Tool (P) , нарисуйте верхнее / нижнее веко, тени для век, ресницы, брови и румянец щеки, с черным штрихом и нулевой заливкой.
Цвет заливки:
- Брови
#893A28
- Тени для век и нижнее
#CC6E4A
- Ресницы
#000000
-
#B5D7EA
- Щеки Затенение
#FFB7A6
Вам нужно будет выровнять фигуры спереди или сзади .
Чтобы переместиться выше или ниже, выберите «Объект»> «Расположить»> «Переместить на передний план» (Shift-Command-]) или « Объект»> «Расположить»> «Отправить на задний план» (Shift-Command- [) .
Для всего одного шага назад или вперед, Object> Arrange> Send Backward ( Command- [) или Forward (Command-]). Object> Arrange> Bring Forward.
Шаг 4
Откройте панель « Прозрачность» : « Окно»> «Прозрачность».
Выберите форму оттенка голубого глаза и задайте для нее режим « Умножение: смешивание» на панели « Прозрачность» .
Затем выберите форму щеки и задайте для нее режим Multiply: Blending Mode .
Эффект > Стилизация > Перо : Радиус: 13px .
Шаг 5
Сгруппируйте все формы глаз вместе ( Command-G ).
Нам нужно создать симметричные глаза. Используйте инструмент «Выделение» (V) и выберите группу глаз, оттенок щеки и брови. Возьмите инструмент отражения (O) и установите синюю центральную контрольную точку над носом; Option-Shift-Drag и отпустите, чтобы отразить в положение.
Шаг 6
Давайте проиллюстрируем остальные функции смайликов. Используйте Pen Tool (P) и обведите остальные части эскиза.
Затем выберите каждую фигуру, присвойте ей нужный вам цвет заливки и расположите ее в правильном порядке.
Помните, что для перемещения выше или ниже: « Объект»> «Расположить»> «Переместить на передний план» (Shift-Command-]) или « Объект»> «Расположить»> «Отправить на задний план» (Shift-Command- [ )) и просто сделать шаг назад или вперед, « Объект»> «Расположить»> Отправить назад ( команда- [) или вперед (команда-]).
Шаг 7
Объект> Разблокировать все ( Command-Alt-2 ) и удалите эскиз. Настройте и очистите иллюстрацию с помощью инструмента прямого выбора ( A ).
Выберите форму лица, Object > Path > Offset Path: Offset — 4px
Затем выберите и придайте внешнему лицу более темный цвет кожи.
Шаг 8
Выберите фигуру хиджаба, « Объект» > « Путь» > « Путь смещения»: смещение 5 пикс. и придать новой внешней форме черную заливку.
Теперь у нас есть начальный эмодзи.
Файл> Сохранить ( Command- S) .
Шаг 9
Наш следующий шаг — продублировать артборд, чтобы сохранить основные функции эмодзи. Перейдите в Окно> Артборды . Выберите выпадающее меню и Duplicate Artboards . Дублируйте это девять раз.
Затем в подменю панели «Артборды» выберите « Переупорядочить артборды» :
- Макет: Сетка по строке
- Колонны: 3
- Расстояние: 20 пикселей
3. Как проиллюстрировать эмоции
Шаг 1
Теперь, когда наши артборды установлены, мы можем начать рисовать эмоции.
Первая эмоция артборда: «О!»
- Удалить губы и брови.
- Затем выберите Pen Tool ( P ) и нарисуйте «O» губы и наклонные брови эмоции: O
Выберите каждую новую фигуру с помощью инструмента « Выделение» ( V ) и используйте инструмент «Пипетка» ( I ), чтобы выбрать соответствующего партнера, чтобы придать ему тот же цвет.
Цвет бровей у меня был недостаточно сильным, поэтому заменил его на более темный.
Выберите> То же> Цвет заливки и #4F2018
им цвет заливки #4F2018
.
Используйте инструмент «Выделение» ( V ), чтобы переместить маленькую точку красоты ближе к губам, и все готово к первым смайликам!
Шаг 2
Артборд 2: «Расстроенный» эмодзи.
- Удалить брови и губы.
- Нарисуйте новое выражение с помощью инструмента «Перо» ( P ) и сопоставьте цвета с помощью инструмента «Пипетка» ( I ).
- Используйте инструмент «Выделение» ( V ), чтобы приблизить красоту к губам.
Шаг 3
Артборд 3: «Злой» смайлик.
Сначала выберите брови с помощью инструмента «Выделение» ( V ) и поверните их внутрь, чтобы показать гнев. Затем нарисуйте злые губы и искры гнева с помощью Pen Tool ( P ), 1 pt , черный ход.
В завершение сопоставьте цвета с помощью инструмента «Пипетка» ( I ) и выделите искрам красный цвет.
Шаг 4
Артборд 4: «Шок» эмодзи.
- Удалить брови и губы.
- Нарисуйте изогнутые и изогнутые брови и открытый рот с помощью инструмента «Перо» ( P ) и сопоставьте цвета с помощью инструмента «Пипетка» ( I ).
Шаг 5
Артборд 5: «Крутые» эмодзи.
Используйте Pen Tool ( P ), чтобы нарисовать прохладные солнцезащитные очки с кошачьим глазом и добавить белое отражение.
Затем, используя инструмент Direct Selection Tool ( A ), настройте губы, чтобы они выглядели более «пухлыми», и удалите темный центр губ.
Шаг 6
Артборд 6: «В восторге» смайлики.
- Удалить глаза и темный центр губ.
- Нарисуйте тени для век и черные «щурящиеся» глаза с ресницами, используя Pen Tool ( P ).
- Используйте инструмент «Выделение» ( V ), чтобы опустить брови и слегка повернуть их прямее.
- Используйте инструмент «Пипетка» ( I ), чтобы подобрать цвета.
Шаг 7
Артборд 7: «хихикать», эмодзи.
- Удалите глаза, брови и губы.
- Используйте Pen Tool ( P ), чтобы нарисовать тени для век, изогнутые косые глаза с длинными ресницами, изогнутую улыбку и изогнутые брови.
- Используйте инструмент «Пипетка» ( I ), чтобы подобрать цвета.
- Используйте инструмент «Выделение» ( V ), чтобы поднять щечную тень вверх и приблизить ее красоту к рту.
Шаг 8
Артборд 8: эмодзи «Cry Me a River».
- Удалить глаза, брови и губы
- Используйте Pen Tool ( P ), чтобы нарисовать перевернутые брови, водные глаза, много слез и открытый рот.
Затем используйте инструмент «Пипетка» ( I ), чтобы подобрать цвета, и цвет закрасьте слезы оттенками синего. Запомните ярлыки, чтобы расположить элементы сзади / спереди. Переместите красоту ближе к губам. Используйте Pen Tool ( P ) с темным оттенком кожи и нарисуйте треугольную форму под потоком слезы, чтобы слезы выглядели так, как будто они вылетают.
Шаг 9
Артборд 9: «В любви» эмодзи.
- Удалить глаза и губы.
- Используйте инструмент «Выделение» ( V ), чтобы повернуть концы бровей и слегка опустить их.
- Используйте Pen Tool ( P ) и нарисуйте два больших сердца вместо глаз, застенчивую улыбку и сердца вокруг хиджаба.
Наконец, используйте инструмент «Пипетка» ( I ), чтобы подобрать цвета.
Шаг 10
Последний шаг — вернуться через декорации, очистить обложку, внести изменения в любое удобное для вас место, расположить объекты в правильном порядке и добавить отражения или дополнительные элементы, чтобы каждый смайлик появлялся, если это необходимо.
Файл> Сохранить ( Command- S).
4. Как экспортировать и построить клавиатуру Emoji
Шаг 1
Файл> Экспортировать как.
Формат: выберите PNG , установите флажок « Использовать монтажные области» и « Экспорт» .
Диалоговое окно PNG появится:
- Разрешение: экран (72 ppi)
- Цвет фона: прозрачный
- Нажмите ОК
Шаг 2
Теперь, чтобы сделать нашу клавиатуру Emoji.
Apple упростила задачу с помощью приложений стикеров для сообщений в iOS 10. Большинство приложений сегодня не позволяют создавать собственные смайлики или стикеры, поэтому, пока они не станут доступны, вам нужно создать их.
Клавиатура, которую мы создадим с помощью Xcode, может быть использована в сочетании с набираемым вами текстом и пользовательскими смайликами, которые работают как наклейки. Вы можете снять их с клавиатуры и поместить поверх других сообщений.
Если вы только начинаете создавать стикеры Emojis, вы можете проверить мой другой учебник Как создать стикеры iMessage для более информативного руководства.
Вам нужно будет настроить свою учетную запись Apple Developer (USD99 / год) и iTunes Connect. Плюс скачать Xcode.
Шаг 3
Мы кратко пройдем через этот процесс.
Войдите в Xcode, используя свой Apple ID: Настройки> Аккаунт> Выбрать +> Войти .
- Создайте новый проект XCode, выберите « Sticker Pack Application» и нажмите « Далее» .
- Дайте вашей смайлике название продукта : « Женщина-эмодзи Khaleeji ».
- Заполните команду , название организации и идентификатор в соответствии с вашими данными и нажмите Далее.
Шаг 4
Нажмите на синюю папку Stickers.xcstickers в левой области навигации и перетащите изображения смайликов в область редактора.
- В разделе « Установка активной схемы» выберите модель своего устройства, например iPhone7 Plus.
- Запустите сборку, чтобы проверить наклейки на симуляторе iMessage.
Проверьте смайлики на симуляторе.
Шаг 5
Если все работает хорошо, создайте значки приложений iMessage, и вы готовы архивировать и отправлять в App Store.
Для создания значков приложений используйте MakeAppIcon .
Загрузите версию приложения размером 1536 x 1536 px на веб-страницу MakeAppIcon , и она отправит вам электронное письмо всех размеров, необходимых для всех устройств iOS.
Нажмите на синюю папку Stickers.xcstickers в левой области навигации, выберите папку значков приложения iMessage и загрузите все изображения значков с помощью перетаскивания.
Шаг 6
Наконец, Продукт> Архив .
- Окно> Органайзер . Вы увидите свои наклейки в левой панели.
- Подтвердить .
- Если все хорошо, загрузите в App Store , и он появится в вашем iTunes Connect , и вы сможете отправить его на проверку .
Когда вы будете готовы, нажмите Отправить . Вот и все!
Подождите, пока процесс обзора, который обычно занимает несколько дней, и ваша клавиатура Emoji будет готова!
Готов, Установить, Текст!
Прекрасная работа! Мы проиллюстрировали пользовательский набор эмодзи Khaleeji Woman , используя основные ярлыки и инструменты Adobe Illustrator. Мы можем использовать эти простые приемы, чтобы нарисовать больший набор смайликов, чтобы поделиться ими и загрузить их в наше приложение iMessage.
Поделитесь и наслаждайтесь!