Що таке ui. UX-дизайн – докладний посібник. Продукт має завжди розвиватися

Переклад матеріалу Hubspot про те, що таке UX-дизайн, як він створює, які інструменти використовуються і навіщо бізнесу UX-дизайн.

У чому користь вашого сайту чи програми? У тому, що з його допомогою легко збирати інформацію? Чи купувати в один клік, а доставку товару отримувати вже завтра? Чи головне – швидко знаходити відповіді на потрібні запитання?

Подумайте про людей, які розробили цей сайт або програму. Яку вони мали на меті?

Вони намагалися зробити веб-ресурс, на якому було все те, за що його полюблять. Простий у використанні сайт, який би швидко видавав шукану інформацію та допомагав приймати виважені рішення.

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

Користувачі шукають блискавичні способи вирішення проблем, тому UX дуже важливий. Подбайте про те, щоб сайт був зрозумілим і простим у розумінні користувачів.

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

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

Що таке UX-дизайн?

UX-дизайн, або дизайн досвіду взаємодії - те, від чого залежить, наскільки користувач буде задоволений програмним продуктом або сервісом; цей процес передбачає поліпшення функціональності, юзабіліті та зручності. UX-дизайн – створення програмних продуктів з продуманим та релевантним користувальницьким досвідом. Область UX-дизайну охоплює безліч підрозділів, які варто врахувати.

1. Інтерактивний дизайн

Інтерактивний дизайн, або IxD - підрозділ UX-дизайну, що визначає взаємодію між користувачем та продуктом; мета цих взаємодій - хороший користувальницький досвід.

2. Візуальний дизайн

У візуальному дизайні застосовуються ілюстрації, фотографії, друкарня та колірні схеми – все це розширює досвід взаємодії кінцевого користувача. У візуальному дизайні важливо дотримуватись принципів художнього оформлення. Серед такого – баланс, простір, контраст… Колір, форма, розмір та інші елементи також впливають на дизайн.

3. Користувальне дослідження

Це останній із складових елементів UX-дизайну, за допомогою якого компанії з'ясовують очікування своїх клієнтів. Успішний веб-проект є певною метою і вирішує конкретні завдання, тому важливий крок – дізнатися, що потрібно споживачеві. Без цього в основі дизайну – лише припущення та припущення.

4. Інформаційна архітектура

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

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

Складові процеси UX-дизайну

Вирізняють три етапи UX-дизайну: 1. пошук цільової аудиторії 2. розуміння цілей компанії – як такі цілі впливають користувача 3. нешаблонне мислення

Зазвичай У UX-дизайні використовується підхід, у центрі якого користувачі – за три етапи створюється потрібний кінцевий продукт. Найпростіше – слід враховувати потреби тих, для кого дизайн розробляється. Застосовується маса рішень, щоб усунути всілякі складності та шорсткості; створюються прототипи, які тестуються користувачам.

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

Принципи UX-дизайну

Галузь UX-дизайну стрімко змінюється, але основні принципи ті самі. Дизайнери повинні розуміти, що їм потрібне з погляду візуального балансу. Короткість та зрозумілість – важливі нюанси; тут застосуємо принцип – що менше, то краще. Прагніть того, щоб дизайн був інтуїтивно зрозумілий, і, що ще важливіше, враховуйте інтереси та потреби користувачів.

Сфера застосування UX зазвичай зводиться до нових технологій, але в основі всього цього старі, як світ, принципи, які допомагають дизайнерам вирішувати всілякі проблеми за рахунок послідовної та предметної методології.

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

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

Доступність: Ніхто не хоче даремно витрачати свій час. Успішний UX-дизайн покращує навігацію.

Легкість: Послідовність та невигадливість дизайну – це завжди добре. Ви будуєте відносини з користувачами завдяки зручному UX.

Простота: Жодних прорахунків або зайвих описів. Відразу переходьте до головного.

Результат UX

Коли UX-проект завершено, дизайнер та команда показують клієнту та своїй команді список того, що було зроблено. Потрібно показати процес роботи, список реалізованих ідей.

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

1. Користувальне дослідження

