Marina Minchukova | UI/UX

🚀 Крутий дизайн-процес! Подивіться, як красиво та системно fangjianping_udl показує свій дизайн-процес. Від концепції до фінального продукту - все в одному стильному колажі

ljyjeffrey створив це: «I touched premium grass today - with wild flowers» 💐 Кожна травинка - з коду та символів. Просто космос! Дякую за натхнення 🔥

Готуюсь до воркшопу, скоро повернусь в більш активний розклад з постами Ось цікавий інтерактив: процес сінкінгу спейсу тут.

Концепт DeskMinder ✨ Мінімалістичний додаток для фокусу, особливо для тих, у кого ADHD «Your mind is clear. One task is enough.»

Ось актуальна підбірка Design Systems, які вже впровадили AI-aware patterns та компоненти для роботи з штучним інтелектом ✨ Amazon: Cloudscape Design SA: SAP Design System Carbon Design System (IBM): Carbon MUI (Material UI): mui.com Fluent UI (Microsoft): Fluent UI ServiceNow: ServiceNow Design System Tailwind: Tailwind CSS shadcn/ui: ui.shadcn.com Primer (GitHub): Primer Mantine: mantine.dev Lightning Design System (Salesforce): Lightning Paste (Twilio): Paste HeroUI: heroui.com eBay MIND Patterns: eBay MIND daisyUI: daisyui.com Thumbprint: thumbprint.design Elisa Design System: Elisa Power: Power Design System NYS: NYS Design System Дуже цікаво спостерігати, як дизайн-системи швидко адаптуються під агентний AI та нові патерни взаємодії. Зберігайте підбірку - буде корисною 🔥

Хто займається дизайном інтерфейсів - зберігайте цей пост 🔥 Vitaly Friedman розібрав важливу тему: «My» vs «Your» в UI. Здається, що це дрібниця, але насправді це сильно впливає на відчуття користувача. Коротко суть: «Мій / My» - коли це щось особисте користувача (My drafts, My photos, My orders). Дає відчуття володіння. «Ваш / Your» - коли система звертається до людини (Your recommendations, Your profile settings, Your subscription). Якщо можна обійтися без займенника - краще прибрати. Корисна перевірка: запитуйте себе «Who else is in the room?» - хто зараз «в екрані»? Користувач чи система? Я після цього матеріалу одразу почала переглядати свої проєкти і знаходити моменти, де можна зробити текст природнішим. Дуже рекомендую прочитати повну версію від Vitaly та інші корисні ресурси (залишила в коментарях)

Класна думка з книжки про емоційний дизайн ✨ Автор адаптував піраміду Маслоу під інтерфейси. Тепер вона виглядає так: Знизу вгору: • Функціональний (просто працює) • Надійний (не ламається) • Зручний (легко користуватись) • Емоційне задоволення (викликає емоції та кайф) Ідея проста, але потужна: мало просто зробити продукт, який працює. Сьогодні користувачі хочуть, щоб інтерфейс ще й приносив задоволення і створював емоційний зв’язок Саме на цьому верхньому рівні народжуються лояльність і любов до продукту

Була на майстер-класі «Механіка стилю» у Михайла Самоварова і просто в захваті ❤️ Дуже сподобалося! Михайло круто розібрав і принципи аналізу стилів, і як їх правильно переносити, і як адаптувати стиль під різні формати. Я нарешті знайшла відповіді на свої питання щодо концептингу та перенесення стилістики Після МК відчуваю такий прилив енергії - буду ще глибше занурюватися в цю тему. Дуже люблю себе прокачувати в дизайні 🔥 Михайло, величезне дякую за майстер-клас! Це було атмосферно, корисно і з класним фідбеком А ще після заняття так надихнулася, що вже зробила концепт на тему кавʼярні 🍵

Ось як би виглядав YouTube, якби його створили в Microsoft: • Купа вікон і спливаючок • Copilot лізе в кожну дію • Реклама OneDrive і Windows 11 • Помилки «Something went wrong» • І загальний вайб корпоративного хаосу Коротше, ідеальний Microsoft-стиль 🔥

Друзі, свіжий витік перед анонсом - Google Aluminium OS вже можна поглянути наживо 👀 У витоку видно: • Нижню Dock-панель • Віртуальні робочі столи • Нормальну роботу з вікнами • Вбудовану інтеграцію з iPhone На перший погляд інтерфейс виглядає чистим, сучасним і зручним для ноутбука. Але є момент: навіть гуглівські застосунки поки що здебільшого просто веб-версії у вікнах. Один з інсайдерів прямо порівняв це з прокачаним Samsung DeX Цікаво, як Google доробить все до релізу. Потенціал відчувається великий 🔥

