Рейтинг в Figma: UI

Плагин Font Awesome Icons предоставляет доступ к обширной бесплатной коллекции векторных иконок, которые можно легко использовать в ваших проектах. Иконки можно фильтровать по имени для быстрого поиска нужной.

Purity UI Dashboard - это современная и сложная бесплатная ReactJS панель управления, созданная на основе Chakra UI. Разработанная Creative Tim и Simmmple, она идеально подходит для тех, кто ценит современный UI и красивые веб-сайты. Благодаря сотням элементов, дизайнерским блокам и полностью закодированным страницам, Purity UI Dashboard предоставляет все необходимое для создания потрясающих веб-сайтов и веб-приложений. Она включает в себя готовые примеры страниц, такие как вход и профиль, с различными вариантами дизайна, чтобы вы могли быстро приступить к работе.

Эта анимация счетчика использует тот же метод, что и анимация увеличения/уменьшения счета из Two-Step Loader. Она идеально подходит для визуального представления данных, динамически меняющихся чисел или прогресса в пользовательском интерфейсе. Она позволяет плавно и привлекательно отображать числовые значения, делая интерфейс более информативным и удобным.

Eva Icons от Iconduck – это бесплатная библиотека из 490 иконок с открытым исходным кодом, идеально подходящих для дизайна мобильных приложений, веб-сайтов и других продуктов. Они охватывают широкий спектр применений, включая пользовательский интерфейс, социальные сети (логотипы Twitter, GitHub и т.д.) и редакторы текста. Вы можете легко перетаскивать иконки, быстро находить нужные, а также добавлять их в свои проекты одним щелчком мыши.

Avvvatars.com - это легковесная и настраиваемая библиотека React UI с открытым исходным кодом, предназначенная для создания уникальных аватаров-заполнителей в ваших React-проектах. Она предлагает разнообразные фигуры и возможности кастомизации, что позволяет легко добавлять красивые и индивидуальные аватары без использования изображений. Идеально подходит для проектов, где требуется отображение пользовательских аватаров без загрузки реальных фотографий.

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

Бесплатный макет устройства для UI-презентаций 2023 года включает в себя мокапы iPhone, Android, планшета и MacBook. Он идеально подходит для демонстрации дизайна вашего приложения или веб-сайта на различных устройствах. Легко настраивается благодаря организованным слоям, изменяемым цветам, фонам и отдельным слоям света и тени. Это отличный способ визуально представить ваш дизайн и произвести впечатление на клиентов или пользователей.

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

Ускорьте свой дизайн-процесс с помощью AI DesignGen – плагина для Figma, который генерирует полностью редактируемые UI-компоненты из текстовых запросов на естественном языке. Просто опишите желаемый элемент интерфейса, например, "современная страница авторизации" или "ценовой блок с тремя тарифами", и плагин мгновенно создаст готовый к использованию макет в Figma. Редактируйте стили, меняйте структуру и воплощайте свои идеи в визуальные решения в один клик, экономя время и силы на разработке с нуля.

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

Node Inspector - это плагин, предназначенный для разработчиков плагинов Figma. Он позволяет просматривать и копировать свойства узлов, компонентов и стилей в Figma, что упрощает процесс разработки и отладки плагинов. С его помощью можно инспектировать свойства выбранных узлов на холсте, компонентов из общих библиотек, а также локальные и общие стили, выбирая их по ID или ключам.

Versatile Tables – это набор шаблонов таблиц данных, разработанных для настольных приложений. Он включает в себя различные состояния взаимодействия, адаптивное масштабирование и предназначен для использования в десктопных приложениях. Шаблоны содержат настраиваемые свойства, светлую и темную темы, а также компоненты по умолчанию, что позволяет дизайнерам и разработчикам легко адаптировать их под свои нужды.

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

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

Upspeed - плагин Figma, который мгновенно преобразует ваши проекты Figma в production-ready код для Android, экономя время на разработке UI. Он автоматически генерирует оптимизированный код, используя подходящие UI-конструкции, что сокращает несоответствия между дизайном и разработкой. Вы можете свободно редактировать сгенерированный код, что позволяет быстрее создавать уникальные решения.

Uber Eats App Redesign - это мобильное приложение, разработанное для революции в сфере доставки еды. Оно предоставляет пользователям удобный доступ к разнообразным блюдам из местных ресторанов, позволяя просматривать меню, делать заказы и получать доставку прямо к своей двери. Интуитивно понятный интерфейс упрощает навигацию, позволяя легко находить ближайшие заведения, настраивать заказы и отслеживать доставку в реальном времени. Благодаря удобным способам оплаты и надежной поддержке клиентов, Uber Eats App Redesign стремится изменить то, как пользователи наслаждаются едой, не выходя из дома или офиса.

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

