Бесплатные видео уроки по Фигме для обучения начинающих с нуля

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

В этом уроке мы познакомимся с одним из самых важных и часто используемых инструментов программы Фигма, а именно — с инструментом «Текст». Разберем варианты как можно создать текстовые слои, а также с тем, какие у них есть свойства и параметры.

Как сделать текст по кругу в фигме с помощью плагина

В этой статье я расскажу и покажу на конкретном примере, как в программе Figma расположить текст по кругу (окружности) или полукругу. Такой функционал пока что не предусмотрен в самой фигме, поэтому для получения нужного результата мы будем использовать специальный плагин.

Плагины для работы с текстом фигме, его изменения и искажения

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

Как перевести текст в вектор или кривые в фигме

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

Как изогнуть текст в фигме дугой

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

Как сделать обводку, тень, подчеркивание или ссылку текста в фигме

Сегодня поговорим о различных эффектах, которые можно применить к тексту в Figma, а именно про его подчеркивание, обводку и тень. Также разберемся, как можно сделать кликабельную ссылку в этом графическом редакторе.

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

Изображение, фотография или текстура в тексте — очень интересный прием визуального дизайна, способный украсить ваш макет. В этом уроке я покажу несколько способов создания такого эффекта на конкретных примерах.

Как растянуть, исказить или деформировать текст в фигме по ширине, высоте или в перспективе

Этот урок посвящен различным деформациям и искажениям текста в программе фигма. Здесь вы узнаете, как вытянуть текст по ширине или высоте, сделать его в перспективе или деформировать любым другим нужным вам образом.

Как изменять текст в фигме (шрифт, размер, жирность, цвет, наклон)

В этом уроке мы разберемся, как проводить различные изменения текста в фигме: как поменять его шрифт, увеличить или уменьшить размер, выделить цветом, сделать жирным или наклонным. Все эти приемы редактирования проиллюстрируем на конкретных примерах.

Как создать, открыть, сохранить, скачать, экспортировать и удалить файл или проект в фигме

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

Графический редактор Фигма — бесплатная онлайн программа для дизайна на русском

Сегодня мы познакомимся с программой Figma — графическим редактором для дизайна сайтов и мобильных приложений. Узнаем, как бесплатно использовать её онлайн, как её скачать и установить на свой компьютер (ПК), перевести на русский язык, сделать для неё темную или светлую тему.

Как вставить, обрезать и редактировать изображения (картинки, фото) в фигме

В сегодняшнем уроке поговорим про редактирование изображений в программе фигма. Посмотрим, как их добавлять в проект, обрезать в форме круга или по произвольному контуру, применять эффект размытия, делать черно-белыми и конечно же сохранять.

Размеры визиток, листов А4, сайтов, баннеров, карточек и других фреймов в фигме

В этом уроке мы рассмотрим наиболее популярные размеры фреймов для дизайна в фигме. Разберемся с размерами для мобильных приложений, сайтов, визиток, листов А3, А4, А5 и других форматов. Рекомендую посмотреть видео-версию урока, в ней всё будет показано максимально наглядно и на конкретных примерах.

Как загрузить, добавить и установить русский шрифт с кириллицей в фигму

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

Проблемы с фигмой: почему она не открывается, почему не работают шрифты или плагины

Сегодня рассмотрим наиболее популярные проблемы, возникающие при работе в фигме. Узнаем, что делать если фигма не загружается и не открывается, как решить проблемы с шрифтами и плохим качеством экспорта изображений из этой программы.

Как делать фигуры в фигме — круг, прямоугольник, квадрат и произвольные формы

Данный урок посвящен работой с фигурами и формами в фигме. Вы узнаете, как в фигме нарисовать круг, прямоугольник или квадрат со скругленными углами, как соединять и обрезать фигуры, а также как нарисовать фигуру произвольной формы. К уроку прилагается видео-версия, где я показываю всё это более детально.

Как делать линии, стрелки, обводки, рамки и контуры фигур в фигме

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

Сочетания горячих клавиш фигмы для сетки, текста, слоев, фреймов, линеек и т д

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

Как в фигме сделать сетку и включить направляющие линии горячими клавишами

В этом уроке вы узнаете, какие бывают модульные сетки в фигме, как их включить или убрать, чем они отличаются между собой и от линеек с направляющими линиями. Также мы разберем горячие клавиши для работы с сетками и направляющими и узнаем, какие размеры лучше задавать при создании сетки для сайтов и мобильных приложений.

