Details

Title: Дизайн-концепция мобильного приложения для российского метрополитена: выпускная квалификационная работа бакалавра: направление 54.03.01 «Дизайн» ; образовательная программа 54.03.01_03 «Информационный дизайн»
Creators: Шевелева Анастасия Вячеславовна
Scientific adviser: Кокорин Михаил Станиславович
Other creators: Маркова Татьяна Владимировна
Organization: Санкт-Петербургский политехнический университет Петра Великого. Инженерно-строительный институт
Imprint: Санкт-Петербург, 2022
Collection: Выпускные квалификационные работы; Общая коллекция
Subjects: мобильное приложение; интерфейс; ux дизайн; анализ аудитории; проектирование; прототипирование; транспортная система; метрополитен; mobile app; interface; ux design; analysis of the audience; designing; prototyping; transport system; underground
Document type: Bachelor graduation qualification work
File type: PDF
Language: Russian
Level of education: Bachelor
Speciality code (FGOS): 54.03.01
Speciality group (FGOS): 540000 - Изобразительное и прикладные виды искусств
Links: Отзыв руководителя; Рецензия; Отчет о проверке на объем и корректность внешних заимствований
DOI: 10.18720/SPBPU/3/2022/vr/vr22-100
Rights: Доступ по паролю из сети Интернет (чтение, печать, копирование)
Record key: ru\spstu\vkr\16176

Allowed Actions:

Action 'Read' will be available if you login or access site from another network Action 'Download' will be available if you login or access site from another network

Group: Anonymous

Network: Internet

Annotation

В данной работе описана разработка дизайн-концепции мобильного приложения для метрополитенов России. В процессе работы был проведён предметный обзор рынка мобильных приложений, мобильных операционных систем и дизайн-инструментов. Проведено исследование ближайших аналогов мобильных приложений, целевой аудитории и методик UX-дизайна. Описан процесс проектирования дизайна мобильного приложения: разработка информационной архитектуры, wireframe-экранов, графической концепции приложения и его итогового прототипа.

This work describes the process of designing a concept of a mobile app for Russian underground system. This paper includes a review of mobile app market, mobile operating systems and design-tools. The paper also provides research of the closest app analogues, target audience and UX-design methods. As the result, design process is described, which includes designing the information architecture, wireframes, graphic concept of the app and the final prototype.

Document access rights

Network User group Action
ILC SPbPU Local Network All Read Print Download
External organizations N2 All Read
External organizations N1 All
Internet Authorized users SPbPU Read Print Download
Internet Authorized users (not from SPbPU, N2) Read
Internet Authorized users (not from SPbPU, N1)
-> Internet Anonymous

