Файл: Курсовая работа по дисциплине Разработка интерфейса цифрового продукта по теме Создание интерфейса сайта организации по аренде прогулочных велосипедов.docx
Добавлен: 26.10.2023
Просмотров: 293
Скачиваний: 16
ВНИМАНИЕ! Если данный файл нарушает Ваши авторские права, то обязательно сообщите нам.
САНКТ-ПЕТЕРБУРГСКИЙ ГОСУДАРСТВЕННЫЙ
УНИВЕРСИТЕТ ТЕЛЕКОММУНИКАЦИЙ им. проф. М.А. Бонч-Бруевича
ФАКУЛЬТЕТ ВЕЧЕРНЕГО И ЗАОЧНОГО ОБУЧЕНИЯ
КУРСОВАЯ РАБОТА
по дисциплине: «Разработка интерфейса цифрового продукта»
по теме:
«Создание интерфейса сайта организации по аренде прогулочных велосипедов»
Фамилия: Коровина
Имя: Ирина
Отчество: Александровна
Курс: 2
Студ. билет №: 2010331
Группа №: Пб-02з
Дата сдачи работы: 30.04.2022
Санкт-Петербург
2022
Содержание
Введение ……………………………………………………………………….. 3
Глава 1. Исследование современных направлений развития в области разработки интерфейса цифрового продукта ……………………………..…. 4
Глава 2. Исследование предметной области ………..………………………... 5
Глава 3. Сравнительный анализ существующих интерфейсов сайтов организаций по аренде прогулочных велосипедов …………...……….……....5
3.1. Анализ интерфейса сайта Мой Велик …………………………….…….... 6
3.2. Анализ интерфейса сайта ВелоДрайв …………………………...….……. 7
3.3. Вывод по сравнительному анализу интерфейсов………...…….………... 9
Глава 4. Критерии эффективного интерфейса ………………………….…..... 9
Глава 5. Концептуальное проектирование пользовательского интерфейса...12
Глава 6. Макетирование общей структуры взаимодействия …………….…. 14
Глава 7. Представление визуального решения …………………………….... 15
Глава 8. Оценка проектного решения ……………………………………...… 17
Заключение …………………………………………………….……………..… 19
Список литературы …………………………………………….………………. 20
Приложение …………………………………………………….………………. 21
Введение
В настоящее время интернет получает широкое распространение. Веб-интерфейсы стали современным средством труда, и проблема построения удобных интерфейсов как никогда актуальна. Люди воздействуют посредством веб-интерфейсов на предметы труда, видоизменяя их исходя из своих потребностей. Качество и скорость работы прямо пропорциональны степени совершенства веб-интерфейсов. В связи с этим актуальной является задача создавать качественные решения для построения сайтов, которые должны быть ориентированы на пользователей. Каждый позитивный опыт общения с программой позволяет пользователю расширять область знакомства с программным обеспечением и повышать свой уровень компетентности. Хорошо продуманный пользовательский интерфейс обеспечивает плодотворное взаимодействие пользователя и компьютера.
Данная курсовая работа ведет к рассмотрению современных направлений развития в области разработки интерфейса цифрового продукта и критериев эффективного интерфейса. Цель данной курсовой работы является получение навыков самостоятельной разработки интерфейсов цифрового продукта в соответствии с типовой технологией проектирования и с учетом принципов создания дружественных интерфейсов. Создание интерфейса сайта будет проходит для организации по аренде прогулочных велосипедов.
Глава 1. Исследование современных направлений развития в области разработки интерфейса цифрового продукта
Современные направления развития в области разработки интерфейа цифрового продукта:
1) Общение с искусственным интеллектом как с человеком
Пять лет назад со стороны выглядело странно, что человек разговаривает с телефоном в публичном месте, но сегодня это уже норма. Мы общаемся с интерфейсом как с человеком, и это общение human-like — перспективное направление для развития ИИ.
Разработчики продолжают совершенствовать систему рекомендаций для пользователей с помощью машинного обучения: умные ленты, музыкальные подборки, рекомендации друзей и подписок. Использование технологий machine learning позволяет выявлять скрытые связи намного лучше простых алгоритмов. Искусственный интеллект уже присутствует во всех серьезных приложениях, но его потенциал раскрыт далеко не полностью.
2) Приближение эры AR
Дополненную реальность (augmented reality)записали в тренды еще в 2020 году, но на самом деле до полноценного использования этой технологии достаточно далеко. Например, с помощью AR пользователи примеряют предметы интерьера или одежды, но модели недостаточно хорошо отрисованы. Дело в том, что создание дополненной реальности — слишком ресурсоемкая задача, и пока разработчикам приходится адаптировать технологию под среднестатистические устройства, вместо того чтобы создавать новые сценарии применения AR.
3) Минимализм в анимации как забота о пользователе
Ненавязчивые элементы анимации лучше взаимодействуют с пользователем, чем масштабные. Динамичная кнопка в интерфейсе, анимация ее нажатия помогают привлечь или сфокусировать внимание пользователя. Такой анимационный минимализм работает на большинстве устройств, не пугает пользователя и не раздражает его.
Глава 2. Исследование предметной области
Нам предстоит создать интерфейс для организации, предоставляющей в аренду прогулочные велосипеды. Для аренды клиенту необходимо зайти на сайт и оставить заявку, в которой нужно указать свои данные и удобный способ связи, после чего с ним свяжется менеджер и, учитывая его потребности, подберёт велосипед и способ получения. Велосипед можно забрать самому, приехав в пункт выдачи, или заказать бесплатную доставку в любое удобное время и место. Компания работает без залога, что является их преимуществом.
Оплату можно произвести либо на сайте, либо непосредственно в пункте выдачи. Велосипед дают в аренду от 1 месяца, если клиент арендует велосипед на 3 месяца и более, то ежемесячный платеж будет меньше. В случаи поломки, велосипед забирают и ремонтируют, либо дают новый. Когда велосипед будет уже не нужен, его также бесплатно заберут.
Глава 3. Сравнительный анализ существующих интерфейсов сайтов организаций по аренде прогулочных велосипедов
Проведем сравнительный анализ интерфейсов двух сайтов по аренде прогулочных велосипедов на примере организаций Мой Велик и ВелоДрайв.
3.1. Анализ интерфейса сайта Мой Велик
На главной странице сайта крупным планом изображена фотография людей, которые едут на велосипедах и демонстрируют свою радость от велопрогулки. После мы обращаем внимание на текст, в котором сразу видно лучшее предложение организации: «Аренда велосипедов от 3600р в месяц». Эта информация удерживает пользователя. Немного ниже надпись про бесплатную доставку до двери и отсутствие залога при прокате. Эта информация сразу подогревает интерес пользователя. И после уже расположена кнопка, выделенная контрастным желтым цветом, которая призывает нас к действию, в данном случаи это кнопка «Получить велосипед». (см. Приложение №1)
Далее спускаясь по сайту, мы можем изучить информацию об условия предоставления, преимуществах данной компании, представленных моделях велосипедов и дополнительную информацию. Все оформлено очень стильно, аккуратно и лаконично. (см. Приложение №2)
Очень удобно что сразу можно смотреть модели велосипедов, их характеристики и стоимость в одной, так называемой карточке, и сразу после выбора мы можем «Выбрать девайс», что тоже очень удобно. (см. Приложение №3)
В меню мы видим разделы: о сервисе, преимущества, наши велики, вопрос-ответ и контакты. Нет отдельно выделенного раздела со стоимостью или тарифами, пользователь не сразу может понять, что это прописывается в разделе с моделями велосипедов. И эти поиски цены могут отнять немного времени пользователя. (см. Приложение №4)
Цветовая палитра. На сайте преобладают черный, желтый и белый цвета. Все цвета будто стараются контрастировать между собой; черный с белым, желтый с черным и белый с черным.
Черный цвет в интерфейсе может выражать силу, изысканность и элегантность, так как он хорошо реализован на данном сайте. В данном интерфейсе
светлый контент в тёмном окружении привлекает к себе внимание — это помогает пользователю сфокусироваться на задачах, которые он хочет решить. Также воспринимать текст на тёмном фоне гораздо комфортнее для глаз, что может способствовать большему прибыванию пользователя на сайте.
Желтый — это один из первичных цветов, самый светлый из цветов спектра и довольно яркий. Поэтому он ассоциируется с живостью, оптимизмом, светом, проникающей мыслью, радостью, общением, что очень подходит для описания деятельности этого сайта.
Белый цвет немного разбавляет два этих контрастирующих цвета, вносит определенную чистоту и эстетичность.
Вывод: все элементы в совокупности держат пользователя на сайте и помогают ориентироваться без траты лишнего времени на поиски нужной информации.
3.2. Анализ интерфейса сайта ВелоДрайв
Главная страница выполнена в спокойных голубых и белых цветах, основные элементы выделены желтым цветом. Крупным планом изображен прогулочный велосипед насыщенного голубого цвета, символизируя сферу деятельности компании, и на заднем фоне лавочку такого же цвета. На главной странице только информация о прокате в период с 1 апреля до 30 сентября и выделяющаяся кнопка "Найти ближайший центр проката", кликая по которой мы переходим к списку центров проката с фотографиями, адресами, номерами телефона и графиками работы. (см. Приложение №5)
Двигаясь ниже, мы видим, какие велосипеды предоставляют в прокат по категориям (стандартные, горные, складные, комфорт-класса) и описаны преимущества каждого. Еще ниже описаны рекомендации данной компании. (см. Приложение №6)
Постепенно мы подходим к тарифам проката. Тарифы оформлены не очень удобно для пользователя в таблицу, в которой приходится искать нужный для себя вариант, тратя время. Лучше было бы предложить пользователю меньший выбор тарифов, тем самым ускорить его выбор. (см. Приложение №7)
Цветовая палитра. На сайте преобладают голубой, белый и желтый цвета.
Желтый цвет является ярким, стимулирующим цветом, он увеличивает концентрацию, организует, способствует быстрому принятию решений. Желтый — энергичный, без агрессии, цвет оптимизма, открытости, подвижности и общительности. Настраивает на коммуникабельность. Желтым цветом в данном интерфейсе выделяют только важную информацию и кнопки с призывами к действию, его не так много.
Голубой цвет - это комфортный цвет, вызывающий ощущение благополучия, безопасности, доверия. Голубой цвет не такой холодный, как синий, поэтому находясь в одной гамме, он более комфортный, свежесть и прохлада голубого совсем другая нежели морозность синего. Голубой цвет - основной цвет в интерфейсе, мы видим его начиная с главной страницы и на протяжении всего сайта.
Белый — цвет спокойствия, чистоты и безмятежности. Белый цвет характеризуется совершенством и завершенностью, демонстрирует абсолютное и окончательное решение, полная свобода для возможностей и снятие препятствий. Его ключевые значения: свет, покой, сосредоточенность. Он используется в качестве фона, все цвета на нем выглядят сочно и ярко.
Вывод: на главной странице не так много информации, можно было бы добавить свои уникальные предложения или главные преимущества, чтобы точно привлечь пользователя к действию дальнейшего выбора. Тарифы оформлены в сложную таблицу с большим выбором вариантов, в которой приходиться искать нужный для себя вариант. Сайт выполнен в спокойных тонах, нет однозначного ощущения получения тех ярких эмоций, которые пользователь ждёт от велопрогулки.
3.3. Вывод по сравнительному анализу интерфейсов
На главной странице сайта «МойВелик» фотография людей, которые показывают свою радость и удовольствие при велопрогулке, в данном случаи пользователь видеть смысл во взятии в прокат велосипеда, он тоже хочет испытать такие же эмоции. На сайте ВелоДрайв на главной странице изображен велосипед, пользователь не видит в нём получения новых эмоций и радости, не смотря на яркие цветовые акценты. К тому же весь сайт оформлен в спокойных пастельных тонах, что особо не вызывает интерес. На сайте «МойВелик» модели и стоимость очень удобно оформлены, можно сразу выбирать из подходящей для пользователя стоимости, модели и характеристик велосипеда. В то время как на сайте ВелоДрайв тарифы оформлены в неудобную большую таблицы, в которой приходиться искать подходящий для себя вариант. От многообразия выбора и непредсказуемости его результата зависит количество времени и сил, которые требуются человеку на принятие решений. И, если эта сложность выше собственной мотивации пользователя, выбор совсем не будет сделан.
Сайт организации по предоставлению велосипедов в аренду должен показывать пользователям прежде всего своей цветовой палитрой тот спектр эмоций, которые они хотят получить. В совокупности с правильно преподнесённой информацией, расположенной удобно для пользователя, мы можем получить довольно эффективный интерфейс для сайта.