Потреби, тенденції та мотивація користувачів – все це з'ясовується в ході різних досліджень користувача. Це можуть бути кількісні та якісні дані, отримані за час тестів, наприклад, за участю фокус-груп; детальний опис процесу реєстрації, онбордингу та запитів у клієнтський сервіс. Мета полягає в тому, щоб отримати детальний аналіз того, що є на сайті, і що ще можна покращити – всі ідеї тестуються на реальних користувачах.

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

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

2. Оцінка конкурентів

Оцінка сильних і слабких сторін конкурентів – це спосіб розширити власну UX-стратегію. Найкраще діяти з допомогою аналітичних звітів, у яких висвітлювалися конкуруючі розробки. По суті, це детальний аналіз інтерактивного дизайну конкурентів, список слабких місць, прорахунків та недоглядів загалом того, що може стати конкурентною перевагою.

3. Інтерактивний дизайн

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

4. Інформаційна архітектура

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

Що таке дизайн інтерфейсу користувача?

Коли Apple представила навігаційний компонент Click Wheel для iPod, ця штука була інтуїтивно зрозумілою та високофункціональною – не кажучи вже про візуальну складову. Це хороший приклад успішного інтерфейсу користувача, або UI. UI – це спосіб взаємодії з комп'ютерами, машинами, сайтами, додатками, пристроями, що носяться, та ін. UI-дизайн – це те, що робить всі ці речі максимально спрощеними та ефективними.

UI vs. UX

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

Загальні UI-елементи

У UX та UI багато спільного, але важливо відзначити і ключові відмінності цих двох предматів. Знову ж таки, UI орієнтований на зовнішню складову продукту, тоді як UX більше пов'язаний з тим, як люди взаємодіють із сайтом або додатком. Ось найпоширеніші елементи UI, про які потрібно знати, щоб краще розібратися на відмінностях:

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

Навігація «хлібні крихти»

Це дизайнерський інструмент, який візуально покращує юзабіліті сайту.

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

Елементи керування введенням: користувачам надається кілька варіантів, щоб відповісти на запитання, яке їм задають. Це можуть бути чекбокси, списки, що випадають, і перемикачі. Інформація має бути короткою і стиснутою, щоб було простіше з'ясувати потреби.

Дослідження досвіду взаємодії

Без дослідження не вдасться дізнатися про потреби та переваги людей. UX-дослідження - це пошук того, що потрібно користувачам; отримані дані лягають основою UX-дизайну. Компанії та дизайнери застосовують дослідження, щоб зробити певні висновки про те, що працює і що краще змінити. Існує кілька варіантів UX-досліджень.

Юзабіліті-тестування

Завдання такого дослідження – дізнатися, наскільки успішним є продукт; У тестуванні беруть участь користувачі. Так компанії отримують реальну інформацію у тому, як користуються продуктом чи системою, чи як цей продукт чи система працюють. Є два основні способи тестування.

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

Віддалене юзабіліті-тестування дозволяє компаніям провести дослідження в умовах, коли користувачі знаходяться у своєму природному середовищі (наприклад, у себе вдома або в офісі).

Інструменти юзабіліті-тестування

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

Adobe Fireworks СS6 дозволяє веб-дизайнерам створювати графіку для веб-сторінок без необхідності вникати в тонкощі програмного коду або дизайну. Adobe Fireworks має ряд переваг. Цей інструмент має вражаючу точність пікселя, має опції стиснення зображень (JPEG, GIF тощо), що дозволяє користувачам створювати функціональні сайти та будувати вектори.

За допомогою Adobe XD можна створювати дизайн сайтів та мобільних додатків, а також прототипи, каркасне моделювання та векторну графіку. Можна ділитися інтерактивними прототипами на кількох платформах, включаючи Windows, Mac, iOS та Android – інструмент ідеально підходить для роботи в команді.

Axure RP Pro – ще один гарний інструмент для UX-дизайну та, до того ж, безкоштовний. У Axure реалізовано кілька опцій, зокрема. прототипування та документування. Можна навіть створювати схему переміщення користувача та карти сайтів. Axure ідеально підходить для створення веб- та десктопних програм, користувачам надається можливість швидкого експорту в PDF або HTML.

Це комплексний софт із безліччю специфічних функцій, у т.ч. недиструктивне редагування (під цим передбачається те, що Sketch не змінюватиме щільність пікселів зображення, з яким ви працюєте). Експорт коду, піксельна точність, прототипування, векторне редагування – основні переваги Sketch.

