interfaces.prjctr | vnotchenko week

Як вберегти себе від мільйона зайвих правок Ставте чіткі KPIs зараз, щоб не плакати потім: 1. Визначте цілі на старті проєкту Правки зазвичай виникають, коли замовник чи команда не до кінця розуміють, чого вони хочуть. Запитайте: • Що ми хочемо досягти? • Які проблеми вирішуємо? • Як успіх буде вимірюватись? Наприклад, якщо ваша мета — збільшити кількість реєстрацій, основний KPI може бути «конверсія на формі реєстрації». 2. Пріоритезуйте метрики Коли всі орієнтуються на єдину мету, кількість непотрібних правок значно зменшується. Оберіть одну або кілька метрик: • Юзабіліті: чи стало користувачам простіше виконувати потрібні дії? • Конверсії: чи зростає кількість виконаних завдань? • Залученість: як часто і довго користувачі взаємодіють із продуктом? Наприклад, ціль «зменшення часу на виконання ключової дії» допоможе уникнути правок, які не наближають до результату. 3. Комунікуйте візуально Ще одна причина правок — різне бачення фінального результату. Прототипи, вайрфрейми та сценарії взаємодії допоможуть усім учасникам проєкту узгодити очікування ще до розробки дизайну. 4. Тестуйте та отримуйте ранній фідбек Дайте клієнтам і команді можливість протестувати дизайн у реальних сценаріях. Користувачі допоможуть знайти слабкі місця до того, як проєкт перейде на наступний етап. 5. Аналізуйте дані Коли у вас є KPI, які можна виміряти, дискусії стають раціональними. Замість «мені не подобається ця кнопка» з'являється «поточний дизайн збільшує конверсії на 15% замість очікуваних 25%». Що покаже ефективність дизайну? KPI. Що вбереже вас від мільйона зайвих правок? KPI. Що допоможе розв'язати проблему невизначеності всередині команди? KPI. Де навчитися їх ставити та доносити цю необхідність стейкхолдерам? На інтенсиві Measuring UX and Impact of Design: без смс, з реєстрацією та промокодом на знижку -20% — DESIGN20. Стартуємо уже ща 2 дні.

Що робити, якщо клієнту «все не те»? Насамперед, підкреслю два моменти: 1. клієнт не завжди неправий, тож злитись чи засмучуватись не варто. Сприймайте це як можливість створити найкраще рішення; 2. клієнт не мислить професійними дизайн-категоріями кнопок, типографії та іншого. Тож ви маєте бути його помічником і провідником. Абстрактні відповіді на дизайн — це радше добре, ніж погано. Мало хто любить, коли їхніми руками керують, диктуючи колір кнопки. Отже, я рекомендую рухатись від абстрактного до конкретного. Почніть із запитання «чому?» — і йдіть у більш поглиблене обговорення причин реакції клієнта та детальніший розбір дизайну. Ви можете виділити під це окремий дзвінок. Але підготуйтеся заздалегідь. Часто клієнт може знати нюанси свого бізнесу або аудиторії, якими раніше не поділився. Чи просто не може сформулювати конкретний запит, в чому ви маєте йому допомогти. Така розмова також допоможе збудувати довіру між вами і дасть розуміння, що ви зацікавлені створити краще рішення так само, як і клієнт. Якщо знадобиться, зробіть ще одну ітерацію брифу, додавши більш деталізовані вправи. Наприклад, мудборд або збір референсів від клієнта. Але тримайте в голові, що дизайн-рішення має не тільки подобатись клієнту, а також відповідати потребам цільової аудиторії. Цим варто оперувати в дискусії щодо концепту. Кейс від Мар’яни Бучкович — кураторки Figma Autolayout Workshop, Senior UX/UI Designer у Fedoriv.

Ви підготували перший драфт дизайну для клієнта за раніше узгодженим брифом. Проте на зустрічі клієнт каже, що «все не те», дизайн «не метчиться з його очікуваннями». Але не дає конкретних правок. Питання: Як ви будете діяти, щоб отримати від клієнта чіткіший фідбек і зрозуміти, які саме аспекти дизайну потрібно змінити? Кейс від Мар’яни Бучкович — кураторки Figma Autolayout Workshop, Senior UX/UI Designer у Fedoriv.