Друзі, must-watch для всіх, хто займається продуктом, UX/UI та growth 🔥 Подивіться це відео: Mobbin проаналізували 1460 onboarding flows з майже тисячі додатків і сайтів Дуже корисний розбір - що працює, що ні, і чи потрібен onboarding взагалі в 2026 році. Рекомендую всім, хто робить користувацький досвід 👉https://youtu.be/Qsq-Sj_rojU Зберігайте, щоб не загубити!

Пʼятниця ж! 🎉 Розслабляємось і ловимо вайб: підготувала для вас легку приємну підбірку інтерфейсних анімацій, від яких просто кайф. Гортайте, насолоджуйтесь і зберігайте ідеї 🔥

Дуже приємна анімація з рибкою від samdape

500 підписників - для мене це не цифра, це люди, яким цікаво те саме що й мені Дякую що ви тут 🤍 Буде ще більше корисного

AI скіли для продуктового дизайну - Layers Є набір скілів для Claude (і не тільки), який веде AI через 7 шарів продуктового дизайну. Не просто "згенеруй мені UI" — а від реального контексту до рішення. 9 скілів, кожен для свого шару: /layers-orient - діагностика: де затик, з чого починати /layers-observed-behaviour - дослідження поведінки → job stories /layers-domain - картування домену, термінологія, bounded contexts /layers-user-needs - потреби користувача → можливості для стратегії /layers-product-strategy - з'єднати потреби з бізнес-результатами /layers-conceptual-model - об'єкти, зв'язки, стани — без прив'язки до інтерфейсу /layers-interaction-flow - структура взаємодій, edge cases, breadboard /layers-surface - аудит поверхні відносно рішень нижніх шарів Встановлюється одною командою: npx skills add jamiemill/layers-skills Працює в Claude Code, Cursor, Codex та інших AI-інструментах 🔗 https://layers.jamiemill.com/skills

Сільпо, ви торкнулись мого сердечка🌸 Стою біля полиці з шоколадом, а на мене дивиться ось ця квіточка з написом про маму і торт Ніякого крику про знижки. Просто одна тепла фраза і ти вже думаєш не про ціну, а про маму Візуально м’який градієнт, форма квітки, все пастельне і ніжне. Повністю в настрої свята. І при цьому це просто картонна підвіска на полиці між Lindt і Ferrero Rocher Ось що значить ситуатив, зроблений з головою: не банер, не push-повідомлення а маленька деталь у правильному місці, яка чіпляє більше за будь-яку рекламну кампанію

Торкніться, щоб переглянути доступні стилі іконок у Ghostty Автор mitchellh

Моя стаття вийшла в блогах ДОУ 🎉 «Що насправді бачить Claude, коли ви даєте йому Figma-файл» Всі обговорюють, як AI генерує код за макетом. Але майже ніхто не говорить про те, що між макетом і кодом тепер є новий шар - те, що бачить агент. І саме дизайнер відповідає за те, наскільки чітко цей шар описаний. Розібрала: що конкретно отримує Claude через Figma MCP, як готувати компоненти на трьох рівнях (атом → молекула → секція), і чому один рядок в описі картки змінив усе Посилання: https://dou.ua/forums/topic/59305/

DESIGN.md нова точка входу у твій дизайн-процес Якщо ти ще не чув про DESIGN.md - це файл специфікацій дизайн-системи, який генерується з реального UI і одразу використовується в коді (Tailwind, CSS Variables, Design Tokens) Ось топ-підбірка інструментів для роботи з ним: 1. styles.refero.design - особисто рекомендую. 2000+ готових DESIGN.md, найповніший вихід: підтримує Tailwind v4, CSS Variables і Design Tokens одночасно 2. neuform.ai - найкращий візуальний досвід. Вводиш будь-який сайт → отримуєш специфікацію 3. designmd.me - ще один варіант генерації з будь-якого сайту 4. designmd.supply - аналогічно, з довільного URL. 5. getdesign.md - тільки готові пресети, без кастомного введення 6. github.com/bergside/design-md-chrome - Chrome-розширення, яке працює прямо в браузері. Просто і швидко

Кайфовий приклад як робити дійсно гарні та плавні градієнти 🩷👏