В этом разделе объясняется, почему тема разработки интернет-магазина подходит для учебного проекта и какие стороны веб-приложения будут рассмотрены. Здесь формулируются проблема, цель и задачи, обозначаются границы прототипа и ожидаемый результат. Также указывается, каким способом будет проверяться работоспособность продукта и для кого он предназначен.

Раздел раскрывает понятие интернет-магазина и описывает его отличие от сайта-визитки или простого каталога. Рассматриваются основные действия покупателя: просмотр ассортимента, выбор позиции, помещение её в корзину и оформление заказа. Это описание помогает определить, какие функции необходимо включить в учебный прототип, а какие можно оставить за пределами проекта.

В пункте перечисляются основные элементы интерфейса: главная страница, каталог, карточка товара, корзина и форма оформления заказа. Для каждого элемента поясняется его назначение и связь с действиями пользователя. Теоретическая часть нужна, чтобы до начала разработки определить состав страниц и не создавать функции, которые не соответствуют выбранному сценарию покупки.

Здесь описываются технологии, применяемые для создания учебной версии: HTML для структуры страницы, CSS для оформления и JavaScript для взаимодействия с пользователем. Отдельно поясняется различие между клиентской частью, сервером и хранилищем данных. Такое сравнение позволяет обоснованно выбрать инструменты и обозначить технические ограничения демонстрационного прототипа.

Раздел посвящён понятности интерфейса, читаемости текста, заметности кнопок и корректному отображению страниц на разных экранах. Также рассматривается бережное обращение с данными: в учебной демонстрации не следует собирать настоящие сведения о покупателях. Эти требования задают критерии, по которым можно оценить удобство и допустимые границы функциональности прототипа.

В практической части сначала составляется схема страниц и переходов между ними, затем описывается путь пользователя от выбора товара до просмотра корзины. Уточняются поля карточки товара, состав каталога и правила подсчёта стоимости. Результатом этапа становится план интерфейса, по которому удобно создавать прототип и проверять, что необходимые действия доступны пользователю.

В этом пункте описывается разработка каталога с тестовыми позициями и карточек, содержащих название, изображение, цену и краткое описание. Рассматриваются единый стиль элементов и расположение кнопки добавления товара в корзину. Созданные страницы формируют основную часть прототипа и позволяют проверить, насколько легко пользователь находит нужную информацию.

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

В заключении сопоставляются поставленные задачи и фактически полученный продукт: созданные страницы, доступные действия и результаты проверок. Указываются ограничения учебной версии, например отсутствие настоящей оплаты, сервера или хранения заказов. Также можно обозначить возможные направления развития — добавление поиска, фильтров, серверной части и безопасного оформления заказа.

В список включаются использованные учебные и справочные источники по HTML, CSS, JavaScript, проектированию интерфейсов и обработке персональных данных. Для электронных материалов указываются название ресурса, автор или организация, адрес страницы и дата обращения. Перечень позволяет проверить фактические сведения и отличить собственные решения проекта от информации, взятой из источников.