interfaces.prjctr


Kanal geosi va tili: Ukraina, Ukraincha
Toifa: Dizayn


Discovery Channel від Interface Design Faculty в Projector Institute.
Нічого зайвого, лиш те, що надішлеш інтерфейс-гікам і собі у Saved Messages.
У факультет ➡️ bit.ly/3Ok2oRD
Для питань та пропозицій — hello@prjctr.com

Связанные каналы  |  Похожие каналы

Kanal geosi va tili
Ukraina, Ukraincha
Toifa
Dizayn
Statistika
Postlar filtri


Хай у новому році буде добре та не буде погано…

Дякуємо за ваші побажання під дописом вище.
Ловіть також слова від наших кураторок і кураторів.

Хай все збувається 💙

Уже завтра о 12:00 опублікуємо результати адвент-вікторини!

Stay tuned 🤝


Надсилаємо новорічні обійми одне одному та одна одній 💙

Останнє завдання — написати найтепліше, найжиттєвіше, найболючіше, найсмішніше чи найакутальніше побажання своїм колегам і колежанкам.

Оцінюватимемо за кількістю реакцій під вашим коментарем.

Просимо fair play і не кидать друзям з проханням лайкнути 🤝

На старт, увага… нумо обмінюватися теплим 🫂


Випуск для тих, хто перед новим роком встиг вигоріти, як та ароматизована свічечка…

Відключення світла є, а значить — і подкаст «Дизайн під час блекауту» від Михайла Самоварова.

Слуходивіться, щоб після свят прокинутися і я-як перестати перепрацьовувати 🫂

🔹 YouTube 🔹 Spotify 🔹 Apple 🔹 Megogo

#подкаст_рекомендація


Як вирішити проблему відтоку нових користувачів?

1. Подивитись на досвід

• Записати та проаналізувати сесії користувачів які не дійшли до створення відео: де вони відвалились, що пробували зробити, як себе поводили?
• Поговорити про їхній досвід: чому вони не створюють відео? Що кажуть про свій перший досвід? Можливо, в них немає запиту d цей момент, або відкладають продукт на пізніше, або не знають з чого почати? Треба розбиратись.

2. Подивитись на first mile (перший досвід) користувача в продукті зараз

• Скільки кроків між реєстрацією та створенням відео?
• Які кроки наближають користувача до створення відео, а які ні?

Найчастіше, self-serve користувачам треба допомогти з виконанням цільової дії:

• дізнатись, що вони хочуть отримати;
• зібрати необхідні дані для створення результату;
• допомогти зробити це в інтерфейсі, розуміючи, що не виходить зараз — тут сильно допомагають будь-які якісні дослідження;

3. Придумати, спроєктувати та перевірити рішення, які мають привести до a-ha моменту.

У випадку Scribey, це створення відео вперше.

🔹 Дешевше та швидше: покращити сторінку, на яку потрапляє новий користувач:

• покращити пустий стан;
• запропонувати шаблони відео для швидкого старту;
• передстворити відео та дати його доредагувати;
• показати наступні кроки, які користувачу варто виконати, щоб створити відео.

Плюси: швидше запустимо та отримаємо реальні дані, зможемо на них навчитись та спланувати наступні ітерації.

Мінуси: може не дати контрастного результату.

🔹Дорожче та довше: створити setup в онбордингу, в якому користувач створить перше відео повністю або частково:

• запитуємо про тип відео, тему, стиль;
• просимо заповнити текст;
• одразу генеруємо відео та показуємо його користувачу.

Плюси: потенційно суттєво більший % нових користувач матиме прогрес в продукті, створить відео та повернеться, щоб доробити його або створити нове.

Мінуси: більше роботи для дизайнера, інженерів та команди загалом.

4. Обрати метрики для оцінки

• Головне: % користувачів які створили перше відео, повернення після створення.
• Другорядне: час на створення першого відео.

Висновок: впливати на a-ha момент та активацію можна по-різному. Це можуть бути простіші рішення з оптимізацією наявного сценарію, або складніші — наприклад, побудова setup в онбордингу.

Важливий фокус — допомогти користувачу отримати обіцяний або бажаний результат, закрити потребу, виконату джобу 😉

Кейс від Стаса Говорухіна, куратора та автора курсу Growth Design й інтенсиву User Onboarding Design, дизайнера продукту в Djinni.




