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

Как создаются дизайн системы ▶️
Ребята из Epam и Юзтех разобрали тему дизайн систем на мелкие детали. В первом выпуске поговорили о том, что такое дизайн система и в чем отличие от UI Kit, а также как донести ее ценность. Во втором выпуске про то, как создать дизайн систему и какие плагины могут помочь. В заключительном выпуске о том, как поддерживать ДС и как выглядит жизненный цикл компонента

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

Что такое дизайн-токены простыми словами 📝
Дмитрий Якушин из Домклик постарался придумать самое простое объяснение дизайн-токенов на примере житейских ситуаций. Что это такое, как работают и зачем они нужны — в этой статье.

Как грамотно собрать UI-kit и передать его в разработку без боли? Опыт студии Crauch ▶️
Арт-директор студии Crauch, Саша Тарасов, рассказал, как собрать UI-kit, передать его в разработку и не утонуть в бесконечных доработках. Разобрали типичные ошибки, важность документации и почему без нормальной передачи UI-kit разработчики страдают не меньше, чем дизайнеры.

Использование Figma Variables в создании макетов мобильных приложений 📝
Благодаря Figma Variables процесс адаптации макетов под разные платформы можно значительно оптимизировать: сократить время разработки вдвое, сохранить уникальность каждой платформы и сэкономить бюджет проекта. В этой статье мы рассмотрим, как правильно настроить компоненты для этого

Как мы строим дизайн-систему в ЮMoney 📝
Полина и Степан, дизайнер интерфейсов и фронтенд-разработчик в ЮMoney. В этом тексте расскажут, как в компании устроена дизайн-система, и посмотрят на неё с двух сторон: глазами команды дизайна и разработки

#материалы

💬 Тултип

База тестовых заданий

Ребята из Internsheep сделали подборку из 50 тестовых от топовых компаний за период с 2022 года. В подборке Яндекс, Альфа банк, Авито, Тинькофф и другие крупные российские компании.

Если хочешь попасть в крупную компанию и делать много деняк 💳, то нужно знать к чему готовиться. В подборке есть 17 успешно решенных заданий, так что можно оценить подход тех, у кого получилось и перенять их опыт

Смотреть подборку ▶️

#тестовое

💬 Тултип

Персонализация в приложениях

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

Как мы узнали предпочтения пользователей и сделали поиск одежды и обуви удобнее
Старший продуктовый дизайнер Авито, Илья Хлесткин, расскажет про то, как ребята решили упростить пользователям поиск одежды нужного размера и внедрили фичу Мой гардероб.

Разбираем интерфейс сервиса «Гараж» в приложениях авто-классифайдов
Дизайнеры из Noknok провели исследование авто классифайдов (Авто.ру, Дром и Авито.Авто), в котором изучали фичу Мой гараж. Это раздел, где можно добавить свой авто и сервис будет предлагать нужные для вас и вашего железного коня запчасти, расходники и аксессуары.

Напишите в комментах свой пример персонализации в сервисах, который считаете крутым 👍

Всем легкой пятницы 🕺

💬 Тултип

DataPorn — подборка визуализаций, от которых сложно оторваться 😋

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

Сравнение танков в World of Tanks
Здесь собрана умная визуализация, которая позволяет сравнивать танки по самым разным характеристикам — от брони и урона до скорости и уровня пробития. Можно выбирать страну (СССР, Германия, США, Британия), тип техники (лёгкий, средний, тяжёлый танк или ПТ-САУ), уровень — и тут же смотреть, кто из «железяк» на что способен. Например, можно одним взглядом оценить, какой танк наносит больше урона за 10 секунд или у кого башня толще. На танках с помощью цвета показаны более или менее укрепленные места

Диаграмма экспедиций Амундсена и Скотта
Крутая, но трагичная визуализация на таймлайне двух экспедиций к Южному полюсу. Амундсен и Скотт стартовали почти одновременно, но их судьбы оказались диаметрально разными: один вернулся с победой, второй — погиб с командой. Это проект Бюро Артёма Горбунова, где вместо карты — временная диаграмма, показывающая путь экспедиций по дням. Амундсен — чёткое планирование, собаки, склады, успех. Скотт — мотосани, лошади, нехватка подготовки и трагедия всего в 18 км от спасения. Это не просто график, а рассказ о смелости, ошибках и цене решений, изложенный языком данных.

Карта землятрясений с 1898 года
Это визуализация под названием «Earthquakes since 1898», созданная Джоном Нельсоном из IDV Solutions. На ней отображены все землетрясения магнитудой 4.0 и выше, зарегистрированные с 1898 года. Каждый светящийся след — это толчок, а чем ярче точка, тем мощнее было землетрясение. Благодаря визуализации становится чётко видно, где проходят границы литосферных плит — особенно отчётливо это прослеживается в районе Тихоокеанского «Огненного кольца». Вся карта буквально светится линиями сейсмической активности, и они точно повторяют очертания тектонических границ.

Голы и явные голевые моменты чемпионатов Европы
14–15
Это крутая интерактивная визуализация от «Лаборатории данных», посвящённая футбольному сезону 2014–2015 (еще есть 15–16, но он неполный по моему). Тут можно увидеть все голы и яркие моменты прямо на поле — с точками ударов, траекториями мячей и, конечно, исходами эпизодов.
Можно фильтровать по матчам, командам, игрокам, а также выбирать типы моментов. Для фанатов футбола и тех, кто обожает разбирать игру, это топ

Все шайбы Александра Овечкина
Ну и самая хайповая визуализация в подборке. Посвящена она голам Александра Овечкина в НХЛ. Здесь у нас все заброшенные шайбы, включая точные места на площадке, типы голов и даже исходы матчей. Можно фильтровать информацию по сезонам, противникам и типам голов, а также отслеживать, как хокеист побил рекорда Уэйна Гретцки


💬 Тултип

1000+ бесплатных иллюстраций для твоих проектов

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

designs.ai
freeillustrations
opendoodles
storyset
undraw
pixeltrue (нет бесплатных, но есть большие паки за $1–2)


💬 Тултип