.png){kind=logo}
Charity M. Jantzen,UXC
Автотеатр Showboat
Практичний приклад адаптивного дизайну
Автор Чаріті М. Янцен
Nobody likes to wait in line, so we got rid of them!
Продукт
Ласкаво просимо до нового досвіду перегляду кіно, якого ніколи раніше! Ви можете переглядати фільми, купувати квитки, знижки та сувеніри, а також орендувати цей ретро-театр. Наш сайт/додаток розроблено для налаштування всього, від місця паркування до субтитрів і субтитрів, і все це з вибраного пристрою.
Проблема
Тоні Аджана — завзятий кіноман і зайнятий тато, якому потрібен спосіб легко придбати квитки в кіно та отримати знижки в Інтернеті, тому що він не хоче чекати в черзі з багатьма дітьми та пропускати фільм.
Мета
Створіть інтерактивний метод для користувачів, щоб оптимізувати та персоналізувати свій театральний досвід. Використання цієї програми збільшить продажі та гарантує, що кожна транзакція не чекає черг.
Продукт
Ласкаво просимо до нового досвіду перегляду кіно, якого ніколи раніше! Ви можете переглядати фільми, купувати квитки, знижки та сувеніри, а також орендувати цей ретро-театр. Наш сайт/додаток розроблено для налаштування всього, від місця паркування до субтитрів і субтитрів, і все це з вибраного пристрою.
Responsibilities
Розробка персонажів, історій користувачів і карт подорожей користувачів
Проведення досліджень юзабіліті
Створення каркасів і прототипів
Тестування та повторення дизайнів
Проектування макетів
Високоякісний прототип
Впровадження доступності
Розуміння користувача
Дослідження користувачів: болючі точки
.png){kind=small}
Навігація
Користувачі не могли знайти інформацію про фільми, які вони хотіли переглянути.
.png){kind=small}
Взаємодія
Кіноглядачі поспішають, коли намагаються щось купити в кінотеатрі.
Досвід
Великі черги часто викликають у кіноглядачів дратівливість; вони відмовляються від покупки квитків або закусок у снек-барі.
Персона: Тоні Аджана
Постановка проблеми:
Тоні — затятий кіноглядач, який любить брати своїх дітей у кіно, але клопоти з купівлею квитків і закусками в кінотеатрі стають непосильними. Йому потрібен спосіб робити покупки в Інтернеті, тому що він хоче насолоджуватися фільмом.
Карта подорожі користувача
Я створив цю карту подорожі, щоб допомогти мені визначити будь-які прогалини між особистістю користувача та його ментальною моделлю. Крім того, карта подорожі допомогла мені візуалізувати загальну кінцеву мету користувача та те, як їм потрібно досягти своєї мети.
Запуск дизайну
Карта сайту
Користувачі мали значні труднощі з навігацією, що зробило їх основною проблемною точкою. Я вирішив використати ці знання і створив мапу сайту.
Моєю метою було прийняти стратегічні рішення щодо інформаційної архітектури для покращення загальної навігації веб-сайтом. Я вибрав структуру навігації, яка спростила роботу користувачам і мала можливість розширити її в майбутньому.
Потік користувачів
Перш ніж почати, я планую потік користувачів і використовую це як посібник, коли починаю створювати сторінки. Я вважаю це надзвичайно корисним, коли працюю на самоті та над проектами, які мають швидкий оборот. Крім того, потік користувачів надає мені метод відстеження завершених, незавершених і тих, що вважаються поза межами проектів, які я розробляю.
Паперові каркаси
Після завершення конкурентного аналізу та пам’ятаючи про те, що потрібно користувачам і зацікавленим сторонам, я почав накидати варіанти кожного екрана в своїй програмі.
Спочатку я вважав, що оформлення замовлення на домашній сторінці — це ідеальне рішення.
Паперовий каркас
Варіації розміру екрана
Для мене дуже важливо розробити повністю адаптивний сайт. Я хочу переконатися, що всі користувачі та їхні пристрої підтримуються. Я почав працювати над паперовими каркасами різних розмірів екрана, щоб переконатися, що кожен користувач мав доступ до сайту.
Цифрові каркаси
Наявність паперових каркасів як керівництва для створення цифрових каркасів допомогло пришвидшити процес, і стало більш зрозумілим, що потрібно від користувачів. Під час створення цифрових каркасів я помітив кілька проблем із взаємодією, які я зміг негайно вирішити.
.png)
Прототип низької точності
Отримавши відгуки від своїх товаришів по команді, я створив прототип низької точності з фундаментальним підходом до придбання квитка в кіно.
Дослідження зручності використання: параметри
Тип дослідження
Модероване дослідження зручності використання
Учасники
5 учасників
Місцезнаходження
Модероване дослідження зручності використання
Довжина
20-30 хвилин
Дослідження зручності використання: результати
Це були основні результати дослідження зручності використання:
.png)
Придбання снеків
Більшість користувачів намагалися додати інші пільгові елементи
.png)
Концепція
Кілька користувачів не розуміли процесу й соромилися купувати та відвідувати.
Дата
Користувачі не змогли вказати дату, коли вони бажають відвідати фільм.
Перевизначення дизайну
Макети
Перед вивченням зручності використання
Після вивчення юзабіліті
Макети
Отримавши відгук про профіль VIP/учасника, я вирішив застосувати більш соціальний підхід і додати значки гейміфікації, щоб винагородити користувачів.
Перед вивченням зручності використання
Після вивчення юзабіліті
Макети
Після тесту на зручність використання результати виявили, що користувачі хочуть мати можливість переглядати майбутні фільми, а не лише функцію цього тижня. У результаті я видалив великий попередній перегляд на головній сторінці та додав кілька менших попередніх переглядів трейлерів, що дозволило кінотеатру показувати більше двох фільмів на тиждень.
Перед вивченням зручності використання
Після вивчення юзабіліті
.png)
Прототип високої точності
Моя мета полягала в тому, щоб зменшити кількість часу, який користувачі проводять у чергах, і їхню плутанину, а також збільшити продаж квитків; на основі зворотного зв'язку; Я досяг цієї мети. Крім того, було цікаво вивчати нову програму та всі тригери.
Перегляньте автомобільний театр Showboat
Особливості доступності
Я хочу переконатися, що сайт доступний людям із слабким зором і дальтонізмом. Я досяг цього, забезпечивши, щоб сайт був сумісним з WGA AA із співвідношенням 4.5.1 між посиланнями, основним текстом і фоновим контрастом.
Я хотів використати ієрархічний макет сторінки, щоб упорядковувати речі та допомагати програмам зчитування з екрана орієнтуватися, що робити далі.
Я розробив сайт зі зміною розміру тексту та міжтекстових інтервалів, що допомагає користувачам у разі втрати зору та інших проблем із доступністю.
Йду вперед
Винос
Вплив
"Видатно!"
«Мені подобається новий сайт; він чудовий і добре зроблений».
Користувач знайшов нещодавно «встановлений абсолютний узгоджений потік користувачів із чіткими навігаційними підказками». Загалом сайт відповідав розумовій моделі та цілям користувача. Користувачі могли купувати квитки, товари, пільги та навіть отримувати паркувальні місця онлайн.
Що я навчився
Для мене найцінніший висновок — це вести щоденник цілей, цитат, думок та ідей, коли кожен результат збирається разом.
Наступні кроки
Проведіть подальше тестування зручності використання веб-сайту та внесіть зміни, як описано нижче.
Розпочніть розробляти програми замкнутого зв’язку та субтитрів для людей з обмеженими можливостями.
Моїм наступним кроком буде попрацювати над підменю, зобразити їх і створити нові функції.