Ви працюєте над дизайном Scribey: редактора, що перетворює текст на відео для соцмереж за допомогою AI.

До вас приходить продакт менеджер і каже:

У нас класний продукт, але погана активація: всього 12% зареєстрованих користувачів створюють відео, та всього 3% повертаються зробити це знову.


Що ми знаємо від продакт менеджера ще?

• 25% від тих, хто створив перше відео, стають постійними щотижневими користувачами;
• 90% користувачів відвалюються після першого дня;
• зараз створення відео займає в середньому 3.5 дні від моменту реєстрації.

Також маємо інформацію про дизайн застосунку з екранів на картинках.

Питання:

Як би ви підійшли до роботи над збільшенням активації нових користувачів? Що б досліджували? Яке рішення б запропонували?

Кейс від Стаса Говорухіна, куратора та автора курсу Growth Design й інтенсиву User Onboarding Design, дизайнера продукту в Djinni.

1.6k 0 16 10 20

Гайд: як злякати та втратити юзера у п’яти атрибутах.

Запрошуємо до кімнати страху на слайдах.

Не хочеш бути причиною побиття екранів гаджетів і сліз юзерів? І натомість сприяти підвищенню конверсій і бізнесових KPIs?

Виправляй вебформи на 4-денному воркшопі Design Patterns For Complex Web Forms з експертизою Віталія Фрідмана, UX гуру з 19 роками досвіду.

Збирай скіли, які рятують конверсії — та клади до резюме. Чи прикладай наче подорожник до душевних ран юзерів.

Чекаємо на стороні UX світла 💙


Video oldindan ko‘rish uchun mavjud emas
Telegram'da ko‘rish
Як створити smooth вебформу?

Ми прагнемо уникати розташування деструктивних кнопок поруч із кнопками, які виконують важливі дії або переводять користувача до наступного кроку.

Одночасно важливо запобігти помилкам, випадковим натисканням і прискорити взаємодію.

Тому важливо максимально чітко позначати функціонал кнопок.

Кнопки «Скинути» (Reset) та «Скасувати» (Cancel) мають бути розташовані у верхньому правому куті екрана — бажано, щоб вони виглядали меншими за розміром і нагадували посилання.

Кнопка «Очистити» (Clear) повинна розташовуватися поруч із поточним полем вводу, виглядати як посилання і мати невеликий шрифт.

Кнопка «Оновити» (Update) має бути другорядною кнопкою стандартного вигляду, розташованою поруч із полем вводу.

Кнопка «Назад/Попередній» (Back/Previous) повинна виглядати як посилання у верхньому лівому куті екрана.

Кнопка «Далі» (Next) розташовується в нижньому лівому куті екрана.

Кнопки «Поділитися» (Share) та «Експорт у PDF» (Export as PDF) варто розмістити у верхньому правому куті екрана.

Для індикатора прогресу краще використати вертикальну шкалу, розташовану в бічній панелі зліва або справа.

Кнопка «Зберегти та вийти» (Save and Exit) повинна розташовуватися поруч із кнопкою «Далі» (Next).

Кейс від Віталія Фрідмана, автора і куратора воркшопів Design Patterns For Complex Web Forms, Measuring UX and Impact of Design, Designing for Complex UI, UX Strategy, Design Patterns for AI Interfaces, засновника та креативного ліда у Smashing Media.


Ви розробляєте складний багатоколонковий процес заповнення страхової форми, що складається з 30 етапів.

Припустимо, що форма має 2 колонки, кожна з яких містить близько 10 полів вводу.

Форма має містити такі UI компоненти:

• Reset (скинути всю форму)
• Cancel (скасувати цей етап)
• Clear (очистити вибір)
• Update (оновити індикатор статусу)
• Back (повернутися до попереднього етапу)
• Previous/Next (перемикання між етапами)
• Save and Exit (зберегти та вийти)
• Share (поділитися)
• Export as PDF (експортувати у PDF)
• Progress Bar (показник прогресу)

Питання: усі ці кнопки необхідні, оскільки виконують різні функції — як би ви інтегрували їх у єдиний інтерфейс форми?

Кейс від Віталія Фрідмана, автора і куратора воркшопів Design Patterns For Complex Web Forms, Measuring UX and Impact of Design, Designing for Complex UI, UX Strategy, Design Patterns for AI Interfaces, засновника та креативного ліда у Smashing Media.