Table of Contents

  • Содержание
  • Введение
  • Глава 1. Обзор предметной области
    • 1.1. Развитие рынка мобильных приложений
    • 1.2. Распространенность мобильных приложений в системе транспорта
    • 1.3. Развитие разработки мобильных приложений для госсектора
    • 1.4. Мобильные операционные системы
      • 1.4.1. Операционная система Android
      • 1.4.2. Операционная система iOS
    • 1.5. Инструменты дизайн-проектирования
      • 1.5.1. PureRef
      • 1.5.2. Adode Illustrator
      • 1.5.3. XMind
      • 1.5.4. Figma
      • 1.5.5. Sketch
    • Выводы по главе 1
  • Глава 2. Предпроектное исследование
    • 2.1. Целевая аудитория проектируемого приложения
      • 2.1.1. Местные жители мегаполисов
      • 2.1.2. Туристы
    • 2.2. Сравнительный анализ приложений
      • 2.2.1. Приложение «Метро Москвы»
        • Рис. 2.1. Метро Москвы. Разделы навигации, личного кабинета и новостей
        • Рис. 2.2. Метро Москвы. Иконка приложения
      • 2.2.2. Приложение «Яндекс.Метро»
        • Рис. 2.3. Яндекс.Метро. Разделы навигации, настроек и выбора города
        • Рис. 2.4. Яндекс Метро. Экран загрузки приложения
      • 2.2.3. Приложение «MetroMan China»
        • Рис. 2.5. MetroMan China. Экраны схемы, маршрута и станции
        • Рис. 2.6. MetroMan China. Иконка приложения
      • 2.2.4. Приложения «TfL Oyster» и «TfL Go»
        • Рис. 2.7. TfL Oyster. Экраны карты, истории проезда, оплаты и транспортных схем
        • Рис. 2.8. TfL Go. Экраны карты, «step free» станций и прокладки маршрутов
        • Рис. 2.9. Иконки приложений «TfL Oyster», «TfL Go» и их значения
      • 2.2.5. Приложение «SL»
        • Рис. 2.10. SL. Экраны карты, обозначений транспорта и билетов
        • Рис. 2.11. SL. Иконка приложения
    • 2.3. Функциональные свойства проектируемого приложения
    • 2.4. Методики UX-дизайна
    • Выводы по главе 2
  • Глава 3. Разработка дизайна мобильного приложения
    • 3.1. Информационная архитектура приложения
      • Рис. 3.1. Схема приложения. Раздел «Схема метро»
      • Рис.3.2. Схема приложения. Раздел «Тарифы»
      • Рис. 3.3. Схема приложения. Раздел «Кошелёк», функции: профиль, новости, город
    • 3.2. Разработка wireframe-экранов
      • Рис. 3.4. Пример нескольких wireframe-экранов из раздела «Кошелёк»
      • Рис. 3.5. Wireframe-экраны, расположение заголовков
      • Рис. 3.6. Wireframe-экраны, раздел «Схема»
    • 3.3. Разработка графической концепции приложения
      • 3.3.1. Цветовое решение
        • Рис. 3.7. Фирменные цвета
        • Рис. 3.8. Отображение цветов при дальтонизме, блокирующим красно-зеленый спектр
      • 3.3.2. Логотип приложения
        • Рис. 3.9. Логотипы метрополитенов России
        • Рис. 3.10. Фрагменты карт части метрополитенов России
        • Рис. 3.11. Корректировка «М», полупрозрачным черным окрашен итоговый результат
        • Рис. 3.12. Итоговый вариант логотипа
      • 3.3.3. Иконки приложения
      • 3.3.4. Шрифты
        • Рис. 3.14. Начертания шрифта «Inter»
        • Рис. 3.15. Начертания шрифта «Commissioner»
    • 3.4. Разработка прототипа приложения
      • Рис. 3.16. Реализация главных экранов приложения
      • Рис. 3.17. Главные экраны разделов, симуляция протанопии
      • Рис.3.18. Главные экраны разделов, симуляция дейтеранопии
    • Выводы по главе 3
  • Заключение
  • Список использованных источников
  • Приложение 1. Сравнение аналогов
  • Приложение 2. Схемы структуры приложения
    • Рис. П2.1. Схема приложения. Раздел «Кошелёк», функция добавления карты
    • Рис. П2.2. Схема приложения. Раздел «Кошелёк», функция добавления карты в Apple Wallet
    • Рис. П2.3. Схема приложения. Раздел «Кошелёк», функция оплаты основной карты
    • Рис. П2.4. Схема приложения. Раздел «Кошелёк», функции блокировки и истории проезда основной карты
    • Рис. П2.5. Схема приложения. Раздел «Кошелёк», работа с картами, функции добавления карты в Apple Wallet и оплаты
    • Рис. П2.6. Схема приложения. Раздел «Кошелёк», функции блокировки и истории проезда карты из всех доступных карт
  • Приложение 3. Wireframe-экраны приложения
    • Рис. П3.1. Часть разработанных wireframe-экранов
  • Приложение 4. Итоговые экраны приложения
    • Рис. П4.1. Основные экраны раздела «Схема»
    • Рис. П4.2. Основные экраны раздела «Тарифы»
    • Рис. П4.3. Основные экраны раздела «Кошелёк»
    • Рис. П4.4. Схема связей прототипа

Usage statistics

stat Access count: 11
Last 30 days: 1
Detailed usage statistics