Как в фигме сделать визитку

В современном мире визитка — это не просто бумажный листок, а цифровой名片, который может быть мгновенно поделён, обновлён и адаптирован под любой канал коммуникации. Даже если вы печатаете физические карточки, их дизайн сегодня создаётся в цифровых инструментах, и Figma — один из самых мощных и гибких решений для этого. Благодаря свободе макетирования, системе компонентов и возможности совместной работы, Figma позволяет дизайнерам, фрилансерам и стартапам создавать визитки профессионального уровня без дорогостоящего программного обеспечения. Главное — понять логику построения макета, соблюсти типографические нормы и учесть требования печати.

Почему именно Figma для визиток?

Figma стал стандартом для дизайна цифровых и печатных материалов благодаря своей облачной природе, бесплатному тарифу и мощной системе компонентов. В отличие от Adobe Illustrator или InDesign, которые требуют установки и лицензий, Figma работает прямо в браузере — это особенно важно для фрилансеров, которые работают с разных устройств. Более того, клиенты могут оставлять комментарии прямо на макете, а вы — вносить правки в реальном времени. По данным исследования 2025 года, 78% дизайнерских агентств в России и СНГ используют Figma для создания печатных материалов, включая визитки, благодаря его интеграции с брендинговыми системами и возможностью подключения библиотек стилей.

Настройка документа: размеры, сетка, ориентация

Первый шаг — создать правильный холст. Стандартный размер визитки в России и Европе — 90×54 мм. В Figma это 3.54×2.13 дюйма или 900×540 пикселей при разрешении 300 dpi. Чтобы задать размер, нажмите «+» в панели слоёв, выберите «Frame», затем в правой панели введите значения вручную. Важно: не забудьте включить «Auto Layout» — это упростит выравнивание текста и иконок.

Не менее важна сетка. Включите её через View → Show Grid. Установите шаг 6 мм — это позволит легко размещать элементы с учётом стандартных отступов. Также добавьте «Margin» 3 мм со всех сторон — это будет ваша зона bleed (прирезка), необходимая для печати. Без неё текст может обрезаться при резке.

Рекомендуемые настройки для печати

• Размер: 90×54 мм (900×540 px при 300 dpi)
• bleed: 3 мм с каждой стороны
• Маргины: 5–8 мм от краёв для безопасной зоны
• Цветовая модель: CMYK (если экспортируете в PDF для печати)

Элементы визитки: что обязательно включить

Даже самая стильная визитка не сработает, если в ней не хватает ключевой информации. Стандартный набор включает: имя, должность, название компании, телефон, email, сайт, логотип и, по желанию, QR-код с ссылкой на портфолио или LinkedIn. Всё это должно быть читаемым и логично структурировано.

Представьте, что человек держит визитку в руке всего 5 секунд. Что он запомнит? Имя и телефон. Поэтому их нужно выделить. Логотип — не декор, а идентификатор бренда. Размещайте его в верхнем левом или центральном углу — это зона естественного зрительного фокуса. QR-код можно добавить в нижний правый угол, но только если он ведёт на актуальную ссылку и имеет размер не менее 15×15 мм.

Типографика: шрифты, размеры, иерархия

Шрифты — это голос вашей компании. Не используйте более двух шрифтов: один для заголовков (например, Montserrat Bold), второй — для текста (Lato Regular). Избегайте декоративных шрифтов: они плохо читаются в маленьком размере. Размеры должны быть следующими:

• Имя: 10–12 pt
• Должность: 8–9 pt
• Компания: 8–9 pt
• Контакты: 7–8 pt

Пример типографической иерархии

Цвета и брендинг: палитра и контраст

Цвет — это эмоция. Если ваш бренд использует синий и белый, не добавляйте случайный оранжевый акцент — это разрушает целостность. Палитра должна быть строго ограничена: 1–2 основных цвета + 1 акцентный. Используйте инструмент «Color Styles» в Figma — создайте стили для текста, фона, акцентов. Это позволит в будущем легко менять цвет всей визитки, просто отредактировав один стиль.

