Скажи щось на айтішному: UI/UX-дизайнер
Чим займається UI/UX-дизайнер? У чому відмінність UI від UX? Які слова й вирази потрібно знати, щоб стати успішним дизайнером?
— Сьогодні визначення слова «дизайнер» вкрай спотворене. Більшість людей при цьому слові уявляють скоріше людину, яка малює картинки й дбає тільки про те, який вигляд має результат її праці, — ділиться Lead Product Designer Кирило Нікітін. — Насправді дизайн — це про те, як працюють речі. Дизайнер знаходиться ближче до інженера з високо розвиненим почуттям прекрасного. Найбільше це стосується, звісно ж, дизайнерів у IT.
Види дизайну
— Найпоширеніша назва посади в IT — це «UI/UX-дизайнер». Іноді розділяють «UI» та «UX», а той, хто хоче бути найкрутішим, використовує модне — «продуктовий дизайнер», — усміхається Кирило. — Насправді все це про одне й те саме. Завдання кожного з цих людей — зробити те, у що користувач закохається й буде використовувати завжди. Просто кожен із них фокусується трохи на своєму.
- UI (User Interface) — це фактично те, що користувач бачить і з чим він взаємодіє. Текст, зображення, кнопки, поля, форми тощо. Насправді user interface’ом є навіть вимикачі вашої газової плити. Я частенько, готуючи не вдома, «лаюся» на подбутові прилади, тому що мені не подобається, як спроєктовано їхній інтерфейс. Друзям подобається ця вистава, що межує з квитком у психлікарню.
- UX (User Experience) — це те, як користувач почуває себе, коли користується чимось. «Чи розуміє він, що відбувається й що можна зробити? Чи отримав він кінцевий результат, який хотів спочатку? Чого хотів, чого приходив?». Усі ці питання стосуються user experience дизайну.
На мій суб’єктивний погляд, справді гарний дизайнер повинен відмінно розбиратися в обох напрямах. Напевно, саме тому найпопулярніша вакансія все ж поєднує в собі і UI, і UX.
Популярні терміни дизайнера
— Кожен із перерахованих вище напрямів можна описати якимось набором процесів і конкретних «штук», які можна зробити. А для цього потрібно знати терміни й сленг, — упевнений Кирило.
До UI дизайну належать:
- Wireframe, low fidelity wireframe — це схематичні зображення інтерфейсу. Воно може бути виконано хоч на папері олівцем. Це суть, скелет.
- Макет, «дизайни» — те, який вигляд матиме інтерфейс, коли розробники «зроблять із ним свою магію».
- User flow. Тут показано, як користувач буде взаємодіяти з вашими дизайнами. Зазвичай це набір екранів і розкадровка кожного кроку користувача.
- Прототип — об’єднання дизайнів і user flow у псевдоробочий застосунок. По суті, це просто презентація, в якій можна натискати кнопки, і від цього з’являтиметься відповідний екран.
- Компонент — це елемент інтерфейсу, який можна перевикористовувати. Нерозумно ж малювати кнопку щоразу? Тому ми використовуємо компонент — він однаковий скрізь, просто з різним текстом, наприклад.
- Дизайн-система — це набір компонентів і правил, за якими збирають дизайни. Ті самі кнопки, поля, іноді цілі частини сторінки або екрану. Для того, щоб продукт не мав строкатого вигляду й не був зібраний з різних частин, що не поєднуються, ніби монстр Франкенштейна, дизайнери винаходять правила, за якими створюватимуть продукт.
До UX дизайну належать:
- Дослідження — цей процес поєднує в собі купу методів і різних результатів цих самих методів. Загалом, це можна описати як процес спроби зрозуміти, що ж потрібно користувачеві.
- User interview — означає саме те, що написано. Якщо ви прагнете зрозуміти, чого хоче людина, найлогічнішим буде запитати в неї, чи не так? Тут ми просто йдемо до нашого потенційного користувача й усіма правдами та неправдами намагаємося з’ясувати, що ж нам зробити, щоб він захотів користуватися нашим продуктом.
- User persona — узагальнений опис користувача, для якого ми робимо продукт. Дуже сильно допомагає пам’ятати, що ми не робимо просто якусь супер-пупер-дупер штуку для опрацювання купи даних крутою AI-нейронкою, а насамперед — вирішуємо конкретну проблему користувача.
- User story, «job» — це, власне, та сама проблема користувача, яку нам потрібно вирішити. Наприклад, вибрати готель для відпустки. Або більш детально — зрозуміти, чи включено сніданок у вартість готелю.
- Design validation — просто перевірка: «А чи справді той єдиноріг, що ми напридумували, вирішує проблему користувача?». Можна придумати й зробити що завгодно, але якщо це нікому виявиться не потрібним, буде сумно й боляче.
- Usability testing — процес, коли ви показуєте свій прототип користувачеві, намагаючись зрозуміти, а чи зможе він із ним зробити те, що повинен?
- Аналітика — «чарівні цифри», що показують, як користувачі насправді користуються вашим продуктом. Якщо швидко аналізувати їх і вносити зміни, є шанс, що ваш стартап не розориться так швидко, як міг би.
Бонус
«Словничок ефективного менеджера»:
- «Зробимо шрифт більшим?», «Може, виділимо червоним?» — це означає, що менеджеру хочеться більше акценту на якомусь елементі. Але ми ж із вами вже круті дизайнери (або будемо) і розуміємо, що акценту можна домогтися й іншим способом — менш екстравагантним.
- «Давай зробимо так...» — це означає, що менеджер не розуміє, як потрібно ставити завдання, і намагається «пограти в дизайнера» вашими руками. Нічого хорошого з цього не вийде. Завжди запитуйте: «Яку проблему мені потрібно вирішити?».
- «Потрібно вчора!» — це означає, що ваш менеджер категорично некомпетентний і не може виконати свій основний обов’язок — планування. Біжіть швидше від нього!