Как стать автором
Обновить
55
0
Роман Камушкин @kamushken

Готовые дизайн системы в Figma → setproduct.com

Отправить сообщение

14 свежих и полезных дизайн-ресурсов в Январе

Время на прочтение 5 мин
Количество просмотров 5.2K

Что в сегодняшнем выпуске: различные генераторы, крутые источники для вдохновения, стильные иконки, топовые продукты из Product Hunt за 2020 год, инструменты для экспорта анимаций и гифок, и многое другое.

Читать далее
Всего голосов 8: ↑8 и ↓0 +8
Комментарии 0

Вспоминаем все важные события в UI/UX дизайне за 2020-й

Время на прочтение 7 мин
Количество просмотров 8.6K

2020-й миновал. Это был нестабильный год и многие выдохлись. Социальная дистанция, локдаун, удаленная работа, а для многих – сокращения: все это стало новой реальностью.

Но несмотря на нестабильность, мировая сцена UI/UX и продуктового дизайна не стояла на месте. Ведь с новыми проблемами появились и новые решения. Компании выпускали новые продукты, а также обновляли существующие.

Читать далее
Всего голосов 10: ↑10 и ↓0 +10
Комментарии 8

13 свежих и полезных дизайн-ресурсов уходящей осени

Время на прочтение 6 мин
Количество просмотров 8K

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

Читать далее
Всего голосов 7: ↑7 и ↓0 +7
Комментарии 8

6 способов дополнительного дохода для дизайнеров и разработчиков

Время на прочтение 8 мин
Количество просмотров 10K

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

Запуская собственный side project, вы имеете все шансы сделать его основным вашим занятием. Иногда такие проекты даже становятся делом всей жизни...

Читать далее
Всего голосов 22: ↑2 и ↓20 -18
Комментарии 13

Десять компаний, которым Figma помогла достичь новых результатов в дизайне и не только

Время на прочтение 8 мин
Количество просмотров 3.2K


Всем привет! В очередной статье мы представляем вам список из 10 компаний, для которых использование Фигмы стало отправной точкой на пути к новым вершинам.

Это истории проблем и пути их решений, где современный дизайн-инструмент сыграл решающую роль.

Возможно, вы планируете разработать собственный перспективный проект и думаете над тем, какой инструмент использовать. Или работаете в компании, которая пользуется другими инструментами для дизайна и прототипирования. В любом случае, после прочтения этой статьи — у вас будет еще +10 причин начать использовать Фигму.
Читать дальше →
Всего голосов 14: ↑7 и ↓7 0
Комментарии 0

Обзор 14 свежих плагинов для Фигмы, которые помогут повысить производительность пока мы все #сидимдома

Время на прочтение 7 мин
Количество просмотров 17K


Сегодня мы поговорим о следующих новых Figma плагинах:

  • AutoGrid — Поддержка сетки для AutoLayout.
  • Tracking – Плагин для создания аннотаций отслеживания.
  • Find and Replace Colors – Организация цветовых стилей в ваших дизайнах
  • Spacing Manager – Плагин для согласованных отступов в компонентах
  • Geometric – Создание математических фигур и кривых
  • Halftones – Плагин, позволяющий накладывать точечный или полутоновый фильтры на картинки
  • Batch Styler – Изменение нескольких стилей текста одновременно
  • Spell Inspector — Поиск и исправление орфографических ошибок
  • Sitemap – Плагин для создания карты вашего сайта
  • Style Organizer — Показывает и упорядочивает все цветовые стили
  • Focus CSS — Более удобное использование CSS в Figma
  • Flipbook – Плагин для анимации ваших дизайнов в Figma
  • SwiftUI Inspector – Плагин для улучшения рабочего процесса разработки для платформ Apple
  • Filter – Фильтрующий плагин для ретуши ваших изображений

Читать дальше →
Всего голосов 10: ↑10 и ↓0 +10
Комментарии 5

Как создать UI kit, который продается. Этапы разработки коммерческой дизайн-системы

Время на прочтение 8 мин
Количество просмотров 23K


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

Я расскажу о поэтапном плане создания коммерческой дизайн-системы. Узнаете как сделать и выпустить на рынок свой продукт. Расскажу что сделать перед началом работы, как подготовиться и составить план. Отдельно рассмотрю этапы разработки дизайн-системы для Figma. В последней части дам советы как продвигать и раскручивать. В статье только личный опыт и наблюдения самоучки.
Читать дальше →
Всего голосов 14: ↑12 и ↓2 +10
Комментарии 1