Дизайнерам інтерфейсів приготуватися! Під ваші ялинки рушає адвент вікторина 💙 Що це? 1. З 1 по 30 грудня ми опублікуємо 15 питань: спочатку кейс, наступного дня — правильну відповідь. 2. Ви відповідатимете в коментарях — що більш розгорнуто, то краще. 3. Автори кейсів обиратимуть кращі відповіді з коментарів. 4. 31 грудня ми підіб‘ємо підсумки та визначимо трійку інтерфейсних розумників і розумниць. 5. Зіграємо Святого Миколая — прийдемо з подарунками. У ролі подарунків: сертифікати на менторські сесії від спеціалістів Prjctr Mentorship Platform. У ролі авторів кейсів: куратори та команда Проджа. Line-up: Віталій Фрідман (Smashing Media), Франческо Кутоло (Wolt), Стас Говорухін (Djinni), Борис Бакланов (Klarna), Євген Олексюк (EPAM Systems), Мар’яна Бучкович (Fedoriv), Ян Гладченко (Raiffeisen Bank Ukraine), Анна Дем’яненко (Lazarev), Оля Алтухова (airSlate). Бонус: фанові питання від команди. Щоб що брати участь? 🔹Буде цікаво та освітньо: круті питання крутих спеціалістів. 🔹Перевірте себе, поміряйтеся скілами з іншими та відчуйте силу ком'юніті — хай коментарі перетворяться на інтелектуальний батл. 🔹Подарунки — це ж круто, еге ж? Діліться з друзями-дизайнерами, щоб змагатися і з ними. Вмикайте сповіщення, щоб не пропускати питання — спамити не будемо! Ready, steady, go brace yourself the winter is coming… 🫂

Хто?

7 iconic книг про UX дизайн • «Don't Make Me Think», Steve Krug Класика про принципи зручності використання продуктів. Автор пояснює, як зробити інтерфейс інтуїтивно зрозумілим. • «The Design of Everyday Things», Don Norman Основоположна книга про психологію дизайну: як зробити об'єкти та системи простими для використання? • «About Face: The Essentials of Interaction Design», Alan Cooper, Robert Reimann, David Cronin & Christopher Noessel Посібник, який охоплює основи проєктування інтерфейсів та створення зручного цифрового середовища. • «Lean UX: Designing Great Products with Agile Teams», Jeff Gothelf & Josh Seiden Практичний підхід до UX дизайну в умовах Agile. Книга вчить, як швидко створювати цінність для користувачів, інтегруючи UX у процес розробки. • «Hooked: How to Build Habit-Forming Products», Nir Eyal Дослідження, як створювати продукти, які формують звички. • «Smashing UX Design: Foundations for Designing Online User Experiences», Jesmond Allen & James Chudley Комплексний посібник для дизайнерів, який охоплює всі аспекти UX дизайну: від досліджень до прототипування та тестування. • «A Project Guide to UX Design», Russ Unger & Carolyn Chandler Практичний гайд для початківців у UX, який охоплює процеси створення продуктів — від досліджень до кінцевого дизайну. Які б додали ви?

Дістаємо з шухлядки спосіб тестування 2002 року Microsoft Reaction Card Method — це простий і канонічний інструмент для збору емоційного фідбеку. Як працює? • Користувачам дають перелік із 118 слів: позитивних, нейтральних, негативних. • Їх просять вибрати ті, що найкраще описують продукт чи досвід. • Після цього користувач пояснює, чому обрав саме ці слова. Це допомагає уточнити емоційне ставлення до продукту, зрозуміти сильні та слабкі сторони — словом, зібрати якісний фідбек без складних досліджень. З плюсів: низький бар’єр для участі та достатня емоційна глибина, де на питання типу «що вам не сподобалося?» користувачі справді діляться асоціаціями та почуттями. Більше — у статті NN/g. Користуєтеся цим методом? 🤝: так 🌚: ні 💅: тестувати — шлях слабких