6. Софт для сторибордингу

Ви можете поставити запитання, навіщо в UX-дизайні потрібен сториборд. Але це хороший спосіб візуально передбачити, як користувач буде взаємодіяти з вашим продуктом у широкому контексті. Є кілька інструментів для сторибордингу, з різними функціями та рівнями складнощів.

Storyboarder – безкоштовна розробка з базовим функціоналом, що підійде для всіх дизайнерів, незалежно від рівня їхньої майстерності. Це програма швидко створює нариси чи фігурки, щоб описати план чи ідею. Ще один інструмент - Toon Boom Storyboard Pro. Він поєднує функцію малювання, анімації, контролю камери та інші численні опції – за щорічну або щомісячну плату. Широкий функціонал, для ускладненого сторителлінгу та детальної підготовчої роботи. Все це підійде для дизайнерів, які шукають можливість візуально розповісти свою історію за допомогою інтерфейсу.

Як стати UX-дизайнером?

Якщо ви любите дизайн, дослідження та роботу з людьми – вислуховувати розповіді інших про свій досвід, тоді можливо варто подумати про кар'єру в UX-дизайні. У такому разі вам доведеться зосередитись на концептуальних аспектах дизайну; створювати якісний досвід взаємодії інших користувачів.

Існує кілька важливих кроків на шляху до кар'єри UX-дизайнера. Багато університетів світу пропонують свої курси, але щоб на них записатися, 4 роки освіти у сфері дизайну – це, як правило, обов'язкова умова. Є більш гнучкі програми, такі як Quinnipiac University Graduate Program in User Experience Design. Існують програми сертифікації професіоналів. Багато залежить від тривалості навчання та рівня підготовки.

Якщо ви готові втілити свою мрію та стати UX-дизайнером, знадобиться резюме та яскраве портфоліо. Стануть в нагоді такі ресурси, як Dribbble або Behance. Свої роботи можна продемонструвати на власному сайті, створеному за допомогою таких конструкторів як SquareSpace.

Не упускайте з поля зору такі нюанси:

Візуальна привабливість

Презентація – це все. Робота має говорити сама за себе… показуйте, а не говоріть! Вибір кольору, типографіка – це важливо.

Додати сторінку «про себе»

Чому хтось повинен вас найняти? Що нового ви можете принести до якоїсь організації? Продемонструйте рекрутерам своє унікальне бачення або те, що вас надихає.

Співробітник компанії вашої мрії не повинен мати складнощів з навігацією по сайту-портфоліо. У меню додайте такі розділи, як контакти, резюме, портфоліо, про мене і т.д. щоб спростити навігацію.

Поясніть, як ви створюєте свій UX Ваш майбутній роботодавець хоче зрозуміти ваш спосіб мислення. Додайте інформацію, яка б розповіла рекрутеру про ваше UX-дослідження, брейнстормінг, процес створення дизайну або прототипування.

Створіть додаткове портфоліо

Використовуйте інші інструменти, щоб ваші роботи були доступні на веб-ресурсах, де проводять час дизайнери та ті, хто хочуть їх найняти,

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

Перед розробниками веб-інтерфейсів у будь-якому проекті ставиться завдання створення дружнього по відношенню до користувача інтерфейсу. Однак це не завжди таке просте завдання, як може здатися на перший погляд, і часом вимагає чималого досвіду проектування. Головні вимоги тут – зручність, практичність та інтуїтивна зрозумілість. Саме в цей момент вступають у гру такі поняття як UX та UI дизайн, які часто плутаються. Розглянемо кожне з них окремо та визначимо їх ключові моменти.

UX дизайн (UX design)

User Experience Designу перекладі означає «досвід взаємодії»і включає різні UX-компоненти: інформаційну архітектуру, проектування взаємодії, графічний дизайн і контент.

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

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

Основні питання, які вирішує UX дизайн:

• Постановка цілей і завдань - чого нам потрібно досягти?
• Підбір відповідних UX інструментів для реалізації цілей
• Розробка продукту, максимально зручного та легкого у сприйнятті цільовою аудиторією
• Аналіз кінцевого результату - чи відповідає продукт очікуванням замовника та наскільки високий рівень задоволеності користувачів.

