CC BY
34
Козловский Н.В.
ПИмд-2003а
Тольяттинский государственный университет ВНЕДРЕНИЕ UX-ИССЛЕДОВАНИЯ В РАЗРАБОТАННЫЙ ПРОЕКТ
Аннотация. В данной статье показывается процесс внедрения UX-исследования на примере разработанного пользовательского интерфейса интернет-магазина.
Ключевые слова: пользовательский интерфейс, UX-исследование, дизайн, эффективность.
Kozlovsky N. V.
PIMD-2003a Togliatti State University
IMPLEMENTATION OF UX RESEARCH IN THE DEVELOPED
PROJECT
Annotation. This article shows the process of implementing UX research using the example of the developed user interface of an online store.
Keywords: user interface, UX research, design, efficiency.
Для демонстрации особенностей процесса внедрения UX-исследования на конкретном проекте необходимо разработки пользовательский интерфейс. В качестве примера был взят вариант разработки интернет-магазина.Пользовательский интерфейс
разработанного проекта для салона по продаже велосипедов был начат с разработки экрана авторизации. На рисунке 1 показан экран авторизации. Полный дизайн сайта показан в приложении.
Рисунок 1 - Экран авторизации
На рисунке 2 показан сценарий использования экрана авторизации в случае если пользователь забыл пароль.
Рисунок 2 - Экран с забытым паролем
Таким образом, был разработан полностью весь пользовательский интерфейс необходимый для нормальной работы интернет-магазина.
Внедрение иХ-исследования в разработанный проект
Эвристическая оценка — это метод проверки интерфейса, основанный на десяти эвристических принципах дизайна, который помогает выявить проблемы удобства программы, приложения или сайта.
Для проведения эвристической оценки используется 10 основных принципов:
1. Отображение статуса интерфейса.
2. Схожесть с реальным миром.
3. Единообразие и последовательность.
4. Контроль и свобода пользователя.
5. Возможность предотвращения ошибок.
6. Распознавание, а не вспоминание.
7. Гибкость и эффективность использования.
8. Эстетика и минимализм.
9. Помощь пользователю в распознавании, диагностике и восстановлении после ошибок.
10. Документация.
Далее опишем каждый из принципов и то, что он в себе учитывает.
Отображение статуса интерфейса — этот принцип основывается на моментальном ответе пользователю о том, что происходит в данный момент, чтобы пользователь понимал, что его запрос принят и находится в обработке. В данном принципе стоит учитывать такие параметры как: наличие индикаторов загрузки, наличие статуса поиска и т.д.
Схожесть с реальным миром - интерфейс имеет детали, внешне схожие с теми, которыми мы пользуемся в реальной жизни.
Единообразие и последовательность - Продукт использует элементы, которые находятся в одном стиле. А также последовательность не сбивает пользователя с толку.
Контроль и свобода пользователя - у пользователя есть возможность отменить действие в случае ошибки.
Возможность предотвращения ошибок - Блокировка некорректного ввода данных, Проверка авторизации
Распознавание, а не вспоминание - интуитивно понятные, общепринятые иконки и кнопки.
Гибкость и эффективность использования - наличие горячих клавиш, возможность персонализации под тип пользователя.
Эстетика и минимализм - приятные цвета, читабельность, отсутствие избыточного количества иконок и украшений.
Помощь пользователю в распознавании, диагностике и восстановлении после ошибок - понятные сообщения об ошибках и
объяснения что нужно делать в случае ошибки, чтобы устранить неполадку.
Документация - Наличие раздела с документацией, например, условия использования и правила конфиденциальности.
Апробация результатов В качестве их исследования был выбран метод интервью. Результаты показаны в таблицах ниже.
_Таблица 1 - Критерии оценивания_
Параметр Критерии Максимальный балл
Единообразие и 3
последовательность.
Единообразие кнопок. 1
Один вид иконки имеет одно 1
значение во всем интерфейсе
Единый цветовой стиль. 0,5
Последовательность действий 0,5
Отображение статуса интерфейса. 2
Анимированный интерфейс (визуализация нажатия кнопок) 1
Наличие индикатора загрузки 1
Эстетика и минимализм. 2
Нет перегруженности в 2
элементах.
Контроль и свобода 1
пользователя.
Возможность совершить ошибку и исправить ее. 1
Распознавание, а не 0.6
вспоминание.
У иконок общепринятый 0.6
смысл.
Возможность 0.5
предотвращения ошибок.
Вывод сообщения о 0.5
неправильном действии
пользователя.
Схожесть с реальным 0,5
миром
Интерфейс имеет детали, 0,5
внешне схожие с
элементамииз реальной
жизни.
Документация. 0,2
Наличие информационного 0,2
раздела с документацией
Гибкость и эффективность 0,1
использования
Наличие ускорителей работы. 0,1
Помощь пользователю в 0,1
распознавании,
диагностике и
восстановлении после
ошибок.
Окно с названием ошибки и 0,1
действиями для ее
предотвращения.
Таблица 2 - Оценка пользовательского интерфейса от пользователя 1
Параметр Критерии Максимальный балл
Отображение статуса интерфейса. Наличие индикаторов добавления, удаления, редактирования. 0.4/0.7
Наличие индикаторов загрузки, отправки 0.4/0.4
Схожесть с реальным миром. Понятный интерфейс 1/1
Единообразие и последовательность. Все элементы составляют одну стилистику 0.4/0.4
Порядок выполнения действий логичен 0.7/0.7
Контроль и свобода пользователя. Возможность отменить совершенное действие 1/1
Предотвращение ошибок. Проверка при авторизации 0.8/0.8
Распознавание, а не вспоминание. Интуитивно понятный интерфейс кнопок 1/1
Гибкость и эффективность использования. Персонализация под тип пользователя 0.2/0.6
Эстетика и минимализм. Хорошая читабельность 0.4/0.6
Отсутствие нагруженности интерфейса 0.8/1
Помощь пользователю в распознавании, диагностике и восстановлении после ошибок, документация. Наличие онлайн техподдержки 0.5/1
Использование продукта должно удовлетворять все типы пользователей. Читабельность шрифта 0.3/0.4
Цветовая гамма интерфейса 0.2/0.4
Сумма: 8,2 балла
Таблица 3 - Оценка интерфейса от пользователя 2
Параметр Критерии Максимальный балл
Отображение статуса интерфейса. Наличие индикаторов добавления, удаления, редактирования. 0.6/0.7
Наличие индикаторов 0.4/0.4
загрузки, отправки
Схожесть с реальным Понятный интерфейс 1/1
миром.
Единообразие и Все элементы составляют 0.3/0.4
последовательность. одну стилистику
Порядок выполнения 0.7/0.7
действий логичен
Контроль и свобода Возможность отменить 1/1
пользователя. совершенное действие
Предотвращение ошибок. Проверка при авторизации 0.8/0.8
Распознавание, а не Интуитивно понятный 1/1
вспоминание. интерфейс кнопок
Гибкость и эффективность Персонализация под тип 0.6/0.6
использования. пользователя
Эстетика и минимализм. Хорошая читабельность 0.4/0.6
Отсутствие нагруженности интерфейса 1/1
Помощь пользователю в Наличие онлайн 0/1
распознавании, диагностике техподдержки
и восстановлении после
ошибок, документация.
Использование продукта Читабельность шрифта 0.3/0.4
должно удовлетворять все
типы пользователей.
Цветовая гамма интерфейса 0.3/0.4
Сумма: 8,4 балла
Заключение
В результате данного исследования было проведено внедрение исследование пользовательского интерфейса.
Научная новизна работы заключается в получении алгоритма, позволяющего проводить ИХ-исследование методом интервью.
Использованные источники:
1. Бернет Дж., С. Мориати. Маркетинговые коммуникации. Интегрированный подход. — Питер, 2017. — 864 с.
2. Вильямс Р. Студия дизайна. /Пер с англ. В.Овчинников, В.Тимохин. -М.: Символ-Плюс, 2018. - 280с.
3. Глазычев В. Дизайн как он есть. — Европа, 2016. — 340 с.
4. Грожан Д.В. Справочник начинающего дизайнера. - Ростов-на-Дону: Феникс, 2019
5. Луптон Э. Графический дизайн от идеи до воплощения. — Питер, 2019.
— 184 с.
6. Мещанинов А.А. Дизайн. Точка над й. - СПб.: Изд-во Политех. Ун-та, 2018. -220с.
7. Молочков, В.П. Photoshop CS6 Extended для фотографов и дизайнеров на примерах / В.П. Молочков. - СПб.: BHV, 2019. - 448 с.
8. Мельников И. Реклама, PR, брендинг и маркетинг. — Мельников И.В., 2018. — 50 с.
9. Михайлов С.М., Кулеева Л.М. Основы дизайна. Учебник для вузов. М., «Союз дизайнеров», 2020.
10. Пименов, П.А. Основы рекламы / П.А. Пименов. - М.: Гардарики, 2016. - 399 с.
11. Полукаров, В. Л. Телевизионная радиовещательная реклама / В. Л. Полукаров. — М.: Полипресс, 2018. - 124 с.
12. Рожкова Н.Г., Данилов П.П., Шитов В.Н. Графический дизайн и реклама на компьютере. Краткое руководство. — Вильямс, 2019. - 320 с.
13. Статкевич Е.А. Речевые стратегии и тактики современной радиорекламы//Е.А. Статкевич Омский научный вестник. — 2019. — № 95.
— С. 212-215.
14. Сурина М.О. Цвет и символ в искусстве, дизайне и архитектуре. -Ростов-на-Дону, 2018.
15. George E. Belch, Advertising and Promotion: An Integrated Marketing Communications Perspective, 10th Edition. — McGraw-Hill, 2018. — 1760 p.
16. Jeff Gothelf Lean UX: Designing Great Products with Agile Teams. — O'Reilly Media, 2018. — 208 p.
17. Jens Miller History of Graphic Design: Vol. 1, 1890-1959 (Multilingual Edition). — TASCHEN, 2018. — 480 p.
18. Peter Bauer Adobe Photoshop CC For Dummies. — For Dummies, 2017.
— 448 p.
19. Robin Landa Graphic Design Solutions. — Cengage Learning, 2018. — 480 p.
20. Xia Jiajia UI/UX Meet Up. — Artpower International, 2017. — 240 p.
21. Xia Jiajia, Yang Ruizhu Fantastic Designs in the Store: An Overall Guideline on Corporate Identity, Visual Identity and Interior Design. — Artpower International, 2017. — 240 p.
22. Spark [Электронный ресурс] Принципы создания логотипа. Режим доступа: https://spark.ru/startup/smartpr/blog/32959/printsipi-sozdaniya-logotipa Дата обращения (25.11.2022)
23. iDivision [Электронный ресурс] Разработка концепции, создание и внедрение фирменного стиля. Режим доступа:
https://www.idivision.ru/services/corporate-identity/ Дата обращения (25.11.2022)