8 простых UI приёмов чтобы сделать дизайн-прототип динамичным, не прибегая к анимации

Время на прочтение 6 мин
Количество просмотров 32K


Материал этой статьи является следствием моих дизайн-экспериментов и выводов за последний год-полтора непрерывного дизайн гринда. Я неустанно собирал ui kit’ы, экспериментировал с контентом в плейсхолдерах, стилями, тенями текстами и состояниями, чтобы понять влияет ли это на конверсию. Иначе говоря, смогу ли я увеличить продажи дизайн-продуктов для Figma, если добавлю немного визуальной динамики в статичные дизайн-макеты, чтобы сделать темплейты интереснее и функциональнее.
Читать дальше →
Всего голосов 43: ↑37 и ↓6 +31
Комментарии 21

Создание таблиц в дизайн системе Figma и реализация в Storybook (React)

Время на прочтение 5 мин
Количество просмотров 11K


В предыдущей статье на тему дизайна таблиц в Фигме мы выяснили, что базовый элемент создания любого data grid — это компонент ячейки, внутри которого спрятано все необходимое для того, чтобы оставаться в одном экземпляре и строить таблицы ячейка-за-ячейкой. Теперь поговорим о её структуре: какие элементы вложены, случаи использования, рассмотрим темификацию таблиц через токены-цвета. И напоследок расскажу о передаче спецификаций разработчикам и интеграцию таблиц в React/Angular фреймворки прямиком из Figma дизайн-системы. Пока руками, ибо будущее всё еще где-то рядом.

Поехали! Начну с демонстрации бесполезных, но прикольных эффектов кастомизации всей таблицы через главную мастер-ячейку:
Читать дальше →
Всего голосов 16: ↑16 и ↓0 +16
Комментарии 5

Таблицы в Figma. Дизайн Data Grid одним компонентом

Время на прочтение 5 мин
Количество просмотров 46K
image

Строительство таблицы из компонентов — задача, которая рано или поздно возникает перед каждым разработчиком дизайн-систем в Figma.

Существует три подхода к дизайну таблиц, чтобы создать data grid с гибкой архитектурой. В каждом из случаев используется либо row-компонент, либо column-компонент, либо cell-компонент. Каждый из случаев подробно рассмотрим ниже.

Читать дальше →
Всего голосов 10: ↑10 и ↓0 +10
Комментарии 1

Figma компонент и организация экземпляров на примере Userpic

Время на прочтение 4 мин
Количество просмотров 13K


Качественная дизайн-система в Фигме всегда учитывает возможные состояния определенных компонентов. Если до появления Global Styles вариант был лишь один — всегда создавать новый компонент для каждого состояния (например текстовое поле может быть default, а может быть focused), то после внедрения стилей многие UI-элементы удалось унифицировать лишь до одного в своей категории, а разнообразие создавать экземплярами, присоединяя лишь новые стили и цвета.
Читать дальше →
Всего голосов 12: ↑11 и ↓1 +10
Комментарии 5

Адаптивные шаблоны Figma: как сделать гибкий дизайн-компонент мобильной навигации iOS

Время на прочтение 3 мин
Количество просмотров 22K


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

При создании набора компонентных iOS-шаблонов для Figma я решил поэкспериментировать с компонентом Tab Bar. Напомню, что в гайдлайнах iOS это нижняя навигация. Мне хотелось, чтобы его содержимое имело логичное и оптимальное поведение при ресайзе. Хотелось сделать его максимально адаптивным для всех iOS-устройств, насколько это позволяет сделать Figma и направляющие (constraints).
Читать дальше →
Всего голосов 8: ↑6 и ↓2 +4
Комментарии 0

Как я дизайн монетизировал. 15 инсайтов о создании цифрового продукта, который продается

Время на прочтение 8 мин
Количество просмотров 7.3K

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

Раньше я всегда относился скептически к таким постам. Но после того как минул ровно год, давший мне опыта и мудрости лет на 10, я все понял: мне просто нечего было сказать.

Я не работал в больших компаниях, не устраивал-дизайн спринты и не сидел бок о бок с крутыми парнями в коворкингах. Я в дизайне уже не менее 16 лет, я самоучка, и однажды у меня не оказалось ни одного интересного проекта в портфолио, который бы круто работал и современно выглядел. Все мои последние годы стабильного фриланса — это клиенты с обычными заказами. Они приходят и уходят. И 80% из них позднее выбрасывают в топку всё ваше творчество. Потому что по законам рынка это число терпит неудачу после запуска проекта.
Читать дальше →
Всего голосов 14: ↑12 и ↓2 +10
Комментарии 7