Саме грамотна продуманість всіх деталей цих етапах дозволить створити армію шанувальників вашого продукту. Яскравим прикладом тут є компанія Apple, яка пішла таким шляхом і завоювала серця тисяч і мільйонів.

UI дизайн (UI design)

User Interface Design або інтерфейс користувача- це вужче поняття, що включає певний набір графічно оформлених технічних елементів (кнопки, чекбокси, селектори та інші поля). Його завдання – допомогти користувачеві організувати взаємодію з програмою/сайтом. На сьогоднішній момент існують деякі правила UI дизайну:

1. Організація елементів інтерфейсу.Це означає, що вони мають бути логічно структуровані та взаємопов'язані.
2. Угруповання елементів інтерфейсу.Має на увазі об'єднання в групи логічно пов'язаних елементів (меню, форми).
3. Вирівнювання елементів інтерфейсу. Важко уявити, що погано вирівняний інтерфейс може бути для когось зручним!
4. Єдиний стиль елементів інтерфейсу.Стильове оформлення відіграє не останню роль, адже саме воно зберігається у пам'яті користувача.
5. Наявність вільного простору.Це дозволяє розмежовувати інформаційні блоки, зосереджуючи увагу на чомусь одному.

Розроблений за всіма правилами інтерфейс користувача значно підвищує ефективність ресурсу і дає йому конкурентні переваги.

Інформаційна архітектура (ІА)

Окремо хотілося б сказати пару слів про Information Architecture (IA ). Її діяльність сфокусована на організації даних, тобто наскільки інформація є структурованою з погляду користувача, а чи не технічних чи системних правил. Вона визначає розміщення елементів на сторінці, зв'язок самих сторінок. Компетенція ІА - це скоріше меню та навігація та їх грамотне впровадження.

Підсумовуючи, хотілося б помітити, що у різних джерелах під UX дизайном розуміються різні речі, але загалом усі вони мають на увазі описану у статті роботу над продуктом. А що для вас означає UX?

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

Щоб розпочати навчання UX-дизайну, необхідно зрозуміти, як будується робота над будь-яким цифровим проектом та за що саме відповідає такий дизайнер під час розробки.

Хто такий UX-дизайнер, чим він займається

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

Спочатку дизайнери аналізують аудиторію продукту, досліджують її цілі та страхи. Потім проводять інтерв'ю з реальними людьми, спостерігають за сайтами та додатками конкурентів. Після цього створюють прототипи, показують їх користувачам та передають файли розробникам.

Якщо докладно розглянути кожен із цих етапів, то легко зрозуміти, з чого розпочати навчання UX-дизайну.

Хто може стати UX-дизайнером

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

Однак, бути веб-дизайнером для роботи в UX необов'язково. Усі процеси у цій сфері насамперед будуються на логіці, вмінні мислити критично, спілкуванні з людьми і здатність до аналізу.

Один із дизайнерів Google, Фіона Йонг, розповіла, що в її команді - лише кілька фахівців з освітою дизайнера. Інші раніше працювали у суміжних областях чи інших галузях. Хтось займався когнітивними науками, хтось психобіологією.

Тому добрими проектувальниками можуть стати і архітектори, і інженери, і програмісти. Головне – розібратися в основах інтерактивного дизайну та зрозуміти, як будується логіка роботи в UX. Це можна зробити самостійно або на спеціальних курсах UI/UX-дизайну.

З чого почати

Почати навчання UX-дизайну можна з курсів, книг та статей. Головне - скласти правильний план навчання, сформулювати цілі та рухатися від загального до приватного.

Процес роботи над продуктом складається з кількох етапів. На кожному з них UX-дизайнер займається різними речами. Щоб зрозуміти, які знання необхідні для роботи, потрібно розглянути кожен із етапів докладно:

• дослідження,
• аналіз даних,
• проектування,
• дизайн,
• аналіз метрик.

Дослідження

UX-дизайнер робить так, щоб майбутній сайт або програма виконували корисну дію - продавали, рекламували, допомагали користувачам.

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

Хороший метод дослідження – це розмова з реальними користувачами. При створенні сервісу для покупки квитків краще сходити на вокзал та провести інтерв'ю з пасажирами. Дізнатися, чи їм легше купувати квитки через інтернет, чи зручно оплачувати з карти, як вони хочуть вибирати місця у вагоні.

