Интерактивная
электронная
книга
электронная
книга
2025-2026
Создала с нуля веб-приложение
для чтения и работы с текстом. Занималась UI/UX-дизайном, фронтенд-разработкой и бэкенд-разработкой.
для чтения и работы с текстом. Занималась UI/UX-дизайном, фронтенд-разработкой и бэкенд-разработкой.
ЗАДАЧА
Создать веб-сервис для чтения, который объединит эстетику печатных книг и возможности современного веба.
ДИЗАЙН-СИСТЕМА
Для визуального стиля интерактивной электронной книги я выбрала спокойную пастельную цветовую гамму, которая не будет напрягать глаза пользователя даже при длительном чтении. Также я использовала текстуры бумаги и ткани для создания ощущения осязаемости и поддержания эстетики печатной книги. В качестве шрифтовой пары я выбрала Hauora
и Gogol. Гротеск Hauora используется как основной шрифт веб-приложения, он простой и хорошо подходит для цифрового чтения. Шрифт Gogol, имитирующий ручное письмо, я использовала как акцентный, он гармонично вписывается в книжную эстетику.
и Gogol. Гротеск Hauora используется как основной шрифт веб-приложения, он простой и хорошо подходит для цифрового чтения. Шрифт Gogol, имитирующий ручное письмо, я использовала как акцентный, он гармонично вписывается в книжную эстетику.
ПРОЕКТИРОВАНИЕ ИНТЕРФЕЙСА
В FIGMA
В FIGMA
Проектирование интерфейса было выполнено по восьмиколоночной сетке. Учитывая направленность проекта, мне важно было составить чистую и строгую структуру, которая не будет отвлекать пользователя от чтения, но при этом все инструменты будут на виду.
ПРОБЛЕМА
Большинство современных платформ для чтения — это статичные текстовые страницы часто с устаревшим дизайном. Пользователю не хватает современного сервиса с эстетичным дизайном и интерактивными инструментами для работы с произведениями.
ФОРМАТ
Выпускная квалификационная работа на направлении "Информационные технологии в дизайне"
ЛИЧНЫЙ КАБИНЕТ
Пользователь может самостоятельно добавить нужное ему произведение, которое будет отображено в общей бибилотеке.
Пользователь может самостоятельно добавить нужное ему произведение, которое будет отображено в общей бибилотеке.
БИБЛИОТЕКА
В этом разделе представлены все книги, доступные для чтения: произведения из встроенной коллекции и произведения, добавленные пользователями.
В этом разделе представлены все книги, доступные для чтения: произведения из встроенной коллекции и произведения, добавленные пользователями.
ГЛАВНАЯ СТРАНИЦА
Здесь расположены кнопки для перехода в другие разделы веб-приложения, информация о проекте, а также интерактивный элемент - аккордеон из книг.
Здесь расположены кнопки для перехода в другие разделы веб-приложения, информация о проекте, а также интерактивный элемент - аккордеон из книг.
Интерфейс веб-приложения адаптивный, он корректно отображаетя на устройствах разных размеров.
РЕЗУЛЬТАТЫ
Я прошла полный путь создания веб-приложения с нуля — от создания концепции до запуска в сети. Это было отличная практика на стыке UI/UX-дизайна и разработки
Приложение успешно прошло функциональное и пользовательское тестирование, получив хорошие оценки за эстетику и удобство. Я защитила проект в качестве дипломной работы и получила высший балл комиссии:)
Приложение успешно прошло функциональное и пользовательское тестирование, получив хорошие оценки за эстетику и удобство. Я защитила проект в качестве дипломной работы и получила высший балл комиссии:)
РЕАЛИЗАЦИЯ
Дизайн-концепция была реализована как полноценное работающее SPA-приложение. Фронтенд написан на React.js, а серверная часть и база данных построены на ASP.NET Core
и PostgreSQL. В процессе написания кода активно применялись AI-инструменты.
и PostgreSQL. В процессе написания кода активно применялись AI-инструменты.
МОДУЛЬ ДЛЯ ЧТЕНИЯ
Пользователь может читать произведения, выделять важные фрагменты, добавлять к ним заметки, к которым можно будет вернуться позже с помощью сайдбара.
Пользователь может читать произведения, выделять важные фрагменты, добавлять к ним заметки, к которым можно будет вернуться позже с помощью сайдбара.