«Де ви берете натхнення? На яких сайтах шукаєте патерни і референси для своїх інтерфейсів?»

Питання підслухано у чаті Interface Design Projector 📽️

Відповіді — теж:

Mobbin
Рідне:
Land-book
MaxiBestOf
Godly
Minimal Gallery
Steph Hardy
Brutalist Websites
The Responsive

І трохи бази від редакції каналу:

Design Spells
Awwwards
FWA
LandingFolio
UISources
Dribbble
Pttrns

Зберігайте та пишіть у коментарях, якщо щось забули 💙

1.8k 0 192 1 38

Добірка intrusive thoughts дизайнера інтерфейсів у коментарях під попереднім дописом — дивитися всім!

Подякували, записали, сподіваємося, що до втілення не дійде ✍️

Від натхнення аж нежиттєвий мем зробили.


Ситуація: замовнику нічого не подобається
Питання: що робити?

(тільки неправильні відповіді)

Завдання від Проджа — інституту вільної освіти 💙


«Коли робити UX рисьорч?»

1. Зараз. Чим раніше ви почнете, тим більший вплив матимуть результати на ваш продукт. Найкращий час, щоб розпочати дослідження, — це сьогодні, адже минуле повернути неможливо.

2. Досліджуйте користувачів на всіх етапах. На кожному з них можна дізнатися щось корисне. Кожен зважений крок буде приносити користі на більшу суму, ніж вартість дослідження.

3. Зосередьте більшість досліджень на початку проєкту. Тоді вони матимуть найбільший вплив. Але залиште частину бюджету для додаткових досліджень на пізніших етапах. Це особливо важливо, якщо ресурси на всі необхідні кроки обмежені.

Методи та заходи UX досліджень для різних етапів проєкту — на віжуалі.
Детальний розбір — у статті NN/g.

2k 0 39 8 26

Що робити, якщо команда не використовує вашу дизайн-систему?

Щоб заохотити команди використовувати дизайн-систему та забезпечити узгодженість, я зосередився б на її зручності та ефективності.

Дизайн-система має спрощувати робочі процеси та зменшувати когнітивне навантаження, тому важливо оцінити, наскільки легко команди можуть її використовувати.

Потрібно спостерігати за тим, як вони взаємодіють із системою, виявляти точки тертя та збирати зворотний зв’язок для визначення напрямків покращення.

Можна зробити дизайн систему більш інтуїтивною та доступною шляхом ітераційного вдосконалення. Наприклад, покращити документацію, розширити функціональність інструментів або надання адаптованих шаблонів.

Коли система зручна й органічно вписується у наявні робочі процеси, це природним чином стимулює її використання. Такий підхід дозволяє досягти узгодженості у продуктах, одночасно враховуючи потреби та виклики окремих команд.

Від Франческо Кутоло — автора та куратора інтенсиву Design Systems, Design Lead у Wolt (Doordash).




Ви керуєте розробкою дизайн-системи для своєї компанії. Після її запуску помічаєте, що деякі команди не поспішають її впроваджувати, віддаючи перевагу власним дизайн-рішенням. Це призводить до несумісностей у продуктах компанії.

Питання: Як би ви заохотили ці команди використовувати дизайн-систему? Які стратегії ви б застосували, щоб забезпечити узгодженість, одночасно враховуючи їхні потреби?

Від Франческо Кутоло — автора та куратора інтенсиву Design Systems, Design Lead у Wolt (Doordash).


Навіщо свої граблі, якщо є чужі. Зібрали 10 дизайн систем великих компаній. Насолоджуйтеся, зберігайте собі, не будьте жадібні — кидайте друзям:

Spotify – Reimagining Design Systems at Spotify

Booking.com – How We Built Our Multi-Platform Design System

Uber – Uber Design Platform

Dropbox – How Dropbox migrated to Figma and structured our cross-platform design system

Salesforce – Lightning Design System

IBM – Carbon Design System

Atlassian – Atlassian Design System Evolution

Airbnb – Airbnb Design Language System

Microsoft – Fluent Design System

Google – Material Design Evolution

Тут зібрали лінки, а практичні скіли зі створення ефективних дизайн систем — на воркшопі Design Systems.

Куратор: Франческо Кутоло, Design Lead у Wolt, ex. Design Lead Klarna, Figma community advocate у Швеції.

17 ta oxirgi post ko‘rsatilgan.