Якщо інтерфейс – це взаємодія людини з неживим предметом, то користувацький інтерфейс – це взаємодія людини і комп’ютера: сайти, мобільні додатки, програми. І цю взаємодію має хтось проектувати. Цим займаються дизайнери інтерфейсів, яких ще називають UI/UX-дизайнерами. Вони працюють над принципами роботи системи, послідовністю дій, які може здійснити користувач, результатом, який він отримає на виході, зрозумілістю, красою і зручністю об’єкта в користуванні. Мета роботи дизайнера інтерфейсів – зробити взаємодію людини та програми приємною, логічною і дружньою. Це робота на перетині дизайну, інженерії, маркетингу і психології.

Зручність та красу інтерфейсів часто проектує одна й та сама людина, але інтерфейси стають все складнішими, тому професію ділять на дві. User Interface Designer (UI) – той, хто відповідає за красу та задоволення. User Experience Designer (UX) – той, хто відповідає за зручність та відповідність бізнес-задачам.

UI-дизайнер займається усім, що стосується оформлення інтерфейсу і створює зрозумілі, цілісні та гарні інтерфейси для користувача. Його ключові обов’язки: розробка стилю, створення макетів, безпосередній дизайн сторінок. Він працює з кольорами, іконками, типографією, навігацією, меню, кнопками, вікнами, анімацією, сповіщеннями. UI-фахівець створює дизайн, базуючись на даних, отриманих від UX-спеціаліста.

UX-дизайнер вивчає проблеми користувача, розбирається у його поведінці, досліджує досвід. UX-дизайнер повинен впевнитися, що продукт працює логічно та вирішує конкретні проблеми. Ключові обов’язки UX-профі: дослідження аудиторії та продукту, проектування користувацьких сценаріїв. UX-дизайнер займається «щастям» користувача: задоволенням і продуктивністю від роботи з інтерфейсом, загальним розумінням і легкістю вирішення проблем.

Ролі обох дизайнерів перетинаються, тому займатися лише UI неможливо без знань UX – і навпаки.

Дізнайтеся, якими є звичайні обов’язки дизайнерів, як проходить їхній типовий робочий день і які в них рутинні задачі. Якщо ви готові змиритися з мінусами професії і вас захоплюють плюси, переходьте до теорії, а в процесі підключайте вивчення інструментів.

Це класичні книги з акцентом на UX, але вони будуть корисні всім, хто займається інтерфейсами (і не лише дизайнерам):

«The Design of Everyday Things» Дональда Нормана. Книга, в якій вперше з’явився термін UX. У цій захопливій роботі Дон розповідає про принципи дизайну побутових речей, якими ми користуємося щодня: двері, чайники, плити, праски. А потім розповідає, як ці універсальні принципи використати у своїй роботі, розробляючи технологічні продукти.

«Don’t Make Me Think» Стіва Круга називають біблією основ UX. Книга, що має бути на поличці в кожного дизайнера, нагадує, на чому треба фокусуватися в роботі над сайтами.

«Web Form Design» Люка Врублевські. Практична книга з детальним розбором, як створювати форми. Варто читати, коли у вас вже буде базове знання інструментів, щоб одразу спробувати поради з книги в дії.

«About Face: The Essentials of Interaction Design» Алана Купера. Обов’язкова книга для всіх, хто так чи інакше пов’язаний з дизайном інтерфейсів. Вона пояснює, як зробити правильний інтерфейс, ретельно досліджуючи всі аспекти UI/UX.

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

Coursera пропонує спеціалізацію User Interface Design (англійською мовою) та курс «Дизайнер інтерфейсів. Введення у спеціальність» (російською). Також зверніть увагу на курси від Udemy, короткі курси на Edx, місячний курс TryDesignLab та курси на Skillshare.

Офлайн-навчання складне, але набагато ефективніше. Ви будете отримувати постійний фідбек, бачити власні помилки та знати, над чим працювати. Наприклад, в Києві можна пройти курси з дизайну інтерфейсів у школі Projector, в KAMA або MEAT Studies. Коли ви знатимете основи професії, зможете вибрати для себе вужчу спеціалізацію і розвиватися у ній.

Літери та слова – теж елементи інтерфейсу і фундамент, на якому тримається дизайн. Щоб інтерфейс, який ви створюєте, був зручним та зрозумілим, потрібно вміти грамотно працювати з типографікою. Важливо розуміти, як люди сприймають текст, які потреби є у користувачів і як вони змінюються в залежності від середовища.

Ось кілька корисних джерел для початку:

Змістовний гід по типографіці, сітках і кольорах від Readymag

Переклад статті шрифтової дизайнерки Джессіки Хіш про ігри зі шрифтами

Типографіка в UI: стаття для початківців

Типографіка в дизайні мобільних додатків

4 правила типографіки в дизайні інтерфейсів

Як ми читаємо: що важливо пам’ятати при виборі шрифту для інтерфейсу

Ключові книги з типографіки для тих, хто лише починає:

«The Elements of Typographic Style» Роберта Брингхерста

«FontBook» Еріка Шпікермана

«Жива типографіка» Олександри Королькової

«Just My Type: A Book About Fonts» Саймона Гарфілда

