10 лучших UI-китов в Figma для вашего проекта

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

Поэтому, я собрал десять самых интересных UI-китов в Figma, которые могут облегчить вашу работу над проектом. Погнали!

Поддержите мое видео!

01. Food delivery app Ui kit

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

02. Сontra wireframe kit

Это стартовый набор каркасов для быстрого проектирования и прототипирования ваших идей. Его библиотека содержит более 150+ компонентов и 50+ готовых к использованию мобильных экранов. Вы также можете легко создавать новые компоненты и экраны с помощью руководства по стилю.

03. Набор элементов для iOS & iPadOS 14

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

04. Material Design UI kit

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

05. Lo-fi Wireframe Kit

Это интересный набор из прототипов рисованного типа. Если Нужно красиво показать проектирование сайта, либо приложения этот пак поможет вам сделать это. Библиотека состоит из более чем 100 компонентов проектирования, которая поможет вам быстрее работать над проектами! В набор входят кнопки, текстовые поля, вкладки, изображения и множество вариантов их использования. А гибкие компоненты, помогут использовать элементы как для мобильных экранов, так и для пк.

06. Pegasus

Система дизайна Pegasus - это гибкий, удобный и доступный набор компонентов, сделанный в Figma. Этот набор создан с использованием компонентов Variants для увеличения скорости рабочего процесса. В библиотеку дизайн системы входит: 300+ компонентов, 72+ оригинальных иконок. Так что, если вам нужны элементы для создания мобильного или веб приложения, то смело используйте этот набор.

07. Figma Wireframe Kit

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

08. Mobile UI kit

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

09. Figma Charts Infographics UI kit

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

10. Ant Design System

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

❤ Если тебе понравилась статья то поддержи ее лайком, а я продолжу делиться полезным о дизайне :)
👋🏻 Я открыт к сотрудничеству, пишите в Телеграм

👉🏻 Также я есть здесь Intagram YouTube Behance

0
36 комментариев
Написать комментарий...
Андрей Крамарь

Опережу обычный для местных говноедов негатив ложкой меда: спасибо за подборку)

Ответить
Развернуть ветку
Пластиковое Окно

Сказал первонах-говноед /0

Ответить
Развернуть ветку
Денис Верхоломчук
Автор

Благодарю! :)

Ответить
Развернуть ветку
Ivan Pomidoroff

По поводу "говноедов", это вам к зеркалу.
А автору подборки спасибо!

Ответить
Развернуть ветку
Андрей Крамарь

Думал, перекличка будет более массовой, всего у двоих триггер сработал)

Ответить
Развернуть ветку
Виктор Акифьев

Огромное спасибо! Особенно за кит для iOS. Когда уже Apple официально появится в Figma со своими китами? Неужели они до сих пор в Sketch работают? (может поэтому iOS так медленно развивается!)

Ответить
Развернуть ветку
Chelsea Lex

Зачем им выпускать кит для figma. Figma — это чисто СНГ инструмент, в остальном мире главенствует великолепный sketch. По крайней мере судя по исследованию, которое я видел пару месяцев назад.

Не понимаю этой повальной любви к Figma. Лагучий кусок непонятно чего, буквально сегодня боролся с ней, с ее лагами и странностями. Стоит режим контуров включить, даже на небольшом проекте (70 фреймов) и все, начинается карнавал. А большие проекты она впринципе может не открыть

Ответить
Развернуть ветку
Максим Синькевич

Чисто СНГ инструмент, Uber, Microsoft, Zoom, Twitter, типичные компании из СНГ.

Ответить
Развернуть ветку
Evgen Madenov

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

За Фигмой будущее. Очень проорал, что это чисто СНГшный инструмент.

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

Ответить
Развернуть ветку
Андрей Крамарь

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

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Александр Рябинин

32 гига оперативы решают все проблемы)

Ответить
Развернуть ветку
Chelsea Lex

32 гига ради фигмы? Спасибо, не надо. Плюс проблема не в оперативке, а в самой фигме

Ответить
Развернуть ветку
Viacheslav Moroz

12 Гб стоит. Открыто по 4 проекта, в каждом несколько сотен экранов. Непонятно, почему у вас проблемы.

Переход из скетча дался мне не сразу, но потом я не раз осознавал, что поступил правильно.

Ответить
Развернуть ветку
Chelsea Lex

Самому хотелось бы это понять

Ответить
Развернуть ветку
Ivan Ivanov

в веб версии?

Ответить
Развернуть ветку
Андрей Крамарь

Что же это за невероятное исследование?

Ответить
Развернуть ветку
Chelsea Lex

Как и сказал, это было пару месяцев назад. Скину, если снова его увижу

Ответить
Развернуть ветку
Андрей Крамарь

Одна бабка в трамвае вилами на воде надвое написала. Ясно.

Ответить
Развернуть ветку
Chelsea Lex

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

Ответить
Развернуть ветку
Андрей Крамарь

По-моему, ты должен обосновывать свои заявления чем-то кроме примитивного яблодрочерства и аргументов "с потолка" про СНГ. Это вообще явная глупость, по которой легко считывается твой уровень. Я встречал много статей о том, что фигма за короткое время опередила и скетч, и тем более, xd. И мне (и всем присутствующим) предельно ясно, почему именно так вышло.
Спору нет, у всех есть сильные и слабые стороны, но пока у фигмы их больше. А если что-то не так работало - то судя по всему, дело было не в бобине;)

Ответить
Развернуть ветку
Мракобес

Насколько большие? И на каком железе?

Ответить
Развернуть ветку
Chelsea Lex
Ответить
Развернуть ветку
Tatiana Filipovich

T

Ответить
Развернуть ветку
Tatiana Filipovich

R

Ответить
Развернуть ветку
Ivan Pomidoroff

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

Ответить
Развернуть ветку
Андрей Крамарь

По слухам, в америках негров угнетают, а все остальные ковбои или миллионеры.

Ответить
Развернуть ветку
Юрий

Нам не нужен дизайнер, у нас есть Figma бесплатные UI-киты

Ответить
Развернуть ветку
Yes, Your Grace

Есть какой-то левый food ui kit, но нет Fluent? Странно)

Ответить
Развернуть ветку
geovo

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

Ответить
Развернуть ветку
Sergey Klochko

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

Ответить
Развернуть ветку
Андрей Крамарь

Большинству совершенно похер на происхождение иконок, если это не указано отдельно в ТЗ.

Ответить
Развернуть ветку
Sergey Klochko

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

Ответить
Развернуть ветку
Серёга СТАЛКЕР

Автору большое СПАСИБО, молодец!

Ответить
Развернуть ветку
Сергей Арк

Вы же понимаете разницу между ЛУЧШИМИ UI-китами ДЛЯ ПРОЕКТА, и интересными UI-китами? В сфере применимости, универсальности, кастомизируемости под задачу и остального? 

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Daniel Vinsa

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

Ответить
Развернуть ветку
Анна Мельникова

Ой, здоровская подборка ☺ спасибо большое!

Ответить
Развернуть ветку
33 комментария
Раскрывать всегда