У цьому матеріалі наш UX/UI дизайнер Вадим розповів, хто такий UX/UI-дизайнер та надав деякі корисні поради для новачків.
Дизайн — це обов’язкова і невід’ємна частина розробки. UX/UI-дизайнери роблять інтерфейси зрозумілими, зручними та естетичними. Ці фахівці нічого не програмують, але без них в IT — нікуди.
UI/UX-дизайн: у чому різниця двох понять
Якщо провести аналогію, наприклад, із письмом від руки, — тоді ваш почерк, колір ручки та тип паперу можна буде назвати UI, а на UX в цьому випадку впливатиме сенс, який ви вкладаєте у свої слова, легкість розуміння вашого меседжу, а також відчуття, які він викликатиме у читачів.
UI (User Interface — «Інтерфейс Користувача») — це інструмент для взаємодії людини з машиною, що служить для досягнення певного результату.
UX (User Experience — «Досвід Користувача») — візьмемо приклад із приготуванням кави. На якійсь кавовій машині вам легше та приємніше готувати каву, а на іншій система й процес можуть здаватися заплутаними й нелогічними. Відчуття та враження користувача, які виникають у нього під час взаємодії з інтерфейсом, називають «досвідом користувача», а UX, як дисципліна, займається покращенням зручності користування інтерфейсами.
Ми можемо назвати досвід користувача хорошим, якщо він відразу розуміє, як користуватись тим чи іншим інтерфейсом, майже не витрачаючи часу на те, щоб розібратись, як все працює. Головне в хорошому UX — це максимальна очевидність всіх елементів управління й загальна продуманість інтерфейсу для швидкого і легкого досягнення результату з мінімальною кількістю зусиль і дій.
Чому UI та UX так часто пишуть разом
Існують окремі поняття — UI-дизайнер та UX-дизайнер. UI-дизайнер займається візуальною складовою інтерфейсу, а UX-дизайнер більше нагадує аналітика: аналізує ЦА, створює «портрети користувачів», описує можливі сценарії використання інтерфейсу та проєктує алгоритм взаємодії з ним.
У портфоліо дизайнерів, резюме та вакансіях компаній UI/UX часто пишуть разом. Це тому, що такі дизайнери в своїй роботі займаються і графічною складовою інтерфейсу (UI) і його логікою (UX). Якщо не пропрацьовувати і UI, і UX, то на виході матимемо або гарний зовнішньо, проте незручний інтерфейс, або корисний продукт, що буде візуально непримітним.
У перспективі спеціаліст окрім UI/UX може детальніше заглибитися в додатковий аспект, наприклад, написання текстів для інтерфейсів.
Основні задачі UI/UX-дизайнера, його роль в проєкті
Багато залежить від того, як саме організована робота в конкретній компанії. В різних компаніях обов’язки UI/UX-дизайнерів можуть дещо відрізнятись. Але якщо узагальнити: робочий день починається з перегляду поточних і запланованих завдань, обговорення з колегами необхідних робочих питань і, власне, великої кількості основної роботи — розробка дизайну нових систем або додавання нових функцій у вже існуючі, покращення та оптимізації поточних версій інтерфейсів і багато інших супутніх завдань.
Якщо говорити про специфіку саме роботи: потрібно продумувати логіку інтерфейсу, створювати його візуальну частину, пропонувати оптимальні варіанти вирішення існуючих завдань або проблем, обговорювати і обирати варіанти максимально якісної реалізації необхідного функціоналу.
Якщо оцінити окремо роль UI/UX в проєкті, то UI створює перше візуальне враження, а от UX формує вже основне, триваліше ставлення до самого продукту. Хороший UI буде довго залишатись актуальним, а оптимізований UX може значно покращити результати бізнесу і допомогти у формуванні аудиторії постійних лояльних клієнтів.
Які навички UI/UX-дизайнера зараз особливо потрібні
Основним для UI/UX-дизайнера я б назвав аналітичний склад розуму, вміння швидко знаходити потрібну інформацію і референси, хороший словниковий запас і вміння пояснювати абстрактні поняття звичайними словами.
Також я б окремо виділив уміння самостійно навчатися, бажання і готовність постійно стикатись із новим, розвиватись, мислити актуально і інколи нестандартно.
Крім цього важливе:
- Розуміння методів UX-досліджень. Великі аналітичні компанії та маркетингові агенції активно вивчають поведінку користувачів та публікують результати — потрібно їх розуміти та використовувати. Щоб поглибити свої знання, можна стежити за блогом Nielsen Norman Group: там багато статей та відео про те, як правильно інтерпретувати результати досліджень та яких помилок уникати.
- Комунікабельність та вміння швидко заглибитися в продукт. Замовники приходитимуть з різних сфер: у вас може з’явитися завдання спроєктувати маркетплейс, додаток інтернет-банку або онлайн-кінотеатр. Кожен бізнес та проєкт має свою специфіку й аудиторію. Отож, потрібно вміти слухати клієнта й ставити правильні питання.
- Розуміння колористики. Вибирати хороші кольори для інтерфейсу — також непросто. За допомогою кольору можна звернути увагу на головне та передавати відповідний настрій. Корисний гід із колористики можна знайти на сайті Toptal.
- «Надивленість». Потрібно постійно вивчати сайти великих компаній, помічати хороші композиційні прийоми, типографіку та кольори.
- Вміння працювати з контентом. Для створення інтерфейсу потрібно підбирати тематичні фото, ілюстрації, іконки, а також за необхідності створювати нові у потрібному стилі. Фотографії можна шукати на Unsplashта Pexels, ілюстрації та іконки — на Freepik, Fraction й Icons8.
З якими інструментами потрібно навчитися працювати майбутньому UI/UX-дизайнеру
На сьогодні для початку буде достатньо класичної зв’язки Adobe Photoshop/ Illustrator для графіки, а також Figma для інтерфейсів.
Існує багато різних програм і їх актуальність з часом змінюється, тому важливо постійно слідкувати за тенденціями і новинками в інструментах дизайнерів. Наприклад, така популярна сьогодні Figma з’явилась тільки у 2016 році, а до того дизайнери користувались зв’язкою Sketch+ Invision.
Зараз компанія Adobe почала процес покупки дизайн-платформи Figma за $20 млрд. Угоду планують закрити вже у 2023 році і хто знає, як саме це вплине на сам інструмент. В будь-якому випадку можна справедливо стверджувати, що дизайнери майбутнього будуть користуватись чимось, що відрізнятиметься від сьогоднішніх інструментів.
Наприклад, останнім часом дуже розвинулись технології нейромереж і штучного інтелекту, тому я б також рекомендував постійно цікавитись і знайомитись з подібними технологіями і методами, навіть якщо поки на їх основі ще не створено зручних сервісів або програмного забезпечення. Щоб бути актуальним «завтра» — потрібно бути інноваційним сьогодні.
Додаткові навички:
- Знання основ HTML, CSS та JavaScript. Програмуванням займається розробник, проте UI-дизайнер співпрацює з розробниками. А тому базове розуміння HTML-верстки, JavaScript та фреймворків буде корисним для ефективної роботи.
- Володіння Photoshop. Якщо в інтерфейсі багато фотографій та їх потрібно обробити, можливостей Figma може бути недостатньо. А у Photoshop, наприклад, можна налаштувати пакетну обробку: щоб однаково обрізати та збільшити контрастність 100 фото для карток товарів.
Книги, YouTube-канали, сайти та блоги для UI/UX-дизайнерів
Щоб відрізнити хорошу картину від бездарної, якісний текст від посереднього та класний продукт від ординарного, потрібна надивленість. Це почуття смаку та стилю, сформовані на базі переглянутих фільмів, картин, дизайнів, прочитаних книг. Вони дозволяють видавати геніальні ідеї та вчать грамотно оцінювати побачене.
Що почитати UI/UX-дизайнеру
Я б порадив обов’язково ознайомитись з кількома основними авторами книг з дизайну інтерфейсів:
- «Don’t make me think» — Steve Krug.
- «The Design of Everyday Things» — Don Norman.
- «100 Things Every Designer Needs to Know About People» — Susan Weinschenk.
- «Steal Like an Artist: 10 Things Nobody Told You About Being Creative» — Austin Kleon.
- «Rocket Surgery Made Easy: The Do-It-Yourself Guide to Finding and Fixing Usability Problems» — Steve Krug.
- Також дуже раджу будь-які книги Якоба Нільсена (Jakob Nielsen)
З YouTube-каналів:
UXLX, User Experience Lisbon — записи виступів експертів світового рівня у сфері UX на 4-денних конференціях, які проводяться в Лісабоні.
High Resolution — тут викладають інтерв’ю з дизайнерами-експертами про те, які прийоми і підходи використовуються у великих компаніях, і як там організовано роботу дизайнерів.
Mike Locke — величезна кількість контенту, пов’язаного з дизайном та UX-дизайном, починаючи від відеоуроків, і закінчуючи кар’єрними порадами.
Також дуже багато корисного можна знайти на різних офіційних каналах софту
Що подивитись з фільмів
- Abstract: The art of Design. Оригінальний документальний серіал Netflix, присвячений художникам у сфері дизайну. У першому сезоні розповідають про дизайнера взуття Nike Тінкера Хетфілда, сценографку Ес Девлін, графічну дизайнерку та партнерку бюро Pentagram Полу Шер та інших.
- Objectified. Повнометражна документалка про наші відносини з промисловими об’єктами та людьми, які їх проєктують.
- Helvetica. Документальна стрічка про типографію та графічний дизайн, вплив шрифтів на наше життя і міське середовище.
- The Genius of Design. Історії переважно промислового дизайну та винаходи, котрі змінили сучасне життя, наприклад, вушко для відкривання консервної банки чи вбудована кухня.
Де ще шукати натхнення
- Screenlane. На сайті можна знайти понад 10 000 дизайн-рішень і користувацьких патернів інтерфейсів для iOS.
- Mobbin. На платформі розміщено безліч скриншотів застосунків для iOS та Android, а також є словник, за допомогою якого можна вивчити анатомію інтерфейсів.
- Growth Design. Це ком’юніті, створене Dan Benoni й Lois-Xavier Lavallee, які понад 10 років вивчали дизайн та психологію користувацького досвіду. У них цікаві кейси та розділ про психологію сприйняття інтерфейсів.
- CopyBook. Колекція UX-текстів, які можна використовувати в інтерфейсах або за інших потреб під час проєктування.
Надихайтеся проєктами на Awwwards, Behance, Dribbble, Httpster, One Page Love, колекціями на UI Movementта Pttrns. Читайте англійською світове медіа з веброзробки Smashing.Magazine, а українською — журнал Telegraf.design.
UI/UX дизайн — це головна творча професія в IT-сфері. LinkedIn навіть відніс UI/UX-дизайн до п’яти найбільш затребуваних навичок станом на 2020 рік, а Glassdoor додав його до списку 50 топових вакансій у 2022 році.
Компанії активно переходять у диджитал, а значить, бізнесу буде потрібно дедалі більше зручних сайтів та застосунків.