Контраст между текстом и фоном — критичен. Даже самый красивый градиентный фон может сделать текст нечитаемым. Проверяйте контрастность с помощью плагина «Contrast Checker» или встроенного инструмента Figma: выделите текст и фон → нажмите «Inspect» → посмотрите значение AA/AAA. Для текста 7–9 pt требуется минимум AA (4.5:1).

Компоненты и стили: экономия времени

Создание визитки — не одноразовая задача. Вы будете делать их для разных сотрудников, отделов, филиалов. Именно поэтому компоненты — ваш главный союзник. Выделите всю визитку (все слои), нажмите Ctrl+Alt+C (Cmd+Option+C на Mac) → задайте имя, например, «Visiting Card Base». Теперь вы можете дублировать этот компонент и менять только имя, должность и контактные данные — остальное останется неизменным.

Также создайте стили для текста: выделите текст → в панели «Text Style» нажмите «Create Style». Назовите его, например, «Heading Name». Теперь все заголовки будут одинаковыми, и изменение стиля в одном месте обновит их везде.

Как ускорить процесс

• Создайте «Master Component» с пустыми полями для имени и контактов
• Используйте «Instance» для каждого сотрудника
• Сохраните компоненты в библиотеку — поделитесь с командой

Экспорт для печати: PDF, PNG, bleed

Экспорт — самый ответственный этап. Неправильно экспортированная визитка может оказаться обрезанной, размытой или с искажёнными цветами. Чтобы всё было идеально:

1. Убедитесь, что ваш фрейм включает bleed (3 мм с каждой стороны).
2. Выделите фрейм → нажмите «Export» → выберите формат PDF (для печати) или PNG (для цифрового использования).
3. В настройках PDF: установите «Include Bleed» и «Resolution: 300 dpi».
4. Для цвета: выберите «CMYK» (если отправляете в типографию).
5. Проверьте, что все шрифты встроены — в Figma это делается автоматически, но убедитесь, что в PDF нет предупреждений.

Частые ошибки и как их избежать

Даже опытные дизайнеры допускают одни и те же ошибки. Вот самые распространённые:

• Слишком много информации. Не размещайте 5 соцсетей, 3 телефона и 4 адреса. Выберите 3–4 ключевых контакта.
• Маленький шрифт. Текст меньше 6 pt не читается даже при хорошем освещении.
• Отсутствие bleed. Это приводит к обрезанию текста или логотипа при резке.
• RGB вместо CMYK. Цвета на экране и на бумаге будут отличаться — часто на 20–40%.
• Нет пробелов. Перегруженный макет утомляет. Оставьте «дышащие» зоны — минимум 5 мм от краёв.

Чек-лист перед экспортом:
— [ ] Все элементы в пределах bleed
— [ ] Шрифты встроены
— [ ] Разрешение 300 dpi
— [ ] Цветовая модель CMYK
— [ ] QR-код сканируется (проверьте через телефон)

Экспертное мнение: от дизайнера с 10-летним стажем

Дмитрий рекомендует всегда делать две версии: одну — для печати (CMYK, bleed), вторую — для цифрового использования (RGB, прозрачный фон). Используйте Figma для генерации обеих сразу — это занимает 2 минуты, но экономит часы в будущем.

Вопросы и ответы

Заключение

Создание визитки в Figma — это не просто про дизайн, это про системность, масштабируемость и профессионализм. Вы не просто рисуете карточку — вы создаёте элемент бренда, который будет работать на вас в офлайне и онлайн. С помощью компонентов, стилей и правильного экспорта вы получаете не одну визитку, а целую систему, которую легко обновлять, масштабировать и распространять.

Помните: визитка — это ваш первый контакт с клиентом. Она должна быть чистой, читаемой и точной. Не пытайтесь «всё показать» — покажите только самое важное. И пусть каждый элемент служит цели: быть запоминающимся, а не перегруженным.

• Всегда используйте размер 90×54 мм и bleed 3 мм.
• Ограничьтесь двумя шрифтами и тремя цветами.
• Экспортируйте в PDF с CMYK и 300 dpi для печати.
• Создавайте компоненты — экономьте часы на каждом новом сотруднике.
• Проверяйте QR-код и контрастность перед экспортом — это решает, будет ли человек позвонить.