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

Диза́йн інтерфе́йсу користувача́ (скор. UI або UID) — це принципи та відповідний процес розробки інтерфейсу користувача для машин та програмного забезпечення (таких як комп'ютери, побутові, мобільні та інші електронні пристрої) при якому досягають максимально зручний та інтуїтивний спосіб їх використання користувачами.

Історія

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

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

Складові

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

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

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

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

Інформаційна архітектура — це мистецтво і наука про структуруванні та організації інформації в продуктах і послугах для підтримки зручності використання і пошуку.

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

Структурування, організація та маркування

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

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

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

Дизайн взаємодії

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

• Визначення шаблонів взаємодії, найбільш придатних в контексті, щоб зменшити ментальне навантаження на користувача
• Включення користувальницьких потреб, зібраних під час досліджень користувацького досвіду
• Поведінка інтерфейсу, така як «drag-drop», вибір і дію миші
• Ефективна взаємодія сильних сторін системи
• Створення інтерфейсу інтуїтивним шляхом створення можливостей
• Підтримка узгодженості у всій системі

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

Юзабіліті

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

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

Доступність

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

Взаємодія людини і комп'ютера

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

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

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

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

Типові результати включають:

• Persona (призначений для користувача інтерфейс)
• Каркас
• Прототип
• Письмові характеристики (що описує поведінку або дизайн), наприклад, прецеденти
• Аудит сайту (юзабіліті дослідження існуючих активів)
• Потоки і навігаційні карти
• або сценарій
• Карти сайту і зміст
• Високоякісні візуальні макети (точне візуальне оформлення та дизайн очікуваного продукту або інтерфейсу)

Загальний процес проєктування

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

1. Дослідження цільової аудиторії
2. Розуміння бізнес-цілей компанії
3. І найголовніше застосувати мислення.

Мозковий штурм і тестування, зрештою, допомагає їм завершити дизайн для своїх клієнтів.

Давайте детально розглянемо крок за кроком процес проєктування виробів:

• Збір інформації про проблему і її чітка ідентифікація

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

• Підготовка до дизайну

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

• Дизайн

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

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

• Тестування і ітерація

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

UX очікувані

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

Наступний перелік — обов'язки дизайнера користувацьких інтерфейсів на кожному етапі проекту:

На самому початку, коли проект більш концептуальний:

• Етнографічні дослідження
• Опитування
• Відгуки клієнтів і тестування
• Адміністрування фокус-групи
• Контекстне Інтерв'ю
• Ментальні моделювання
• Створення «mood board»
• Сортування карток
• Аналіз конкурентів
• Контекстний запит

Поки проект знаходиться в стадії реалізації:

• «Wireframing»
• Евристичний аналіз
• Експертна оцінка
• Плюралістичне проходження гри
• Створення персон
• Сценарії користувача
• Прототипування
• Система відображення
• Юзабіліті-тестування

Після того, як проект розпочався:

• Тестування юзабіліті
• (A / B тестування)
• Додаткове створення «wireframes» після отримання результатів тестування і подальші поправки для покращення користувацького досвіду