На етапі дослідження UX-дизайнер має активно розмовляти з потенційними користувачами та запитувати, що їм потрібно.

Аналіз даних

Коли завдання продукту зрозумілі, дизайнер продумує логіку взаємодії.

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

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

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

Створення сценаріїв допомагає продумати структуру програми або сайту та базові елементи.

Проектування

На цьому етапі візуалізують усі зібрані дані. Будують структуру програми, мають елементи кожному екрану.

Проектування - це створення готового дизайну. Це швидкі контури, які показують користувачам. Проводять тестування та дізнаються, чи вирішить продукт у такому вигляді завдання.

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

Етап проектування допомагає значно заощадити час. Швидше показати малюнок користувачеві і запитати його думку, ніж малювати і програмувати товар з нуля і потім усувати недоліки.

Дизайн

Створенням остаточного варіанта займається UI-дизайнер. Але часто малювати остаточний варіант доводиться самостійно. Тому корисно отримати основні навички та навчитися UI-дизайну.

На етапі з прототипів та вайрфреймів створюють візуалізацію, працюють із кольором, композицією та типографікою, оформляють контент.

Для цього підходять графічні редактори, де працюють дизайнери:

• Adobe Photoshop,
• Adobe XD,
• Sketch,
• Фігма.

Завдання для UX-дизайнера – стежити за юзабіліті окремих елементів та сторінок загалом. Спостерігати, щоб при додаванні візуальних ефектів, не загубився основний зміст продукту.

Аналіз метрик

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

Працюють над продуктом - проводять юзабіліті- та A/B-тести. Покращують досвід користувача, додають нові можливості.

Як вчитися UX-дизайну

UX-дизайн складається з різних напрямків та дисциплін. Це і візуальний дизайн, і робота з користувачами, і результати тестування. Деякі фахівці з UX працюють в одному напрямку, деякі – у всіх.

Щоб навчитися UX-дизайну, потрібно представляти весь шлях розробки продукту та покращувати навички, необхідні кожному етапу.».

При вивченні теорії не забувайте про практичні навички. Створіть макет сайту або придумайте мобільний додаток. Розділіть проект на частини та ретельно попрацюйте над кожною: проведіть дослідження та аналіз, потім займіться проектуванням та дизайном. Тільки практика допомагає дизайнеру стати добрим фахівцем.

Термін «дизайн» може здаватися оманливо простим. У той же час він дуже розпливчастий, і якщо ви попросите різних людей пояснити вам дане поняття, їх відповіді будуть разюче відрізнятися.

Наприклад, коли хтось каже: "О, а я працюю дизайнером", більшість людей може не зрозуміти що ж тут мається на увазі. А все тому, що за таким, начебто, простим словом криється величезна кількість смислів.

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

Така професія, як UX дизайнер може здатися на перший погляд дивною і навіть трохи складною, для тих, що раніше з нею не стикався - більше того, деякі досвідчені розробники не розуміють що під нею мається на увазі і можуть ставити питання: Хто ж такі UX дизайнери і чим вони взагалі займаються?

Проте зараз UX-індустрія зростає швидко. Достатньо лише подивитись наскільки зросла кількість UX (або «User Experience») фахівців.

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

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

Хто такий дизайнер?

Робота UX дизайнера, зазвичай, пов'язаний сприйняттям будь-якого продукту чи послуги, тому проблеми дизайну у разі не завжди очевидні.

Вони суб'єктивні, і можуть мати більше одного рішення. По суті, це обов'язок UX дизайнера переконатися, щоб кожен етап процесу проектування продукту випливав із попереднього.

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

Що робить UX-дизайнер?

Хороший UX фахівець може поєднати всі аспекти відмінного досвіду користувача в одному продукті.

Це може бути зроблено тільки в тому випадку, якщо ви переконалися, що зазначені аспекти добре взаємодіють разом, а не окремо. Професіонал, який ми розглядаємо, несе повну відповідальність за майбутні результати і зокрема за сам ux.

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

