Щодо дизайнерського портфоліо зазвичай виникає багато питань, але щодо дизайн менеджерського — ще більше
На щастя, у нас є, кому їх поставити.
Вова Сафонов — Head of Design у Socialtrait, куратор курсу Design Management, поділився ідеальним рецептом портфоліо, яке допоможе передати ваш досвід та цінність.
Гортайте карусель та ставте вподобайку — будемо вважати, що цей ритуал допоможе привернути увагу роботодавців до вашої кандидатури 😉
На щастя, у нас є, кому їх поставити.
Вова Сафонов — Head of Design у Socialtrait, куратор курсу Design Management, поділився ідеальним рецептом портфоліо, яке допоможе передати ваш досвід та цінність.
Гортайте карусель та ставте вподобайку — будемо вважати, що цей ритуал допоможе привернути увагу роботодавців до вашої кандидатури 😉
👍8❤6🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Скевоморфізм: плюси, мінуси, підводні камені?
Лайк — якщо одні плюси.
Темний місяць — якщо радше мінуси.
Анімація Apple Books, знайдена на Design Spells.
Лайк — якщо одні плюси.
Темний місяць — якщо радше мінуси.
Анімація Apple Books, знайдена на Design Spells.
🌚52👍26🤔7❤6
Forwarded from Projector
Вам дійсно потрібен светр з оленями чи 25-та гірлянда?
А може, ці гроші здатні на більше — для вас і України?
Please open Telegram to view this post
VIEW IN TELEGRAM
❤14🔥6👍3🤔1
Badges, Pills, Chips, Tags — у чому різниця і як їх використовувати?
Гайд від Віталія Фрідмана, засновника та креативного ліда у Smashing Media.
🔹UI компоненти бувають статичні та інтерактивні
Badges — завжди статичні, використовуються для статусу та оновлень. Наприклад, draft, new, pending, -7%↘.
Tags — можуть бути і статичними, і інтерактивними.
Статичні — для тем, ключових слів, інтерактивні — для посилань, фільтрів, вибору, дій.
Tags часто називають chips або pills.
🔹Види тегів
Display tags показують дані. Наприклад, ключові слова, мітки, деталі.
Data tags відображають числові дані. Наприклад, PDF 262 KB.
Filter tags — це активні фільтри з опцією видалення.
Selection tags для фільтрації або введення інформації.
🔹Основна різниця
Badges — для статусу, оновлень, лічильників.
Tags/chips/pills — для інтерактивних фільтрів, вибору, дій.
Щоб уникнути плутанини, використовуйте чіткі назви: «Filter tags» — краще, ніж просто «Tags», а «Status badges» зрозуміліше, ніж «Badges» чи «Pills».
🔹Дизайн правила
Статичні елементи не повинні виглядати як кнопки, а інтерактивні — як мітки.
Мінімальний розмір інтерактивного елемента — 48×48px на мобільних.
Відстань між інтерактивними елементами — щонайменше 8px.
Це полегшить життя як дизайнерам і розробникам, так і кінцевим користувачам.
За експертизою та фідбеком Віталія приходьте на UX Strategy Workshop. Старт — 27 листопада.
Повний текст допису Віталія на LinkedIn.
Гайд від Віталія Фрідмана, засновника та креативного ліда у Smashing Media.
🔹UI компоненти бувають статичні та інтерактивні
Badges — завжди статичні, використовуються для статусу та оновлень. Наприклад, draft, new, pending, -7%↘.
Tags — можуть бути і статичними, і інтерактивними.
Статичні — для тем, ключових слів, інтерактивні — для посилань, фільтрів, вибору, дій.
Tags часто називають chips або pills.
🔹Види тегів
Display tags показують дані. Наприклад, ключові слова, мітки, деталі.
Data tags відображають числові дані. Наприклад, PDF 262 KB.
Filter tags — це активні фільтри з опцією видалення.
Selection tags для фільтрації або введення інформації.
🔹Основна різниця
Badges — для статусу, оновлень, лічильників.
Tags/chips/pills — для інтерактивних фільтрів, вибору, дій.
Щоб уникнути плутанини, використовуйте чіткі назви: «Filter tags» — краще, ніж просто «Tags», а «Status badges» зрозуміліше, ніж «Badges» чи «Pills».
🔹Дизайн правила
Статичні елементи не повинні виглядати як кнопки, а інтерактивні — як мітки.
Мінімальний розмір інтерактивного елемента — 48×48px на мобільних.
Відстань між інтерактивними елементами — щонайменше 8px.
Це полегшить життя як дизайнерам і розробникам, так і кінцевим користувачам.
За експертизою та фідбеком Віталія приходьте на UX Strategy Workshop. Старт — 27 листопада.
Повний текст допису Віталія на LinkedIn.
🔥21❤8👍5
Media is too big
VIEW IN TELEGRAM
Щоб дати команді якісний фідбек, вам має бути:
а) не страшно роздратувати людину,
б) глибоко не плювати на тих, кому ви його даєте,
Ділиться Алла Одеяненко, Lead Product Designer у Google. На відео — її пояснення, як прийти до фідбеку, що сприятиме реальному зростанню та глибоким змінам.
Повний гайд «Як давати фідбек, що допомагає зростати дизайнеру» — у лекції на Projector Library.
Вичерпне навчання, як стати системним і ефективним дизайн лідером — на курсі Design Management.
До речі, це стара лекція, що була записана російською, — вирішили не губити корисне та перекласти за допомогою ШІ. Як вам результат?
а) не страшно роздратувати людину,
б) глибоко не плювати на тих, кому ви його даєте,
Ділиться Алла Одеяненко, Lead Product Designer у Google. На відео — її пояснення, як прийти до фідбеку, що сприятиме реальному зростанню та глибоким змінам.
Повний гайд «Як давати фідбек, що допомагає зростати дизайнеру» — у лекції на Projector Library.
Вичерпне навчання, як стати системним і ефективним дизайн лідером — на курсі Design Management.
До речі, це стара лекція, що була записана російською, — вирішили не губити корисне та перекласти за допомогою ШІ. Як вам результат?
❤16🔥9👍3
Коментар на тему: «Як візуалізувати дані погано»
Крок 1. Використвуйте якомога абсурнішу шкалу, щоб показати різницю між величинами
Крок 2. Обманюйте користувачів: показуйте відрив, між числами, як вам зручно
Крок 3. Сучасний інтернет вбиває когнітивні здібності користувачів: допомагайте юзерам знову їх розвинути!
Крок 4. Не переймайтеся: будьте як baby boomer з четвертої картинки, який складається зі усіх 243%
• На цій ноті інтегруємо курс Infographics — перешліть тим, кому не завадить
Крок 1. Використвуйте якомога абсурнішу шкалу, щоб показати різницю між величинами
Крок 2. Обманюйте користувачів: показуйте відрив, між числами, як вам зручно
Крок 3. Сучасний інтернет вбиває когнітивні здібності користувачів: допомагайте юзерам знову їх розвинути!
Крок 4. Не переймайтеся: будьте як baby boomer з четвертої картинки, який складається зі усіх 243%
• На цій ноті інтегруємо курс Infographics — перешліть тим, кому не завадить
😁42❤4👍3
Forwarded from Projector
This media is not supported in your browser
VIEW IN TELEGRAM
Вчитися приємно. Переконайтеся з Projector Library: між робочими завданнями, поки чекаєте сніданок у кав’ярні чи загорнувшись у ковдру 🐈⬛️
Маємо чорно-п’ятничний тиждень знижок у найбільшій українській відеобібліотеці, що має 700+ лекцій від топових creative&tech спеціалістів 🖤
З 25 по 30 листопада знижка на річну підписку 60% — 950 грн замість 2500 грн. Приєднуйтеся 🐾
Маємо чорно-п’ятничний тиждень знижок у найбільшій українській відеобібліотеці, що має 700+ лекцій від топових creative&tech спеціалістів 🖤
З 25 по 30 листопада знижка на річну підписку 60% — 950 грн замість 2500 грн. Приєднуйтеся 🐾
🔥7👍5❤4
Контент 🤝 User Experience
Ну, в ідеалі. Адже поганий UX контент може зробити геніальний дизайн дратуючим.
Приклад: посилання «Learn more». Що саме користувач дізнається, натиснувши на нього? Чи отримає він потрібну інформацію, чи лише втратить час? Відсутність конкретики в тексті може створювати плутанину, додаткове когнітивне навантаження та погіршувати досвід користувача. Як цього уникнути радить Віталій Фрідман:
Як зробити UX контент сильним?
Ясність: що саме очікує користувача? Наприклад, замість «дізнатися більше» використовуйте «дізнатися ціни».
Доречність: текст має відповідати контексту.
Простота: менше складних формулювань — більше зрозумілих слів.
Чого варто уникати?
Кліше і розмитих фраз: наприклад, «сlick here» чи «explore» не додають жодної цінності для користувача.
Перевантаження: забагато тексту іноді дорівнює його відсутності.
Недоступності для людей з інвалідністю: контент має бути зрозумілим для всіх користувачів.
Що і як можна протестувати?
• Banana test: замініть ключові слова на «банан» і попросіть юзерів пояснити зміст.
• Cloze test: видаліть частину тексту і попросіть користувачів заповнити пропуски.
• Reaction cards: напишіть 25 емоцій на картках і попросіть обрати ті, які найкраще описують продукт.
• Card sorting: попросіть користувачів групувати теми в категорії.
• Highlighting: запропонуйте підсвітити слова, які допомогли чи збили з пантелику.
• Competitive testing: покажіть сторінки конкурентів і запитайте, як користувачі розуміють їхній зміст.
Контент — частина інтерфейсу, тож не забувайте приділяти йому увагу. Як і тестуванню загалом.
Принагідна рекламна інтеграція — інтенсив Віталія Measuring UX and Impact of Design. Зрозуміємо, що і як міряти, щоб досягати бізнес результатів, вже 4 грудня.
Ну, в ідеалі. Адже поганий UX контент може зробити геніальний дизайн дратуючим.
Приклад: посилання «Learn more». Що саме користувач дізнається, натиснувши на нього? Чи отримає він потрібну інформацію, чи лише втратить час? Відсутність конкретики в тексті може створювати плутанину, додаткове когнітивне навантаження та погіршувати досвід користувача. Як цього уникнути радить Віталій Фрідман:
Як зробити UX контент сильним?
Ясність: що саме очікує користувача? Наприклад, замість «дізнатися більше» використовуйте «дізнатися ціни».
Доречність: текст має відповідати контексту.
Простота: менше складних формулювань — більше зрозумілих слів.
Чого варто уникати?
Кліше і розмитих фраз: наприклад, «сlick here» чи «explore» не додають жодної цінності для користувача.
Перевантаження: забагато тексту іноді дорівнює його відсутності.
Недоступності для людей з інвалідністю: контент має бути зрозумілим для всіх користувачів.
Що і як можна протестувати?
• Banana test: замініть ключові слова на «банан» і попросіть юзерів пояснити зміст.
• Cloze test: видаліть частину тексту і попросіть користувачів заповнити пропуски.
• Reaction cards: напишіть 25 емоцій на картках і попросіть обрати ті, які найкраще описують продукт.
• Card sorting: попросіть користувачів групувати теми в категорії.
• Highlighting: запропонуйте підсвітити слова, які допомогли чи збили з пантелику.
• Competitive testing: покажіть сторінки конкурентів і запитайте, як користувачі розуміють їхній зміст.
Контент — частина інтерфейсу, тож не забувайте приділяти йому увагу. Як і тестуванню загалом.
Принагідна рекламна інтеграція — інтенсив Віталія Measuring UX and Impact of Design. Зрозуміємо, що і як міряти, щоб досягати бізнес результатів, вже 4 грудня.
👍18🔥7❤4
Пані та панове, хочемо позичити ваші 5 хвилин
Питаємо про ваш досвід — бажання, цілі, плани — роботи з no-code інструментами. Повернемо борг у вигляді корисного контенту. Дякуємо!
Клікайте сюди
Питаємо про ваш досвід — бажання, цілі, плани — роботи з no-code інструментами. Повернемо борг у вигляді корисного контенту. Дякуємо!
Клікайте сюди
😁13❤6👍2
Media is too big
VIEW IN TELEGRAM
Як найняти АІ працювати над інтерфейсами за вас
Розповідає Денис Суділковський, бренд та бізнес директор ЛУН.
На відео — приклад прискорення дослідження завдяки АІ.
Більше технік і прикладів від Дениса в лекції «ШІ (AI) в інтерфейсному дизайні» на Projector Library.
Ще більше — на інтенсиві AI for Business Growth від Марії Пономарчук: експертки, що обіймала посади Product Director у TikTok, Product Manager у Apple, Head of Product у Reface та працює з АІ з 2015 року — задовго до того, як це стало мейнстрімом.
Розповідає Денис Суділковський, бренд та бізнес директор ЛУН.
На відео — приклад прискорення дослідження завдяки АІ.
Більше технік і прикладів від Дениса в лекції «ШІ (AI) в інтерфейсному дизайні» на Projector Library.
Ще більше — на інтенсиві AI for Business Growth від Марії Пономарчук: експертки, що обіймала посади Product Director у TikTok, Product Manager у Apple, Head of Product у Reface та працює з АІ з 2015 року — задовго до того, як це стало мейнстрімом.
👍10❤6🤝2
Forwarded from creators.prjctr | jacuszek week
Робото-полегшувальне
Плагін Logo Layout для Figma допомагає розміщувати кілька різних логотипів так, щоб разом вони дружили та виглядали красиво на макеті.
Алгоритм враховує пропорції логотипів, незалежно від того, наскільки високим, широким, маленьким чи великим може бути кожен.
Тестуйте!
Плагін Logo Layout для Figma допомагає розміщувати кілька різних логотипів так, щоб разом вони дружили та виглядали красиво на макеті.
Алгоритм враховує пропорції логотипів, незалежно від того, наскільки високим, широким, маленьким чи великим може бути кожен.
Тестуйте!
👍48🔥17❤8
Як виміряти UX? 10 корисних посилань — про метрики, KPIs та фреймворки
• HEART Framework Template
Miro
• 49 UX Metrics, Methods, and Measurement Articles
MeasuringU
• How to Measure the Impact of UX Research?
Medium
• How to Choose the Right UX Metrics for Your Product
Home
• Google’s HEART Framework for Measuring UX
Interaction Design Foundation
• Top 5 UX Frameworks to Measure User Experience
DEV Community
• How to Measure User Experience: 7 Key UX Metrics
Userpilot
• The 7 Most Important User Experience (UX) KPIs
UX Design Institute
• The Complete Guide to UX Metrics
HubSpot
• Effective UX Metrics and KPIs to Measure User Experience
ScreenRoot
Навчіться перетворювати розмиті цілі та чіткі КРІs дизайну на інтенсиві Віталія Фрідмана — Measuring UX and Impact of Design. Зрозуміємо, що і як міряти, щоб досягати результатів вже 4 грудня.
• HEART Framework Template
Miro
• 49 UX Metrics, Methods, and Measurement Articles
MeasuringU
• How to Measure the Impact of UX Research?
Medium
• How to Choose the Right UX Metrics for Your Product
Home
• Google’s HEART Framework for Measuring UX
Interaction Design Foundation
• Top 5 UX Frameworks to Measure User Experience
DEV Community
• How to Measure User Experience: 7 Key UX Metrics
Userpilot
• The 7 Most Important User Experience (UX) KPIs
UX Design Institute
• The Complete Guide to UX Metrics
HubSpot
• Effective UX Metrics and KPIs to Measure User Experience
ScreenRoot
Навчіться перетворювати розмиті цілі та чіткі КРІs дизайну на інтенсиві Віталія Фрідмана — Measuring UX and Impact of Design. Зрозуміємо, що і як міряти, щоб досягати результатів вже 4 грудня.
🔥12❤8💅4👍2
Дістаємо з шухлядки спосіб тестування 2002 року
Microsoft Reaction Card Method — це простий і канонічний інструмент для збору емоційного фідбеку.
Як працює?
• Користувачам дають перелік із 118 слів: позитивних, нейтральних, негативних.
• Їх просять вибрати ті, що найкраще описують продукт чи досвід.
• Після цього користувач пояснює, чому обрав саме ці слова.
Це допомагає уточнити емоційне ставлення до продукту, зрозуміти сильні та слабкі сторони — словом, зібрати якісний фідбек без складних досліджень.
З плюсів: низький бар’єр для участі та достатня емоційна глибина, де на питання типу «що вам не сподобалося?» користувачі справді діляться асоціаціями та почуттями. Більше — у статті NN/g.
Користуєтеся цим методом?
🤝: так
🌚: ні
💅: тестувати — шлях слабких
Microsoft Reaction Card Method — це простий і канонічний інструмент для збору емоційного фідбеку.
Як працює?
• Користувачам дають перелік із 118 слів: позитивних, нейтральних, негативних.
• Їх просять вибрати ті, що найкраще описують продукт чи досвід.
• Після цього користувач пояснює, чому обрав саме ці слова.
Це допомагає уточнити емоційне ставлення до продукту, зрозуміти сильні та слабкі сторони — словом, зібрати якісний фідбек без складних досліджень.
З плюсів: низький бар’єр для участі та достатня емоційна глибина, де на питання типу «що вам не сподобалося?» користувачі справді діляться асоціаціями та почуттями. Більше — у статті NN/g.
Користуєтеся цим методом?
🤝: так
🌚: ні
💅: тестувати — шлях слабких
🌚20💅12🤝2