Как сделать иконку в фигме или найти готовую с помощью плагинов (svg, пнг, 3д)

Сегодняшний урок полностью посвящен иконкам в фигме. Я покажу, как их можно нарисовать, а также где найти готовые векторные или объемные (3д). Также я покажу несколько хороших плагинов для иконок в фигме. Еще вы узнаете, как сохранять иконки в форматах свг и пнг. Советую смотреть этот урок в видео-формате, поскольку там я показываю всё это более подробно, чем в текстовом варианте.

Как сделать красивый градиент в фигме для фигуры, текста, фона или фото

Сегодня поговорим о градиентах. Посмотрим, какие градиенты можно создавать стандартными методами фигмы, а какие — с помощью плагинов. Научимся делать золотые и серебрянные переходы, а также подробно разберемся с настройками данного функционала программы.

Слои, группы, фреймы и секции в фигме — как их создать и объединить

На сегодняшнем уроке вы научитесь работать со слоями в фигме. Вы узнаете как их создавать и удалять, перемещать и объединять. Также я расскажу о назначении и возможностях групп, фреймов и секций в фигме.

Макеты и шаблоны фигмы — как создать, перенести в тильду или html, где найти готовые

Это обзор на тему шаблонов и макетов в фигме. Сегодня поговорим о том, как их сделать, как импортировать из фигмы в тильду или html и css код, где бесплатно найти уже готовые макеты и шаблоны для сайтов и презентаций, а закончим тем как их сохранять в разных форматах.

Как сделать презентацию в фигма слайдах с нуля или на основе шаблонов

Давайте познакомимся с одним из инструментов фигмы - слайдами, с помощью которых можно делать красивые презентации, а также сохранять их в пдф формате. По сути, слайды - это аналог powerpoint от фигмы. Также в этом уроке мы рассмотрим шаблоны фигма слайдов и научимся их редактировать.

Как сделать эффект матового стекла, рваной бумаги или неонового свечения в фигме

Эта статья раскрывает методы создания различных эффектов в фигме от простого шума или тиснения до сложного ребристого стекла, мятой бумаги или неонового свечения. Вы научитесь применять тени, размытия и плагины для создания необычных и красивых эффектов. Для лучшего понимания рекомендую смотреть данный урок в видео-формате.

Как перевести растровое изображение в вектор и редактировать его в фигме

Урок про вектор и растр в фигме. Вы узнаете, какими плагинами можно преобразовать пнг картинку или фото в векторное изображение и наоборот, как объединять, обрезать и разделять векторные фигуры, а также как делать для них заливку, удалять и добавлять новые точки и линии.

Как в фигме сделать и сохранить анимацию кнопок, текстов и картинок на сайте или в презентации

В сегодняшнем уроке я на конкретных примерах пошагово покажу, как сделать различные анинимации в программе фигма. Вы научитесь делать анимацию кнопок, текстов, картинок и других элементов сайтов и презентаций. Также вы узнаете, какой плагин можно использовать чтобы сохранить (экспортировать) анимацию в видео или гиф-формате.

Как сделать кликабельную кнопку или ссылку в фигме

Интерактивные кнопки и ссылки — очень важный элемент любого сайта или приложения. Сегодня мы разберемся, чем они отличаются друг от друга, и конечно же научимся самостоятельно делать кликабельные кнопки и ссылки в прототипах фигмы.

Как сделать или убрать компонент в фигме

Урок посвящен знакомству с компонентами и вариантами в фигме. Мы рассмотрим, как можно создать компонент из обычного фрейма с помощью горячих клавиш или без них, как отменить привязку дочернего компонента к родительскому мастеру, как добавить и использовать варианты компонентов в ваших проектах.

Как сделать и использовать обтравочную маску в фигме для картинок, изображений и других слоев

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

Как начать работать в программе фигма с нуля — инструкция для чайников

Если вы ищете максимально и простую и понятную инструкцию для чайников по работе в фигме, этот туториал — то что вам нужно. Здесь вы узнаете, как с нуля научиться работать в программе фигма, познакомитесь с интерфейсом и основными инструментами этого приложения (фреймы, фигуры, картинки, текст), а также создадите свой первый дизайн-макет.