Як виміряти 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 грудня.

Робото-полегшувальне Плагін Logo Layout для Figma допомагає розміщувати кілька різних логотипів так, щоб разом вони дружили та виглядали красиво на макеті. Алгоритм враховує пропорції логотипів, незалежно від того, наскільки високим, широким, маленьким чи великим може бути кожен. Тестуйте!

Як найняти АІ працювати над інтерфейсами за вас Розповідає Денис Суділковський, бренд та бізнес директор ЛУН. На відео — приклад прискорення дослідження завдяки АІ. Більше технік і прикладів від Дениса в лекції «ШІ (AI) в інтерфейсному дизайні» на Projector Library. Ще більше — на інтенсиві AI for Business Growth від Марії Пономарчук: експертки, що обіймала посади Product Director у TikTok, Product Manager у Apple, Head of Product у Reface та працює з АІ з 2015 року — задовго до того, як це стало мейнстрімом.

Пані та панове, хочемо позичити ваші 5 хвилин Питаємо про ваш досвід — бажання, цілі, плани — роботи з no-code інструментами. Повернемо борг у вигляді корисного контенту. Дякуємо! Клікайте сюди

Контент 🤝 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 грудня.

Вчитися приємно. Переконайтеся з Projector Library: між робочими завданнями, поки чекаєте сніданок у кав’ярні чи загорнувшись у ковдру 🐈‍⬛️ Маємо чорно-п’ятничний тиждень знижок у найбільшій українській відеобібліотеці, що має 700+ лекцій від топових creative&tech спеціалістів 🖤 З 25 по 30 листопада знижка на річну підписку 60% — 950 грн замість 2500 грн. Приєднуйтеся 🐾

Коментар на тему: «Як візуалізувати дані погано» Крок 1. Використвуйте якомога абсурнішу шкалу, щоб показати різницю між величинами Крок 2. Обманюйте користувачів: показуйте відрив, між числами, як вам зручно Крок 3. Сучасний інтернет вбиває когнітивні здібності користувачів: допомагайте юзерам знову їх розвинути! Крок 4. Не переймайтеся: будьте як baby boomer з четвертої картинки, який складається зі усіх 243% • На цій ноті інтегруємо курс Infographics — перешліть тим, кому не завадить

Щоб дати команді якісний фідбек, вам має бути: а) не страшно роздратувати людину, б) глибоко не плювати на тих, кому ви його даєте, Ділиться Алла Одеяненко, Lead Product Designer у Google. На відео — її пояснення, як прийти до фідбеку, що сприятиме реальному зростанню та глибоким змінам. Повний гайд «Як давати фідбек, що допомагає зростати дизайнеру» — у лекції на Projector Library. Вичерпне навчання, як стати системним і ефективним дизайн лідером — на курсі Design Management. До речі, це стара лекція, що була записана російською, — вирішили не губити корисне та перекласти за допомогою ШІ. Як вам результат?

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.

📉 Чорна п’ятниця — нагода подумати двічі, перш ніж додати в кошик чергову сумку, капелюх чи блендер Вам дійсно потрібен светр з оленями чи 25-та гірлянда? А може, ці гроші здатні на більше — для вас і України?

Скевоморфізм: плюси, мінуси, підводні камені? Лайк — якщо одні плюси. Темний місяць — якщо радше мінуси. Анімація Apple Books, знайдена на Design Spells.

Щодо дизайнерського портфоліо зазвичай виникає багато питань, але щодо дизайн-менеджерського — ще більше На щастя, у нас є, кому їх поставити. Head of Design у Socialtrait, куратор курсу Design Management Вова Сафонов поділився ідеальним рецептом портфоліо, яке допоможе передати ваш досвід та цінність. Гортайте карусель та ставте вподобайку — будемо вважати, що цей ритуал допоможе привернути увагу роботодавців до вашої кандидатури😉