Найти тему
ИТ с нуля

Как создать объект с фото и надписью в Figmа.

Как создать объект с фото и надписью в Figmа
Как создать объект с фото и надписью в Figmа

1. Создаем Фрейм

Фрейм или артборд — основной элемент рабочей области Фигмы, который будет объединять все объекты, помещенные в него.

Он может быть страницей сайта, экраном мобильного приложения или просто графическим объектом, который можно использовать для оформления соц сетей.

Создать Фрейм можно с помощью клавиши F или нажав на значок на верхней панели инструментов.

Кнопка Фрейм
Кнопка Фрейм

Размер фрейма можно установить самостоятельно или выбрать готовые размеры экранов на панели инструментов справа.

Создадим фрейм, который станет историей для ВК.

ВК рекомендует использовать для историй размер — 1080х1920 пикселей. Этот размер совпадает с одним из стандартных размеров Фигмы.

Выбираем его.

Стандартные размеры фреймов.
Стандартные размеры фреймов.

Установить произвольные размеры можно в разделе Меню Frame на панели инструментов в правой части экрана.

Произвольные размеры
Произвольные размеры

2. Помещаем в фрейм изображение, которое подготовили заранее.

  • Опция Fill (панель инструментов в правой части экрана) – код цвета.
  • В меню Solid выбираем Image
Добавляем изображение в фрейм
Добавляем изображение в фрейм
  • Нажимаем Choose image и загружаем изображение
Фрейм с изображением
Фрейм с изображением

3. Теперь добавим на изображение текст.

Для добавления текста нужно нажать клавишу Т или воспользоваться соответствующей кнопкой на панели инструментов.

Кнопка Текст
Кнопка Текст
  • Разместим область текста на изображение и напишем поздравление
  • Отформатируем текст через меню Text.
  • Шрифт выбираем используя список шрифтов (строка сразу под заголовком Text.)
Панель форматирования текста
Панель форматирования текста

Начертание шрифта Обычное – Regular или Жирное – Bold - Опция Regular

Размер шрифта - Опция Mixed

Цвет шрифта - Selection colors

Цвет границы шрифта - Stroke

Толщина границы шрифта - Outside

Изображение с текстом
Изображение с текстом

4. Экспортируем готовый файл

  • Меню Export
  • Тип файла – PNG/JPG

Впереди еще много интересных и полезных уроков.

Оставайтесь)