Обнаружены элементарные дизайн-частицы

Время на прочтение 3 мин
Количество просмотров 6.5K
image
Честно говоря, мне уже неловко в очередной раз говорить об Атомарном дизайне. Про концепции дизайн-систем сказано практически все и, казалось бы, добавить уже нечего. Но постойте! Ведь атомы в реальном мире из чего-то состоят: протоны, нейтроны, электроны… Можно ли сопоставить со структурой атома дизайн-функционал, с котором мы работаем? Я уверен, что ответ положительный и вот почему…
Читать дальше →
Всего голосов 27: ↑1 и ↓26 -25
Комментарии 8

Дизайн-система в Figma. Взгляд на интерфейс через компоненты

Время на прочтение 8 мин
Количество просмотров 39K


Какой должна быть оптимальная дизайн-система в Figma? Что такое переиспользуемый компонент? Как понятнее и удобнее организовать структуру внутри панели Instance? Каковы этапы разработки подобного продукта? И так далее. Ответы на эти и многие другие вопросы я постараюсь дать в этой статье.
Всего голосов 11: ↑10 и ↓1 +9
Комментарии 4

Один год в Фигме. О плюсах и минусах дизайн-инструмента субъективно

Время на прочтение 3 мин
Количество просмотров 11K


Последний год я использую Figma. Скорее всего Вы уже о ней слышали. В этой статье я опишу недостатки и преимущества, опираясь на личные наблюдения. Всё сказанное будет носить субъективный характер. Я начал пользоваться Figma еще в тот момент, когда логика работы с компонентами была очень сырой. За год почти незаметно происходила эволюция. Сегодня элементы внутри компонента взаимодействуют между собой более логично и упорядоченно. Тем не менее, недостатки все еще есть…
Читать дальше →
Всего голосов 10: ↑9 и ↓1 +8
Комментарии 5

Полезное дизайнеру и разработчику. Свежие утилиты и инструменты для ускорения работы. Выпуск № 10

Время на прочтение 5 мин
Количество просмотров 16K


10-й «Юбилейный» выпуск полезных штук для дизайнеров и разработчиков. Сегодня в выпуске 31 ссылка на всякие свежие полезности. Больше добавить нечего → изучайте сами и делитесь с друзьями!
Читать дальше →
Всего голосов 13: ↑12 и ↓1 +11
Комментарии 3

Полезное дизайнеру / разработчику. Свежие утилиты и инструменты для ускорения работы. Выпуск № 9

Время на прочтение 4 мин
Количество просмотров 20K


Пока дизайнеры продолжают испытывать восторг от появления возможности прототипирования в двух известных инструментах, анонсированных в один день; мир независимых разработчиков продолжает выпускать всякие нужные инструменты. В 9-м выпуске 20 ссылок
Читать дальше →
Всего голосов 20: ↑18 и ↓2 +16
Комментарии 1

Полезное дизайнеру / разработчику. Свежие утилиты и инструменты для ускорения работы. Выпуск № 8

Время на прочтение 6 мин
Количество просмотров 14K
В этом выпуске Вы найдете 34 ссылки на свежие и полезные релизы, авторы которых вносят значительный вклад в развитие профессионального сообщества дизайнеров whи разработчиков, так как делают это безвозмездно. В сегодняшнем выпуске будет summary того, что я уже публиковал на канале «Полезное дизайнеру» и кое-что еще…


Читать дальше →
Всего голосов 17: ↑17 и ↓0 +17
Комментарии 5

Прототипирование — это просто, как собрать пазл. Мультикомпоненты дизайн системы в Figma

Время на прочтение 3 мин
Количество просмотров 40K
Если вы работаете в среде Figma, то скорее всего вы используете компоненты в своих дизайн-процессах и знаете в чем их преимущества. Когда в ежедневной фриланс рутине я устал повторять создание одних и тех же списков, табов, таблиц или любых других модулей, состав которых динамичен, я начал думать об автоматизации этих процессов, чтобы рутина как минимум протекала быстрее. Таким образом мультикомпоненты и были открыты!


Узнайте, как ускорить дизайн-процессы
Всего голосов 24: ↑23 и ↓1 +22
Комментарии 12

Информация

В рейтинге
Не участвует
Откуда
Москва, Москва и Московская обл., Россия
Дата рождения
Зарегистрирован
Активность