Figma

74

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

С помощью этих туториалов вы сможете прямо в Figma показать разработчикам или клиентам, как будут работать отдельные UI-элементы в дизайне

Перевод статьи Патрика Моргана, где он делится опытом создания презентаций в Figma. Он рассказывает, как правильно организовывать презентации в Figma-файлах, выстраивать структуру страниц, оформлять основные слайды, называть фреймы, анимировать их и в каком порядке размещать их на холсте

Мы сделали подборку коротких видео-туториалов, которые помогут на практике научиться создавать различные WOW-эффекты в Figma

Помните, недавно мы рассказывали про cайт таск-менеджера Linear с эффектными подсветками? Фонс Мэнс подготовил пошаговый урок по созданию таких градиентов. Он сделал его прямо в Figma-файле, который можно скопировать и там же посмотреть все этапы и настройки

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

Мы собрали плагины, которые помогают быстро генерировать и редактировать иконки, а именно: делать иконки pixel-perfect, заливать контурные иконки, экспортировать их во всевозможных размерах и форматах, создавать собственную библиотеку иконок и другое. Вы также найдёте наборы с сетками для отрисовки собственных иконок

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

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

Мы отобрали плагины Figma, которые работают на базе искусственного интеллекта. Они помогут переименовывать слои в один клик, генерировать иконки, картинки, «рыбный» текст, аватары, 3D-иллюстрации, увидеть собственные работы глазами нейросети, быстро проводить исследования юзабилити и извлекать огромное количество цветовых палитр из библиотеки Unsplash

Мы собрали в один пост все подборки с Figma-плагинами, которые публиковали в течение года. Получилась целая библиотека плагинов с удобным распределением по категориям

Перевод треда Молли Хеллмут об ошибках, которые часто допускают дизайнеры при разработке и использовании дизайн-системы, и моментах, на которые стоит обратить внимание, чтобы дизайн-система была гибкой и удобной

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

В подборку вошли несколько заготовок для разработки дизайн-систем и плагины для управления ими. Они помогут быстро создать целостный и последовательный дизайн для любого проекта

Мы сделали подборку Figma-библиотек и ресурсов с иконками, иллюстрациями, шрифтами, фотографиями, паттернами и текстурами для оформления зимних и новогодних проектов

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

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

Плагины для работы с изображениями помогут сгенерировать нужную картинку по запросу, вставлять большие изображения в Figma и сжимать их без потери качества, удалять фон и лишнее пространство, разрезать картинку на части, находить, собирать и упорядочивать все изображения в одном месте. Вы сможете редактировать изображения, накладывать фильтры и применять эффекты прямо в Figma. А ещё распознавать […]

Если дизайнер использовал в Figma-файле компоненты, стили для текста и цветов и передал вам такой макет для дальнейшей работы, то вам повезло. Но иногда приходится начинать работу с файлом, где царит полный хаос

Плагины для работы с цветом предоставляют огромный выбор готовых цветовых палитр, помогают создавать собственные цветовые схемы, сделать в пару кликов тёмную тему на базе цветов светлой темы, сгенерировать цветовую палитру на основе изображения, быстро составить цветовую схему для дизайн-системы, а также узнать цвета, которые используют мировые бренды

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

Figma Community содержит множество коллекций 3D-изображений и иконок на самые разные темы: бизнес, маркетинг, социальные сети, метавёрс, электронная коммерция, музыка, а также абстрактные 3D-объекты в разных ракурсах и стилях. При работе над проектом вы сможете найти нужные 3D-элементы на все случаи жизни, не выходя из Figma

Я отобрала плагины, которые помогут сгенерировать необходимые элементы для проекта за пару кликов: геометрические или абстрактные шейпы, узоры, аватары, диаграммы, таблицы, волны, цветовые палитры и тени, календари, QR-коды и даже рейтинги из звёзд