Щоб бути дійсно хорошим UX дизайнером, вам знадобляться відмінні комунікаційні навички, захопленість, любов до інновацій, схильність до творчості та ініціативність, щоб розуміти, коли можна поекспериментувати, а коли слід дотримуватись встановлених рамок. Тим не менш, всім фахівцям UX слід почати з нижчих щаблів кар'єри, якщо вони, звичайно, хочуть бути затребуваними на ринку в майбутньому.

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

Ви повинні бути в змозі пояснити інвесторам користувальницьку взаємодію від початку до кінця, а також використовувані характеристики та контекст. За підтримки сильної команди, UX дизайнер може перетворити характеристики будь-якої відомої платформи, наприклад Facebook, на цінний і доступний інструментарій.

Вайрфрейми і скетчі - це лише мала частина роботи

Вайрфрейми та візуальні плани – результат ретельної підготовки, яку необхідно провести, щоб створити продукт. Це дійсно важливо уявити процес підготовки у візуальній формі, наприклад у вигляді презентації PowerPoint, для подальшого використання подібних матеріалів дизайнерами та програмістами.

Досить легко отримати дані про прототипи продукту під час юзабіліті тестів, або навіть створювати скринкасти. Ці інструменти можуть бути також важливими, як і вайрфрейми.

UX дизайнерів можна також розпізнати по тому, як вони фокусуються на ретельно складеному плані покращення дизайну продукту, з метою підвищення його ефективності.

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

Проведення тестування користувача

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

Насправді процес оцінки повинен включати спостереження за здатністю клієнта здійснити дії, які були для них спроектовані. Таким чином, вони можуть надати вам свою не відредаговану відповідь про власний досвід користувача.

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

На щастя, клієнтоорієнтоване тестування, насправді таке ж достовірне і просте як і спостереження за взаємодією користувача з вашим продуктом онлайн.

Визначення та створення «персон»

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

Хоча подібне заняття може здатися вельми привабливим - повністю придумати персонажа, проте, якщо ваша "персона" не базується на статистичних даних про ваших реальних користувачів, то, на жаль, вона буде марною. Створення персонажа також не матиме жодного значення, якщо він не має жодного відношення до вашого бізнесу.

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

Коли ви не можете назвати себе UX-дизайнером

Ви не зможете стати по-справжньому кваліфікованим дизайнером UX, якщо ви не навчитеся взаємодіяти з людьми, які повинні допомагати вам формувати свої стратегії.

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

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

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