А ще – грайте! Відеогра Type:Rider проведе через історію шрифтів та розповість про їхній розвиток з часом.

Для початку вивчати всю теорію не обов’язково. Головне – зрозуміти, як на практиці працюють кольори в дизайні інтерфейсів. У цьому вам допоможуть такі матеріали:

Колір в дизайні інтерфейсів. Практичні поради.

HSB-система кольору в дизайні інтерфейсів.

7 правил створення інтерфейсу. Частина І.

7 правил створення інтерфейсу. Частина ІІ.

UI-дизайнер співпрацює з розробниками, тому базове розуміння HTML-верстки, JavaScript та фреймворків буде корисним для ефективної роботи. Знайти курси та уроки можна на Envato Web Design Tuts або Treehouse.

Вже після прочитання кількох книг та паралельно з вивченням теорії можна починати братися за інструментарій.

Редактори, в яких працюють UI-дизайнери можуть бути різними, але найпопулярніші – Sketch, Figma, InVision, Adobe Photoshop, Adobe Illustrator.

Курсів та уроків з Photoshop і Illustrator насправді безліч. Ось тут можна знайти деякі з них: Design Tuts, Lynda, Skillshare.

Sketch – простий і зрозумілий інструмент, який спеціально створено для дизайну інтерфейсів. Безліч уроків є на самому сайті Sketchapp, на LearnSketch, Lynda, Treehouse, Udemy. Єдиний нюанс – інструмент працює лише з Mac OS.

Figma – більш універсальний інструмент, тому що працює в браузері та доступний на всіх платформах. Уроки є прямо на офіційному сайті.

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

Також корисно пробувати конструювати сайти на Readymag, Tilda і Wix. Ці онлайн-інструменти найчастіше використовують для створення лендингів, сайтів-портфоліо, презентацій та інтернет-магазинів. Працюючи з шаблонами та простими інструментами, ви зможете непогано прокачати відчуття стилю, навички роботи з типографікою, блоками, сіткою та анімацією.

В процесі самостійного навчання починайте шукати роботу – з базовими знаннями можна отримати позицію стажера чи інтерна, практикуватися на реальних проектах, прокачувати теоретичні знання на практиці. Якщо гарно себе проявите на стажуванні, цілком реально отримати роботу.

В Україні можна слідкувати за відкриттям позицій стажера чи інтерна на Ain і Dou.

Не соромтеся писати напряму в компанії, в яких хотіли б працювати. Часто про стажування не пишуть, але така можливість є.

Надихайтеся проектами на Awwwards, Behance, Dribbble, Httpster, колекціями на UI Movement та Pttrns.

Читайте англійською найпопулярніше світове медіа з веб-розробки Smashing.Magazine, а українською – журнал Telegraf.design.

Оля Шевченко, арт-директорка Vintage Web Production, кураторка курсу UI. Digital Communications Design

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

Крок 0 – дізнайтеся, хто такі UI-дизайнери, що входить в їх обов’язки, чим вони займаються. Крок 1 – візьміть і спробуйте щось намалювати. Не маючи ні знань, ні теоретичної основи, просто знайдіть якусь сторінку сайту і повністю скопіюйте її. Це важливий крок, бо він перевіряє, чи справді ви хочете цим займатися. Аналогічні кроки необхідні, якщо ви хочете бути економістом, викладачем чи тренером.

Далі – графічні навички. UI-дизайнеру не потрібно досконало вміти малювати, але знання інструментарію необхідні. Дивіться відеоуроки: як намалювати кнопку, додати якийсь ефект, зберегти, конвертувати. Вистачить максимум місяця, щоб це все вивчити до того рівня, коли ви зможете вже щось створити. Друга важлива навичка – допитливість розуму, щоб розбиратися в чомусь новому, не маючи поруч людини, у якої можна запитати. Щоб самостійно шукати та фільтрувати потрібну інформацію.

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

Насправді для старту потрібно просто мати величезне бажання працювати у цьому напрямку. Без «вогню» в очах, без бажання нічого не вийде – це єдиний двигун, який потрібен. Все інше прийде.

Спочатку здається, що дизайнеру потрібно лише «малювати інтерфейси», але це не зовсім так. UI – це інструмент комунікації із зовнішнім світом через візуальне сприйняття. Тут потрібно дуже багато думати, поглиблено все дослідити, проаналізувати, розвивати емпатію, відчувати користувача, аналізувати ринок, врешті зрозуміти клієнта і його бажання, трансформувати це в графічну мову, щоб клієнт ставав щасливим. Саме це приносить мені найбільше задоволення.

Артем Цимбал, CEO в Artkai, куратор курсу «Веб-дизайн. Основи»

Займатися дизайном інтерфейсів варто людям, які люблять вирішувати задачі, робити світ кращим та зручнішим, у кого інженерний склад розуму і одночасно розвинута емпатія. Тому що інтерфейси – це більше про функцію, ніж про гарні картинки. Якщо хочеться творчості, краще йти в графічні дизайнери. Також ця робота не дуже підходить інтровертам – професія вимагає виходити «в поля» і працювати з людьми.

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

Зараз стирається межа між розробниками і дизайнерами. З’являється все більше перспектив розвитку у професії – дизайнери сильніше впливають на бізнес та світ в цілому.