Кожен екран, яким ви користуєтеся, був розроблений кимось: головний екран банківської програми, вікно пошуку, сторінка налаштувань. Дизайн інтерфейсу користувача — це дисципліна, яка вирішує, як розташовані ці екрани, як виглядає кожен елемент керування та як він реагує, коли ви його торкаєтеся.
Дизайнер інтерфейсу користувача працює з кількома будівельними блоками. Макет і інтервали групують пов’язані речі разом. Візуальна ієрархія виділяє найважливішу дію. Типографіка та колір несуть значення та бренд. Такі компоненти, як кнопки, входи, картки та меню, розроблені один раз і використовуються повторно, тому продукт виглядає послідовним.
Кожен компонент також має стани. Кнопка має стани за замовчуванням, наведення курсора, натиснуту, фокусування, вимкнення та стани завантаження, і кожна з них потребує дизайну. Залишення штатів є однією з найпоширеніших причин, чому дизайн виглядає закінченим у макеті, але здається зламаним у реальному продукті.
Взаємодія та рух також є частиною інтерфейсу користувача. Невеликі відповіді, які часто називають мікровзаємодією, підтверджують, що дотик спрацював, показують прогрес або пояснюють, куди щось пішло. Вони мають бути швидкими та цілеспрямованими та дотримуватися системних налаштувань для обмеження руху.
Більшість дизайну інтерфейсу користувача сьогодні відбувається в Figma, з Penpot, Sketch і Lunacy як поширеними альтернативами. Для інтерфейсів, які повинні реагувати на реальні дані та введення в готову програму, дизайнери також використовують інтерактивні інструменти. ExodeUI, який ми створюємо, єдиний: він зберігає стани, фізику пружини та події в одному відкритому файлі, який працює в React, Vue, Svelte, Angular, Solid, React Native, SwiftUI і Flutter.