Анна Юрьева
UX/UI · Web
Интерфейсы, дизайн-системы,
AI-автоматизация, презентации
10+ лет в дизайне
Связаться Интерфейсы, дизайн-системы,
AI-автоматизация, презентации
10+ лет в дизайне
Анна Юрьева
UX/UI · Web · Графика
Интерфейсы, дизайн-системы,
AI-автоматизация, презентации
10+ лет в дизайне
Интерфейсы, дизайн-системы,
AI-автоматизация, презентации
10+ лет в дизайне
Featured
Единая дизайн-система — от библиотеки компонентов до готовых интерфейсов трёх десктоп-приложений
Design System
UI/UX
Desktop Software
Figma-плагины на базе Claude — автоматическая сборка UI-фреймов из компонентов дизайн-системы
AI Tools
Claude
Figma Plugins
inWEB Examples. Редактор кода и предпросмотр результата
Desktop Software
UI/UX
Часть флоу персонального аккаунта — регистрация, выбор продукта и оплата
UI/UX
Web
Внутренняя корпоративная презентация.
Концепт
Концепт
Visual Design
Internal Deck
Infographics
Ежедневные рекомендации по фазам луны, персональный гороскоп и гибкая настройка категорий
Mobile App
UI/UX
iOS
Featured
Единая дизайн-система — от библиотеки компонентов до готовых интерфейсов трёх десктоп-приложений
Design System
UI/UX
Desktop Software
Figma-плагины на базе Claude — автоматическая сборка UI-фреймов из компонентов дизайн-системы
AI Tools
Claude
Figma Plugins
inWEB Examples. Редактор кода и предпросмотр результата
Desktop Software
UI/UX
Часть флоу персонального аккаунта — регистрация, выбор продукта и оплата
UI/UX
Web
Внутренняя корпоративная презентация.
Концепт
Концепт
Visual Design
Internal Deck
Infographics
Ежедневные рекомендации по фазам луны, персональный гороскоп и гибкая настройка категорий
Mobile App
UI/UX
iOS
Автоматизация сборки интерфейсов с помощью Claude и Figma плагинов
Контекст / проблема
Ручная сборка попапов и экранов из компонентов дизайн-системы отнимала много времени: нужно было вручную находить нужные компоненты, расставлять их, применять стили. Особенно заметно это становилось при большом объёме однотипных модальных окон.
Решение
Необходимо разработать плагины:
- Popup Builder — для создания модальных окон
- Interface Builder — для быстрой сборки типового интерфейса
Процесс
- Обучила Claude дизайн-системе
- Claude сгенерировал плагины на основе утверждённых макетов
- Claude генерирует JSON-описание интерфейса по скриншоту
- Плагин переводит его в готовый макет, используя реальные компоненты дизайн-системы
Скриншоты плагинов
Результат
Примеры модальных окон
Пример создания интерфейса
Редизайн линейки десктоп-приложений
- Интерфейсы
- Дизайн-система
- Библиотека попапов
- Библиотека иконок
Интерфейс Drawings Explorer
Интерфейс VisualizeViewer
Интерфейс MFCApp
Контекст / проблема
Приложения развивались независимо и визуально разошлись — разные компоненты и попапы под одни и те же задачи.
Дизайн-система
Бо́льшая часть библиотеки компонентов, из которой собираются экраны и попапы: меню, панели, тулбары, попапы и др.
Пример тулбара
Библиотека попапов
Множество окон под разные сценарии: от простых уведомлений до сложных форм с десятками полей. Каждое собрано из одних и тех же компонентов дизайн-системы.
Библиотека иконок
Дизайн страницы
Галерея работ
Дизайн сайта на Tilda
Редизайн страницы
Редизайн страницы
Редизайн страницы
Редизайн
MCAD SDK
BIMNV SDK
Редизайн страницы
Персональный аккаунт
Дизайн страницы
Персональный аккаунт
Интерфейс просмотрщика inWEB Examples
Презентации для серии вебинаров ODA DevCon
2024
