Дизайн-система / UI Kit в Фигме #1

Здесь разбираем основные понятия: что такое UI Kit и дизайн система, чем они отличаются, и как начать собирать свой UI Kit. 👀 Смотреть 😄 Графика и дизайн
Изображение поста

Дизайн система Orbit, Элементы для десктопа

Изображение поста

E-Commerce UI Kit V1.1

дизайн система в тематике “Коммерция” Install 🖼 Figma Дизайн
Изображение поста

iOS 18 + iPadOS 18 UI Kit

Дизайн система iOS 18 💾 Открыть #UI Hot Illustrator
Изображение поста
Идея на вечер: смотреть «Кубок дизайн-систем»
Когда-нибудь задумывались, где наши дизайнерские «Четыре свадьбы» или «Битва кондитеров»? Мне всё кажется, что устраивать дизайн-соревнования — провальная идея, потому что делание дизайна незрелищно. Человек сидит за монитором, а потом у него готова картинка. Или кнопка. Или ничего не получилось... Ребята из Авито подошли к дизайн-состязаниям эпичнее, чем я могла придумать: на Кубке дизайн-систем собрали арт-директоров, лидов и ведущих дизайнеров из большого айти. Все участники — создатели и развиватели крупнейших дизайн-системн в России: тут и Авито, и VK, и Т-Банк (привет, Артём), и МТС... Внутри соревнования пять состязаний. Ребята и отвечают на профильные вопросы, и занимаются акробатикой (буквально!) на поролоновой полосе препятствий, и пытаются собирать дизайн на чужой дизайн-системе. Прикольно! Кроме полезности и очевидного развлечения — это реальное шоу по канонам — «Кубок» здорово очеловечивает тех, кто стоит за большими продуктами. Благодаря Кубку видишь, что все живые люди, чего-то не знают и прыгать у них не всегда получается. В общем, давайте посмотрим! 📹Смотреть «Кубок дизайн-систем» #партнёрский_пост
Изображение поста
Пять лет я работала в аутсорсинговой компании EPAM Systems, прошла путь от мидла до лида. Одна из запомнившихся ситуаций произошла, когда меня назначили лидом на e-commerce проект, где уже около года работала наша дизайн-команда из пяти человек. Им требовалась замена предыдущего лида. Работа шла под кураторством менеджера со стороны клиента, который ставил задачи и принимал результаты.
С самого начала я сфокусировалась на том, чтобы разобраться в болях команды и улучшить процессы. Мы наладили взаимодействие с разработкой, ввели регулярные дизайн-демо, систематизировали подход к планированию. Команда счастлива, ей хорошо дышится и приятно живётся. Однако основным вызовом стал менеджер клиента. У неё был довольно хаотичный стиль работы: она могла написать в мессенджере глубокой ночью, внезапно изменить требования в последний момент, часто забывала о договорённостях и регулярно задерживала обратную связь. В ответ я начала выстраивать своего рода «буферную зону»: чёткая документация, календарные планы, согласованные процессы и аргументы, которые можно переслать в чат при необходимости — на случай, если её реальность снова захочет изменить правила игры в последний момент. За полгода мы заметно продвинулись: переехали из скетча на фигму, построили дизайн-систему, наладили процессы внутри команды, взаимодействие с разработкой и сделали нашу работу прозрачной для клиента. Команда счастлива, а клиент доволен результатами. Менеджеру я отвела роль финального ревьюера, стараясь не перегружать её деталями, но вовлекать в обсуждение макетов и планирование, чтобы сохранить контакт. Неожиданно для нас, спустя полгода, она сообщила, что вся наша команда будет заменена дизайнерами с её предыдущего места работы. Объяснила это тем, что «их услуги дешевле», добавив, что «ничего личного». Мы были ошарашены. До этого никаких предпосылок не было — и с нашей стороны, и со стороны клиента всё выглядело стабильно. Я общалась с самим клиентом и с менеджерами с нашей стороны, пыталась выяснить что было не так в нашей работе и что можно сделать, но увы, команда в полном составе покинула проект. Но какого-то официального разбора ситуации не последовало. Всю команду просто распределили по другим проектам. Всё, что оставалось — додумать выводы самостоятельно. Со временем я начала лучше понимать, в чём была моя ошибка. Думаю, я слишком сосредоточилась на интересах и благополучии команды и недостаточно внимания уделила построению отношений с клиентским менеджером. Вместо того чтобы адаптировать формат взаимодействия под её стиль и мотивации, я постепенно дистанцировала её от процессов, надеясь минимизировать хаос. Это дало краткосрочный эффект, но в итоге лишило её чувства контроля и значимости, а значит — и доверия. Вывод, который я сделала: если вы на лидерской позиции, балансируйте между интересами команды и капризами клиентской стороны более изящно. Часто в проектах есть мешающие, дезорганизованные и даже разрушительные люди. Определите степень их влияния на проект и на вас. И если степень влияния высока, то нужно не просто создать среду, минимизирующее их деструктивное влияние. Очень важно вырастить доверие, создать ощущение вовлеченности и значимости. Это сложная задача. Можно вовлекать таких людей в специальные брейнштормы, организовывать сессии ревью дизайна. Да, вероятно, от них будет мало толка. Но вы обезопасите себя и свою команду от неожиданных всплесков лишней активности со стороны подобных людей.
Изображение поста
🔥 Реалити-шоу про дизайнеров, которое мы заслужили
Забудь про лекции и туториалы — это нечто совершенно новое! 🚀 Кубок дизайн-систем Авито — это: — викторина и стресс-дизайн — физуха и батут — куча смеха (и немного боли) Авито, ВК, Т-банк, МТС, Сбер. Кто заберёт кубок и вечную славу? Узнай здесь → смотреть на YouTube
Изображение поста
#промышление Введение
В качестве введения хочу поделиться, с одной стороны, наблюдением о дизайн-системах, а с другой — идеей, к которой я пришёл в последнее время. Начнём с наблюдения. Так получилось, что я уже видел приличное количество дизайн-систем «изнутри». И не только те, что делал сам, но и на консультациях, на собеседованиях, расспрашивая команды, помогая друзьям и знакомым, кто так или иначе с этим связан. И мало где подход действительно можно назвать продуктовым. Несмотря на то, что сейчас модно говорить, мол, ДС — это продукт, на практике очень часто оказывается, что «продуктовость» сводится к тому, что работа над продуктовым инкрементом размазывается на две команды. Сначала продуктовые дизайнеры исследуют гипотезу, понимают, какой UX им нужен, а потом смотрят, можно ли реализовать это в рамках существующей ДС. Если нельзя — что ж, надо идти бить челом в команду дизайн-системы. И уже они решают, вносить ли изменения (или нет) в компоненты, которые нужны для конкретной фичи. П - продуктовость. На практике во многих командах эта история ещё и тоталитарная. Поскольку ДС в первую очередь меряет свой успех через экономию ресурсов, нужно буквально расшибиться в лепёшку, чтобы ради твоей фичи доработали компонент. А в 90+ процентах случаев приходится натягивать своё решение на текущие возможности системы — потому что твоя фича не тянет на достаточный импакт. И вот тут переходим к моей идее и философии. Что если большую часть компонентов ДС будут делать продуктовые дизайнеры? 🤔 Концентрировать всё знание и власть о ДС удобно на ранних стадиях её развития. Но с ростом количества продуктовых команд, брендов и платформ начинает вставать вопрос масштабирования. И дальше есть масса вариантов, но базово всё сводится к двум направлениям: — Делить ответственность и контроль над ДС между несколькими командами. — Наращивать команду ДС хоть до полноценного департамента. И, конечно, можно комбинировать оба пути. Важно вот что: если смотреть с точки зрения болей и потребностей, ни у кого нет боли «хочу дизайн-систему». Все решают свои задачи и хотят инструмент, который помогает их решать. И продуктовые дизайнеры чаще всего вполне не против делать компоненты сами. Главное противоречие здесь — поддержание единообразия, консистентности и снижение костов. Без централизованного механизма управления качество будет разным, появится множество уникальных компонентов, и консистентность поплывёт. Поэтому чаще всего побеждает диктатура. Но что если дать дизайнерам простой и понятный инструмент создания компонентов? Окей, с простым я, наверное, загнул — совсем просто вряд ли получится..😬 Суть подхода в том, чтобы создать правила — своего рода Таблицу Менделеева и законы физики — в рамках которых система будет саморегулироваться. При комбинировании элементов между собой получается компонент, свойства и поведение которого можно спрогнозировать, зная правила. А команда ДС смещает фокус: не делает готовые фичи и компоненты, а создаёт сами правила и элементы, обучает, делится практиками, помогает находить неожиданные, но рабочие решения. Собственно, в следующих постах серии разберём уже практические приёмы: как можно организовать такую систему и каким образом она влияет на мышление дизайнеров и формирует его. - - 🛫 Канал: UXFLOW • Сергей Мухин Сайт: uxflow.ru
Изображение поста
Реалити-шоу про дизайнеров, которое мы заслужили!
Забудь про лекции и туториалы — это нечто совершенно новое! Кубок дизайн-систем Авито — это: — Викторина и стресс-дизайн. — Физуха и батут. — Куча смеха (и немного боли). Авито, ВК, Т-банк, МТС, Сбер. Кто заберёт кубок и вечную славу? Смотреть на YouTube
Изображение поста
Мы уже рассказывали, как появилась идея создать кубок дизайн-систем.
А сегодня (немного подушним) и расскажем про цель 😃 Цель шоу - показать людей, которые работают над дизайн-системой. А она должна помогать дизайнерам собирать макеты за считанные минуты. Это мы и проверяем на практике! Короткая версия выше ⬆️ Длинная — ютуб или ВК
🧰 Design System | UI kit | +6000 Components — обширная дизайн система с большим количеством готовых компонентов
Изображение поста
BankDash - Dashboard UI Kit
Дизайн система для приложения банка Install 🖼 Figma Дизайн
Изображение поста
Lineage — плагин, который поможет понять, как ваша дизайн-система используется в вашем проекте и какое влияние каждое изменение окажет на ваш дизайн.
lalomts.com/lineage 🗳 Плагины Figma
Реалити-шоу про дизайнеров, которое мы заслужили!
Забудь про лекции и туториалы — это нечто совершенно новое! Кубок дизайн-систем Авито — это: — Викторина и стресс-дизайн. — Физуха и батут. — Куча смеха (и немного боли). Авито, ВК, Т-банк, МТС, Сбер. Кто заберёт кубок и вечную славу? Смотреть на YouTube
Изображение поста
Keep: бесплатная дизайн-система.
• 10000+ компонентов и вариантов • 435+ глобальных стилей • Логотипы и значки популярных брендов • Более 1550 функциональных иконок с готовыми вариантами размеров • и многое другое #design_system #UIkit Открыть в Figma Иконки Figma
🔗 Dravter
Библиотека для Figma: юзерфлоу, вайрфреймы, компоненты и стартовая дизайн-система в одном пакете. Отличный фундамент для быстрых запусков. #figma #дизайн_система #вайрфреймы #юзерфлоу #ui #инструменты #стартапы Посмотреть 🔗
Appsmith Design System 2.0
Готовая дизайн система для разработки дизайна приложений Install 🖼 Figma Дизайн
Изображение поста
Степан Картышов — арт-директор студии Magma
Расспросили Стёпу, что он хочет увидеть в студенческих работах: В Magma, CG-студии ONY, мы всегда в поиске свежих идей и талантливых людей, с которыми можно создавать что-то уникальное. Для нас очень важен дизайнерский подход к работе (design thinking = problem solving) — умение видеть идеи, стоящие за каждым визуальным решением. Мы ценим, когда дизайнер понимает процесс и способен создать не только визуально привлекательный, но и системный, интуитивно понятный продукт. Поэтому мы выбрали тему концептинга стиля — это отличная возможность проявить креативность, разработать свою дизайн-систему и учесть ключевые элементы визуального стиля. Каждому мы дадим фидбэк. Если нас впечатлит ваш проект, мы с радостью рассмотрим возможность дальнейшего сотрудничества. Мы всегда готовы делиться опытом и помогать расти молодым специалистам. Ждем работы, которые не только продемонстрируют ваши навыки, но и покажут, как вы решаете реальные задачи с помощью дизайнерского мышления! → Курс «3D-дизайнер» — это комьюнити, работа по брифам крупных брендов и возможность пройти отбор на стажировку в известные компании еще во время обучения. Стартуем 28 мая!
Изображение поста
BankDash - Dashboard UI Kit
Дизайн система для приложения банка Install 🖼 Figma Дизайн
Изображение поста
Исследование типографики в дизайн-системах
Анализ типографики в 44 дизайн-системах: повторяющиеся паттерны и инсайты. Шрифты, текстовые стили, адаптивный дизайн - ключевые аспекты Читать на DSGNERS! | #статьи
Изображение поста