Как сделать векторный логотип в фигме — нарисовать графику и создать текстовую часть

Урок о том, как нарисовать логотип в программе фигма. Вы узнаете, как сделать графическую и текстовую часть логотипа, создать палитру цветов, сохранить и скачать логотип в векторном или растровом формате. Рекомендую проходить этот урок в видео-формате — там я пошагово показываю как сделать логотип в фигме на конкретном примере.

Как сделать визитку в фигме — форматы, шрифты, цвета, размеры для печати

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

Как сделать дизайн-макет сайта в фигме — урок с примерами

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

Как сделать дизайн карточки товара (инфографику) для маркетплейсов вб и озон в фигме

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

Плагины фигмы — цвета и шрифты, эффекты и мокапы, градиенты и тени, стрелки и линии, таблицы и диаграммы

Плагины - это мини-программы, дополняющие основной функционал фигмы. С их помощью можно создавать различные эффекты, генерировать таблицы, диаграммы и стрелки, подбирать шрифты и цвета, переводить дизайн-макеты в HTML и вставлять их в мокапы различных устройств. Сегодня мы расскажем, где найти, как установить и как пользоваться плагинами в программе фигма.

Плагины для изображений в фигме — бесплатные картинки и иконки, удаление фона, улучшение качества, перевод в вектор и 3д

Подборка посвящена плагинам программы фигма, предназначенным для работы с изображениями - фотографиями, картинками, 3д иллюстрациями и иконками. Вы узнаете, как в фигме заменить фотошоп, удалить фон, улучшить качество изображения, перевести его из пнг в вектор.

Страницы сайтов и файлов в фигме — как их создать и сделать переходы

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

Как отменить действие в фигме и вернуть назад пропавшую панель или удаленный файл

Вы что-то нажали в фигме и у вас всё пропало? Не переживайте, в этом уроке мы разберемся, как отменить последнее действие в фигме, вернуть пропавшую панель инструментов и слоев, восстановить удаленный файл или вернуться назад на несколько шагов к предыдущей версии. О том, как отменить отмену и вернуться на шаг вперед, также поговорим.

Как сделать красивую реалистичную тень любому объекту или тексту в фигме с помощью плагина или без

В сегодняшнем уроке я покажу, как сделать реалистичную или просто красивую тень для любого предмета или текста в фигме. Я расскажу, какие стандартные способы добавить тень объекту есть в этой программе, а также как создать тень с помощью плагинов или вручную.

Как пользоваться инструментом перо в фигме, фотошопе, иллюстраторе и других программах

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

Готовимся к возможной блокировке Figma — пробуем Pixso

Слухи о возможной блокировке Figma в России и Беларуси заставляют дизайнеров искать альтернативы. В статье разбираем, насколько реальна угроза, почему стоит подготовиться заранее — и почему китайский сервис Pixso может стать достойной заменой: он похож на Figma, открывает .fig-файлы и не подвержен санкционным рискам.

Как в фигме делать бесплатные мокапы телефонов, айфонов, ноутбуков и одежды с плагинами и без

Статья посвящена использованию мокапов в Figma — от базового понимания, зачем они нужны, до практических способов их создания и интеграции. Рассматриваются как самостоятельное изготовление мокапов, так и применение плагинов, ресурсов Figma Community и внешних инструментов, таких как Photoshop или онлайн-редакторы. Материал будет полезен дизайнерам, желающим профессионально презентовать свои работы в портфолио или клиентским проектам.

Панели инструментов и слоев в интерфейсе Фигмы: как их открыть, убрать или увеличить

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

Как сделать интерактивный кликабельный прототип и анимацию сайта или приложения в фигме

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

Стили текста и цвета в фигме — как создать, скопировать, перенести и удалить

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

Как сделать, изменить и посмотреть расстояния и отступы в фигме — межстрочные, между абзацами и другими объектами

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

Как сделать фигму на русском языке онлайн или бесплатно скачать альтернативную программу

В этом уроке объясняется, можно ли перевести интерфейс программы Figma на русский язык и как это сделать. Рассматриваются способы изменения языка в онлайн-версии через браузер Google Chrome, а также предлагается бесплатная альтернатива — программа Pixso, полностью поддерживающая русский язык. Урок будет полезен новичкам, которые испытывают трудности с английским интерфейсом и ищут удобные инструменты для работы.