Material UI Sync создает готовые к использованию темы, беря за основу настроенный Material UI Design Kit. Плагин поддерживает кастомизацию дизайн-токенов, включая цветовые палитры, типографику, брейкпоинты, отступы, скругления и тени. Также генерируется код тем для стилизации компонентов, сейчас это кнопки и переключатели. Плюс, есть предпросмотр в Storybook, чтобы оценить тему прямо в Figma. Material UI Sync предназначен для работы с Material UI for Figma Design Kit v5.16.0 и новее.

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

Этот циферблат демонстрирует концепцию дизайна с анимацией и пользовательскими кривыми, облегчающими визуализацию течения времени. Использование Smart Animate и настроенных кривых позволяет наглядно показать, как время проходит, делая восприятие более интуитивным и динамичным. Такой подход к дизайну циферблата может быть полезен для создания более привлекательного и информативного интерфейса часов.

Плагин Figma to shadcn/ui позволяет быстро создавать код shadcn/ui на основе дизайнов Figma. Он экономит время на реализацию, автоматически генерируя компоненты shadcn/ui и управляя переменными, что упрощает взаимодействие между дизайнерами и разработчиками.

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

Unity Figma Importer - это мощный инструмент, который упрощает перенос ваших дизайнов из Figma в Unity, позволяя легко создавать UI элементы. Он связывает код с макетами, ускоряя разработку визуально привлекательных Unity приложений с высокой точностью. Для импорта дизайна Figma в Unity необходимо также использовать пакет Unity Figma Importer.

DesignFast: Mesh Gradient Generator позволяет с легкостью создавать сложные сетчатые градиенты в Figma, расширяя ваши дизайнерские возможности. Благодаря предпросмотру в реальном времени, поддержке различных макетов сетки, широкому выбору цветовых палитр и управлению шумом, вы сможете добавлять глубину и текстуру вашим градиентам. Превратите простые проекты в потрясающие визуальные эффекты и раскройте свой творческий потенциал.

Этот шаблон диаграммы классов (UML) предназначен для визуализации структуры системы, позволяя описывать классы, их атрибуты (с указанием модификаторов доступа) и методы. Он поддерживает абстрактные классы и интерфейсы, предлагает несколько цветовых тем и гибкую настройку порядка свойств и методов. Шаблон упрощает создание четких и понятных диаграмм классов для документирования и проектирования программного обеспечения.

Formplay – это Figma-плагин, соединяющий код и дизайн-системы для упрощения создания форм. Дизайнеры могут использовать drag-and-drop компоненты для быстрого проектирования UI форм, а разработчики – получать готовый к использованию код прямо из Figma. Formplay, основанный на Formilyjs, обеспечивает эффективную разработку и бесшовную интеграцию дизайна в рабочий процесс.

Dark Matter – это плагин для Figma, который позволяет быстро переключаться между светлым и темным режимами отображения рабочей области. После установки и запуска плагин добавляет кнопку в панель свойств (Design) при отсутствии выбранных фреймов. Просто нажмите на кнопку, чтобы изменить цвет фона холста с #E5E5E5 (светлый) на #1E1E1E (темный) и наоборот. Плагин активен для всех страниц в файле после первого запуска.

Layerbeam – это инструмент, позволяющий быстро тестировать пространственные UI-дизайны в VR. С его помощью можно проектировать приложения для платформ пространственных вычислений, создавать интерактивные прототипы приложений Vision Pro, Quest Augments и XR игровых UI в Figma, а также тестировать дизайны в виртуальной среде или в режиме дополненной реальности. Подключение к VR-гарнитуре осуществляется с помощью простого 6-значного кода.

Kiwiui – это инструмент, который преобразует ваши Figma-дизайны в высококачественный, готовый к использованию код для React, Angular и Vue.js. Он позволяет организовать элементы дизайна во фреймы, автоматически распознает текстовые и графические элементы (используя суффиксы __img и __span), а также преобразует фреймы с суффиксом __C в компоненты кода. Kiwiui нацелен на упрощение и ускорение разработки, предоставляя настраиваемый и понятный код для повышения производительности.

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

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

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

Knob Maker - это плагин для создания элементов управления в виде круговых регуляторов. Для его использования необходимо создать фрейм с двумя дочерними элементами: "Center" и "Rotating Pointer". Укажите количество кадров и градусов поворота в плагине, чтобы сгенерировать анимацию регулятора. Плагин позволяет быстро и легко создавать анимированные элементы управления для интерфейсов.

Automotive Design for Compose – это расширение для Jetpack Compose, позволяющее определять интерфейсы (экраны, компоненты, оверлеи) непосредственно в Figma. Разработчик указывает Composables, которые нужно взять из Figma, а дизайнер их отрисовывает. Поддерживается большинство функций Figma, включая Auto Layout и Interactions. Виджет Auto content preview позволяет настраивать и предпросматривать макеты списков и сеток. Это опенсорсный инструмент, доступный на GitHub, что упрощает создание автомобильных интерфейсов.