Урок PS онлайн: минималистичная иконка лотоса

Иконка лотоса быстрее всего собирается из векторных фигур. Наложение градиента задаёт цвет, внутреннее свечение делает её полупрозрачной, а повёрнутые копии создают лепестки. Все значения деформации и стилей слоя перечислены — этого вполне хватит и для работы над UI-иконками.

1. Создайте холст и нарисуйте круг
   • Откройте Online PS (zaixianps.cc) и нажмите Ctrl+N, чтобы создать холст. Предлагаемый размер — 800×800 px, фон — Прозрачный.
   • На панели слева выберите «Фигура» → «Эллипс» (U), затем щёлкните и протяните в центре холста, чтобы нарисовать ровный круг.
   • На панели параметров убедитесь, что цвет заливки — #2c3e50 (тёмно-синий / тёмно-серый), а обводка — Нет.
2. Деформируйте круг «Выпуклостью» (чтобы получился центр цветка)
   • Выберите слой с кругом и нажмите Ctrl+T, чтобы войти в свободное трансформирование.
   • Нажмите «Деформация» (маленький значок сетки) в левом верхнем углу панели трансформирования, чтобы появились управляющие точки деформации.
   • В раскрывающемся списке «Деформация фигуры» сверху выберите «Выпуклость».
   • Потяните центральную управляющую точку внутрь, чтобы середина круга слегка просела (примерно 30% силы деформации), затем нажмите Enter для подтверждения.
3. Добавьте стиль слоя — «Наложение градиента»
   • Дважды щёлкните по слою с кругом, чтобы открыть диалог «Стиль слоя».
   • Включите «Наложение градиента» и щёлкните по полосе градиента, чтобы его отредактировать:
   • Левый цвет #2c3e50 (тёмный), непрозрачность 100%.
   • Правый цвет #95a5a6 (бледно-серый), непрозрачность 0%.
   • Оставьте угол 90°, масштаб 100%, стиль «Линейный».
   • Нажмите ОК — круг начнёт плавно переходить от тёмного к бледному.
4. Постройте форму одного лепестка
   • Создайте новый пустой слой и инструментом «Фигура» нарисуйте два одинаковых круга (радиус примерно 20% общей ширины — хороший вариант).
   • Чтобы их было лучше видно, сначала уменьшите непрозрачность заливки обоих кругов (скажем, 30%), затем проверьте, насколько они перекрываются.
   • Выделите оба слоя с кругами и нажмите Ctrl+E, чтобы объединить их в один слой.
   • Переключитесь на «Выделение контура» (A) и убедитесь, что фигура выделена на панели «Контуры».
   • В «Обработке контуров» (верхняя панель) выберите «Пересечение» и щёлкните по области перекрытия двух кругов, чтобы получить новую фигуру — контур лепестка.
   • Контур теперь объединён в один компонент фигуры.
5. Добавьте лепестку заливку и «Наложение градиента»
   • Выберите слой с лепестком и откройте «Стиль слоя».
   • Задайте цвет заливки #000000 (или опустите непрозрачность до 0), чтобы сплошной цвет не просвечивал.
   • Включите «Наложение градиента» и постройте такой градиент:
   • Левый цвет #ffffff (белый), непрозрачность 100%.
   • Правый цвет тоже #ffffff, непрозрачность 0%.
   • Задайте угол 90°, чтобы белый растворялся от основания лепестка к кончику.
   • Добавьте ещё один стиль слоя — «Внутреннее свечение»:
   • Выберите сине-серый чуть светлее фона, например #d0e0e5.
   • Оставьте режим наложения по умолчанию — «Осветление» — и задайте размер около 20px.
6. Дублируйте и поворачивайте, пока не получится полное кольцо лепестков
   • Убедитесь, что активен всё ещё инструмент «Перемещение / Свободное трансформирование» (V), а не «Выделение контура».
   • Нажмите Alt+Shift+T, чтобы запустить «Свободное трансформирование с дублированием».
   • Когда появится рамка трансформирования, удерживайте Alt и перетащите центр трансформирования к **кончику** лепестка, чтобы поворот шёл вокруг этой точки.
   • Введите **30°** в поле угла на панели параметров (или любое нужное расстояние); подтвердите — появится новый лепесток.
   • Продолжайте нажимать Ctrl+Alt+Shift+T (повторить последнее свободное трансформирование) — каждое нажатие копирует предыдущий лепесток и поворачивает его на тот же угол.
   • Повторяйте, пока лепестки не замкнутся в круг (их примерно 12–14). Удалите лишние слои лепестков, которые не нужны.
   Совет: не дублируйте «Выделением контура», иначе новые лепестки добавятся в тот же компонент контура и позже их будет трудно править по отдельности. Оставайтесь на «Перемещении / Свободном трансформировании» — тогда каждый лепесток станет отдельным слоем.
7. Проверьте симметрию и доведите детали
   • Включите Просмотр → Новая направляющая (Ctrl+R) и вытяните горизонтальную и вертикальную направляющие из центра холста, чтобы проверить симметрию слева-справа.
   • Если какие-то лепестки стоят не на месте, выберите слой и через Ctrl+T подправьте угол поворота или положение.
   • Выделите все слои лепестков (Shift+щелчок) и задайте **непрозрачность 95%** на панели параметров — общий вид станет мягче.
8. Общий размер и финальный экспорт
   • Выделите все слои (центр цветка и лепестки), затем через Ctrl+T отмасштабируйте всю иконку до нужного размера.
   • Когда всё готово, выберите Файл → Экспортировать как → PNG (прозрачный) и сохраните локально.

Источники

• Online PS
• Официальная документация Adobe
• Сайты с уроками по PS