Разработка навигационного меню веб-приложения банка с использованием метода сортировки карточек

NovaInfo 57, с.60-69, скачать PDF
Опубликовано
Раздел: Технические науки
Просмотров за месяц: 4
CC BY-NC

Аннотация

В данной статье рассмотрен метод сортировки карточек и описывается его применение на примере конструирования навигационного меню для веб-приложения банка

Ключевые слова

ПРОЕКТИРОВАНИЕ, МЕНЮ, СОРТИРОВКА, ДЕНДРОГРАММА

Текст научной работы

Проектирование меню — важный этап проектирования интерфейса приложения. От результатов проектирования меню зависит эффективность взаимодействия пользователя с информационном контентом ресурса.

Сортировка карточек — метод, применяемый информационными архитекторами для структурирования контента информационного приложения.

Данный метод помогает быстро и надежно спроектировать навигационное меню сайта.

Существует два метода сортировки карточек:

  1. Открытая сортировка, при которой участникам предлагается список карточек, где обозначены названия материала сайта. Участники сами создают группы и распределяют по ним карточки;
  2. Закрытая сортировка, при которой участникам предлагают уже готовый набор групп, в которые они должны распределить карточки.

Для выполнения исследований, связанных с методом сортировки карточек используется windows-приложение UXSort.

Таблица 1. Исходный вариант расположения меню
О нас
  • История;
  • Состав группы:
    Представительства
    Филиалы;
  • Стратегия развития;
  • Миссия;
  • Ценности;
  • Кодекс этики;
  • Карьера;
  • Реквизиты.
Акционерам и инвесторам
  • Акции;
  • Долговые инструменты;
  • Финансовые новости;
  • Финансовые результаты;
  • Раскрытие информации;
  • Корпоративное управление;
  • Информация для частных акционеров;
  • Инсайдерам банка;
  • Контакты для инвесторов.
Социальная ответственность
  • Противодействие коррупции;
  • Заинтересованные лица;
  • Приоритеты;
  • Отчеты;
  • Открытые данные;
  • Пресс-релизы;
  • Контакты для прессы.

Перечень карточек и пример сортировки

Перечень сортируемых карточек
Рисунок 1. Перечень сортируемых карточек
Пример сортировки карточек пользователем
Рисунок 2. Пример сортировки карточек пользователем

Метод открытой сортировки карточек

Таблица 2. Результаты сортировки карточек пользователями

Пользователь

Количество созданных групп

Количество карточек

Сергеев

5

25

Сливнова

5

25

Дацковская

6

25

Колеснёв

4

25

Силантьев

5

25

В результате кластерного анализа результатов открытой сортировки карточек получаем дендрограмму, приведенную на рис. 3

Дендрограмма открытой сортировки
Рисунок 3. Дендрограмма открытой сортировки

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

Определение порогового расстояния
Рисунок 4. Определение порогового расстояния

В результате проведения тестирования меню методом открытой сортировки можно представить следующий вариант меню (таблица 3).

Таблица 3. Вариант меню
О банке
  • История;
  • Подразделения
    Филиалы
    Представительства;
  • Миссия;
  • Карьера;
  • Заинтересованные лица;
  • Приоритеты;
  • Стратегия развития;
  • Реквизиты.
Социальная ответственность
  • Кодекс этики;
  • Ценности;
  • Раскрытие информации;
  • Противодействие коррупции.
Финансовые события
  • Финансовые новости;
  • Финансовые результаты.
Инвесторам
  • Долговые инструменты;
  • Контакты для инвесторов.
Акционерам
  • Акции;
  • Корпоративное управление;
  • Информация для частных акционеров;
  • Инсайдерам банка.
Пресс-центр
  • Открытые данные;
  • Пресс-релизы;
  • Отчеты;
  • Контакты для прессы.

Метод закрытой сортировки карточек

Таблица 4. Результаты сортировки карточек пользователями

Пользователь

Количество созданных групп

Количество карточек

Сергеев

5

25

Сливнова

5

25

Дацковская

5

25

Колеснёв

5

25

Силантьев

5

25

В результате кластерного анализа результатов закрытой сортировки карточек получаем дендрограмму, приведенную на рис. 6

Дендрограмма закрытой сортировки
Рисунок 5. Дендрограмма закрытой сортировки

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

Определение порогового расстояния
Рисунок 6. Определение порогового расстояния

В результате проведения тестирования меню методом закрытой сортировки можно представить следующий вариант меню (таблица 5).

Таблица 5. Вариант меню
О банке
  • История;
  • Приоритеты;
  • Ценности;
  • Миссия;
  • Стратегия развития;
  • Заинтересованные лица;
  • Карьера.
Подразделения
  • Представительства;
  • Филиалы.
Инвесторам
  • Долговые инструменты;
  • Инсайдерам банка;
  • Контакты для инвесторов.
Акционерам
  • Акции;
  • Информация для частных акционеров.
Пресс-центр
  • Пресс-релизы;
  • Контакты для прессы;
  • Отчеты;
  • Открытые данные.
Финансовые события
  • Финансовые новости;
  • Финансовые результаты.
Корпоративная этика
  • Кодекс этики;
  • Раскрытие информации.
Противодействие коррупцииКорпоративное управлениеРеквизиты

Читайте также

Список литературы

  1. Рыбанов А.А. Применение метода сортировки карточек при проектировании навигационного меню информационной системы // NovaInfo.Ru. 2016. Т. 2. № 40. С. 15-21.
  2. Сортировка карточек: полное описание метода [Электронный ресурс]. - Режим доступа: http://www.webmascon.com/topics/planning/19a.asp. Дата обращения: 20.12.2016
  3. Рыбанов А.А. Электронный ресурс ''Метрики оценки качества пользовательского интерфейса'' // Хроники объединенного фонда электронных ресурсов Наука и образование. 2016. № 6 (85). С. 26.
  4. Билялова В.М., Рыбанов А.А. Применение закона Фиттса к оценке навыков работы пользователей с компьютерными устройствами целеуказания // NovaInfo.Ru. 2015. Т. 2. № 32. С. 9-14.
  5. Rybanov A., Tretyakova V. Application of Fitts's law to the assessment of users' skills of work with computer devices of targeting // В сборнике: Pedagogical and psychological problems of the modern society: scientific approaches to the study and overcoming practices 2nd edition: research articles. Science editor: A. Burkov. San Francisco, California, USA, 2015. С. 39-47.
  6. Панкова Л.А., Рыбанов А.А. Исследование методов адаптации к обучаемому в современных компьютерных обучающих системах // Известия Волгоградского государственного технического университета. 2008. Т. 5. № 5 (43). С. 67-69.
  7. Рыбанов А.А., Усмонов М.С.О., Попов Ф.А., Ануфриева Н.Ю., Бубарева О.А. Информационные системы и технологии/Научный ред. И. А. Рудакова/Центр научной мысли (г. Таганрог). Москва, 2013. Том Часть 4. -90 с.

Цитировать

Хрущев, Д.Г. Разработка навигационного меню веб-приложения банка с использованием метода сортировки карточек / Д.Г. Хрущев, А.А. Рыбанов. — Текст : электронный // NovaInfo, 2016. — № 57. — С. 60-69. — URL: https://novainfo.ru/article/10036 (дата обращения: 05.10.2022).

Поделиться