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

Приклад крутого інтерфейсу: туристичне агентство Hopper, яке знаходить проблеми користувачів при виборі авіаквитків і вирішує їх своїм сайтом.

Отакий кейс для вашої надивленості принесли сьогодні.

• Більше інтефрейсних кейсів у повній лекції Стаса Говорухіна «Зручність у деталях: як покращити інтерфейси» в Projector Library.

🏄‍♂️ З 1 жовтня ціна річної підписки на Library cтане 2500 грн. Тож, якщо задумувалися про підписку, встигайте оплатити за старою ціною — 950 грн до початку жовтня.

Якщо ви шукали знак, щоб взяти на себе ще більше роботи — це він.

Як кажуть наші друзі Lezo: пам’ятайте, 3в1 — це кава, а не ваша посада 💙

Чим підсилюємо імунітет у жовтні?

Гарячими напоями, стильними шарфами, сварками в твіттері та курсами Проджа. З останніх пропонуємо такі:

🔹Інтенсив Design Patterns for AI Interfaces
Старт: 16 жовтня
Ваш куратор: Віталій Фрідман, співзасновник і креативний лід у Smashing Media

🔹Web Design Beginning
Старт: 7 жовтня
Ваш куратор: Андрій Курочкін, Lead Designer у Hexagon Agency

🔹Web Design Junior
Старт: 21 жовтня
Ваш куратор: Андрій Курочкін, Lead Designer у Hexagon Agency

🔹Mobile Apps Design
Старт: 23 жовтня
Ваша кураторка: Ксенія Бутиріна, ex. Lead UX/UI Designer у Trinetix, ex. Lead Product Designer у Livingston Research

🔹UX Design Beginning
Старт: 23 жовтня
Ваш куратор: Сергій Ревва, Lead Product Designer в airSlate

🔹Інтенсив Web Design Portfolio Camp
Старт: осінь 2024
Ваш куратор: Ігор Артюхов, дизайнер продукту у fintech-компанії, ex. Lead UX/UI Designer у NIX

Кейс: як пофіксили невдалу палітру кольорів Skyscanner

Ділиться Адам Вілсон, що обіймав посаду Senior Product Designer у Skyscanner.

Проблема: «Навіть через кілька місяців я все ще не міг зрозуміти, які кольори де використовуються. Посилання були різних кольорів. Основні кнопки були зеленого кольору. Але якщо вони призначалися для конкретного типу бронювання — синього. Заплуталися? Я теж…»

Завдання: зробити так, щоб бренд і продакт команди послуговувалися однаковими правилами використання кольорів. Одна палітра має бути простою та легкою у використанні, а інша — сміливою та виразною. При цьому всі комбінації треба було зробити інклюзивними.

Основні рішення: систематизувати та спрощувати.

• Ми визначили більш сфокусовану палітру з основними та розширеними комбінаціями.

Темне стало темнішим, а світле — яскравішим. У якості брендових ми змішали нові додаткові кольори.

• Потім ми подивилися на назви: поетичні назви мали піти. Вони просто не працювали.

«Калькутта» → «той оранжуватий колір»
«Ерфаунд» → «той жовтуватий колір»

• Для інклюзивності необхідно дотримуватися стандартів контрастності.

25% комбінацій кольорів на iOS і 17% на Android були недоступні.
Ми вже використовували 31 колір у нескінченних комбінаціях, тож ми прийняли просте рішення це прининити. Текст став чорним або білим, що обмежило кількість доступних комбінацій і дозволило залишити інклюзивні.

• Всередині продукту ми презюмували, що вже отримали певну увагу користувача.

Тож не треба кричати усіма кольорами, як на креативах. Продуктова палітра має бути протиотрутою від тривоги — створювати відчуття спокою. Less is more.

• Ми написали правила і зберегли все це разом у Figma.

Розділили палітри на бібліотеки Brand і Product. Екрани ретельно вивчалися, правила ставилися під сумнів, а комбінації досліджувалися. Але у нас був основний набір кольорів і принципів як бачення.

• Джерело — стаття Адама на Medium. У ній про імплементацію нових підходів у код і кольори, відправлені на цвинтар.