Проектный семинар «Разработка web интерфейсов»

Бакалавриат 2025/2026

Статус: Курс по выбору (Дизайн и разработка информационных продуктов)

Кто читает: Базовая кафедра Т-Банка

Где читается: Факультет компьютерных наук

Когда читается: 2-й курс, 1-4 модуль

Охват аудитории: для своего кампуса

Преподаватели: Денисов Владимир Андреевич

Язык: русский

Контактные часы: 68

Дополнительные материалы в LMS Задать вопрос

Аннотация

Курс посвящен проектированию и разработке современных web-интерфейсов. Студенты осваивают архитектурное мышление, принципы интерфейсной разработки и работу с инструментами, фреймворками и API. Обучение построено на практике: каждый семинар - отдельный навык, каждая тема - вклад в развитие проектного продукта. Фокус курса - не только код, но и структура, масштабируемость, производительность и пользовательский опыт.

Цель освоения дисциплины

проектировать архитектуру интерфейса
реализовывать адаптивный и интерактивный UI
применять типизацию и организовывать кодовую базу
работать с формами, API и состоянием
использовать инструменты тестирования и автоматизации
управлять сборкой и деплоем проекта

Планируемые результаты обучения

системное мышление в проектировании пользовательских интерфейсов
уверенная работа с визуальной структурой, адаптивностью и UX
создание интерактивного поведения и форм с акцентом на пользователя
архитектурное разделение кода: компоненты, логика, состояние, API
инженерная точность: читаемость, качество, тесты и подготовка к росту
современная верстка: HTML, семантика, CSS layout, переменные
JavaScript и TypeScript: поведение, типы, структуры, модули
работа с локальным состоянием, браузерными хранилищами и заглушками
dev-инструменты: отладка, анализ, профилирование, консоль
сборка проекта и публикация: базовые пайплайны, деплой, автоматизация

Содержание учебной дисциплины

Проектирование интерфейсов: мышление через архитектуру
HTML и структура страницы: от идеи до каркаса
CSS и layout: современная верстка без боли
Компонентное мышление: интерфейс как конструктор
JS в интерфейсе: взаимодействие и динамика
Формы и взаимодействие с пользователем
TypeScript для интерфейсной архитектуры
Работа с данными: имитация API и UI-реакции
Локальное состояние: как не сломаться без Redux
Кодстайл, чистота и поддержка: линтеры и оформление
Тестирование интерфейсов: минимум, который должен быть
Сборка проекта и подготовка к публикации
DevTools и инженерная отладка интерфейсов
SEO и доступность: когда интерфейс встречает реальный мир
Переход на фреймворк: почему Angular, а не React/Vue?
Компоненты и шаблоны: как Angular строит интерфейс
Формы и UX: быстрые реакции и валидные данные
Routing и ленивые модули: интерфейс как навигация
Сервисы и DI: как выделять логику из UI
Моковый сервер: как не ждать бэкенд
HTTP и состояния: получаем данные, не убивая UX
RxJS в Angular: потоки, подписки и чистый код
Signals, computed и local state: новая реактивность Angular
Авторизация: токены, сессии, состояние доступа
Interceptors: все под контролем (запросы и ошибки)
Guards: защищаем страницы, не костылим if-ы
Redux-подход: как хранить состояние по-взрослому
Юнит-тесты: как тестировать компоненты и бизнес-логику
E2E: как протестировать продукт целиком, как пользователь
Сборка и деплой: выкатываем продукт в мир
DevTools и метрики: где тормозит и почему
Архитектура больших интерфейсов: как не сломаться
Компонентная система: дизайн как код
Интернационализация и доступность: финальный штрих зрелост

Элементы контроля

Семинарное тестирование (ТЕСТ)
Польза: позволяет лучше отслеживать прогресс обучения студенту: -развитие навыков быстрого включения в тему -мотивации фиксировать ключевые идеи из материала -осознание пробелов в своих знаниях преподавателю -оценка среднего уровня знаний у группы -сигнал для повторения каких-то темы для группы -доп.инструмент мотивации и контроля знаний
Домашние задания (ДЗ)
ДЗ после каждого семинара (14 в 1ом семестре и 20 во 2ом семестре) Каждое ДЗ - pull-request в форкнутый подготовленный репозиторий Каждое ДЗ оформляется и проверяется через GitHub.
Контрольная работа (КР)
Семестровый проект (ПР)
Формат: Итоговое индивидуальное задание по материалам всего семестра. Студент реализует приложение на основе знаний за семестр.. Требования: архитектура, интерфейс, качество.
Финальный экзамен (ЭКЗ)
Формат: Индивидуальная тема проекта (по выбору преподавателя): проектирование интерфейса по заданию; декомпозиция архитектуры; обсуждение проектных решений. Устная или письменная форма, в аудитории или онлайн. Цель: Проверка глубины понимания, умения рассуждать, проектировать архитектуру ux/приложения, понимания ключевых тех.моментов Не выдаётся заранее, чтобы исключить списывание.

Промежуточная аттестация

2025/2026 4th module
Итоговая оценка = 0.1 × ТЕСТ + 0.3 × ДЗ + 0.2 × КР + 0.2 × ПР+ 0.2 × ЭКЗ Каждая переменная в формуле оценки это средняя оценка подобных активностей за семестр (т.е. например ДЗ в формуле это средний балл по ДЗ)

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

Авторы

Солдатова Татьяна Владимировна

Программа дисциплины