Якщо ваш начальник просить вас спроектувати онлайн-платформу, а ви навіть не питаєте, навіщо це потрібно зробити, то ви швидше за все звичайний (причому не обов'язково талановитий) веб-дизайнер, а не фахівець UX.

Приймати рішення, ґрунтуючись лише на особистому досвіді, також погана ідея. Якщо ваш бос запитує: "Чому ви вирішили використовувати поля для мітки, замість іншого альтернативного варіанта зворотного зв'язку у вашому останньому опитуванні?", Ви повинні відповісти щось краще, ніж просто: "Я вибрав їх тому, що вони мені подобаються". Це однозначно не працює у UX дизайні.

Якщо ви хочете стати успішним і кваліфікованим UX дизайнером, дуже важливо користуватися всіма інструментами проектування - починаючи від інтерв'ювання клієнтів, закінчуючи юзабіліті тестами, створенням персон, контекстних оцінок, концептуальних моделей, карт сайтів, прототипів продукту, вайрфрейів, А/В оцінки та багато іншого .

Для кваліфікованих UX дизайнерів необхідно не тільки з'ясувати особливості своєї цільової аудиторії, але також мати здатність продемонструвати цю інформацію своїй команді.

Продукт має завжди розвиватися

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

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

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

Насправді, для UX дизайнерів може виявитися корисним періодично оглядатися на свої минулі проекти (успіхи та невдачі), щоб з'ясувати, чому вони навчилися, і як це можна застосувати у своїй майбутній роботі.

Представляємо нову статтю серії. У цій частині циклу розглянемо позицію UX/UI дизайнера - спеціаліста, який відповідає за відповідність зовнішнього вигляду та логіки продукту.

UX/UI дизайнер- спеціаліст, який займається проектуванням інтерфейсів користувача.

Типовий робочий деньвключає в себе:

• роботу над пріоритетними завданнями (проектування, малювання);
• спілкування із замовником;
• внесення поправок.

Переваги і недоліки

Професія приваблює дизайнерів можливістю робити світ краще, а також своєю перспективністю та затребуваністю на ринку:

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

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

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

«Я навчалася на програміста-сисадміна, але завжди було цікаво робити щось у Фотошопі. Раніше не було такої кількості туторіалів, відеоуроків та статей, як зараз, тому більшість функцій та можливостей я освоювала методом тику. Пізніше вирішила спробувати Ілюстратор, він був набагато складнішим за Фотошоп, але прекрасний для створення вектора. Мені подобається створювати щось нове, щось корисне та красиве, подобається покращувати та бачити досягнутий результат. Сфера дизайну дозволяє все це робити. Цікаво й те, як змінюються тренди, з'являються нові програми та фічі, потрібно завжди за всім цим стежити та постійно розвиватися».

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

Ще один плюс – можливість працювати віддалено (20% всіх дизайнерів), великий вибір проектів на фрілансі.

Серед мінусівПрофесії дизайнери називають спілкування із замовниками, які не знають, чого хочуть, а також недооціненість колегами з IT:

«У 80-90% випадків доводиться працювати без ТЗ з вимогами типу: «Зроби мегакрасиво та мегаконфігуровано».

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

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

«Мінус - як і у всьому ІТ - сидяча робота, страждають очі і іноді замовник, якому треба зробити білий #ffffff ще білішим:)»

Як стати і куди рухатися далі

Перший і головний навичка щодо UI - освоїти графічний редактор. Найпопулярніший інструментарій - Adobe Photoshop, Sketch, Principle, Adobe Illustrator, After Effects. Для початку можна спробувати перемалювати скріншоти будь-якої мобільної програми або сайту. Але не просто скопіювати (хоча і це потрібно вміти), а помітити якусь незручність та запропонувати рішення, як зробити краще.

Також важливо розуміти теорію кольору, типографіку, композицію, ергономіку сайту (принципи юзабіліті інтерфейсів), основи маркетингу, бізнес-аналіз, психологію. Для більш ефективного спілкування з розробниками будуть корисні навички верстки (HTML/CSS) та базові знання JavaScript та фреймворків.

Вивчення UX можна розпочати зі знайомства з методологією, почитавши книги Нільсена Нормана, Алана Купера, Джефа Раскіна, Стіва Круга, Алістера Коберна. Більш прикладна література - "User Experience Team of One: A Research and Design Survival Guide" Leah Buley.

«У сучасному світі можливостей для реалізації безліч. Я купував і продовжую купувати онлайн-курси на таких платформах як Coursera, Udemy, Edx. Дивлюся онлайн-конференції від Adobe, Google, читаю технічну літературу, аналізую роботи на Dribbble, Behance, Awwwards».

«UX/UI дизайнеру треба вивчити класику інтерфейсу користувача: „Не змушуйте мене думати“ Стіва Круга, „Дизайн звичних речей“ Нормана, читати Люка Вроблевскі. Необхідно постійно практикуватись, ставити себе на місце користувача. Знайти ментора, який вказуватиме на помилки, давати поради та сприятиме зростанню».

Почати кар'єру можна з фрілансу на різних англомовних платформах, також буде корисно випробувати свої навички на чемпіонатах, наприклад Dev Challenge. Це допоможе напрацювати портфоліо.

UX та UI навички та компетенції ()

З особистих якостей важливі:

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

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

Можливі кар'єрні шляхи UX/UI дизайнера:

• удосконалюватись як дизайнер, підвищувати рейт (якщо фрілансер);
• освоювати суміжні напрямки, розвиваючись як дизайнер продукту; VR дизайнер; VFX дизайнер; Game дизайнер;
• дорости до позиції Арт-директора (Head of Design);
• розвиватися як , якщо хочеться переключитися з дизайну управління продуктом загалом;
• стати, якщо цікаво координувати людей;
• зайнятися, якщо більше цікавий технічний аспект;
• освоїти програмування та стати UI-розробником;
• спробувати себе у маркетингу або .

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

Дякую за допомогу у написанні статті Юлії Бондаренко, Максима Паливоду, Марини Поповиченко та 25 інших українських дизайнерів, які розповіли DOU про свою посаду. Наведені у статті цитати взяті з їхніх оповідань.