Санкт- Петербургское государственное бюджетное

профессиональное образовательное учреждение

"Политехнический колледж городского хозяйства"

Проектирование и разработка интерфейсов пользователя

предварительная программа дисциплины

Специальность

09.02.07 Информационные системы и программирование

Правительство Санкт-Петербурга

Комитет по науке и высшей школе

Приложение

к ОП СПО  по специальности

09.02.07 Информационные системы и программирование

, утвержденной приказом от

09.12.2016 г. №1547-ОД

часов на контроль

24

самостоятельная работа

0

контактная работа

144

в том числе:

Часов по учебному плану

168

Общая трудоемкость

168 часов

Форма обучения

очная

Квалификация

Разработчик веб и мультимедийных приложений

Виды контроля  в семестрах:

экзамен 5,6

Распределение часов  дисциплины по семестрам

Семестр

5

6

Итого

Вид занятий

УП

РП

УП

РП

УП

РП

Лекции

48

48

24

24

72

72

Практические

48

48

24

24

72

72

Контактная работа

96

96

48

48

144

144

Сам. работа

Часы на контроль

12

12

12

12

24

24

Итого

108

108

60

60

168

168

Разработчик(и): рабочая группа

Организация-разработчик:

Санкт-Петербургское государственное бюджетное профессиональное образовательное учреждение «Политехнический колледж городского хозяйства».

Преподаватель Ильюшенков Леонид Владимирович

Рабочая программа дисциплины

Проектирование и разработка интерфейсов пользователя

разработана в соответствии с ФГОС СПО:

Федеральный государственный образовательный стандарт среднего профессионального образования по специальности 09.02.07 ИНФОРМАЦИОННЫЕ СИСТЕМЫ И ПРОГРАММИРОВАНИЕ (приказ Минобрнауки России от 09.12.2016 г. № 1547)

составлена на основании учебного плана:

по специальности Информационные системы и программирование

1. ЦЕЛИ ОСВОЕНИЯ ДИСЦИПЛИНЫ

В результате изучения профессионального модуля студент должен освоить основной вид деятельности Разработка дизайна веб-приложений .

2. МЕСТО ДИСЦИПЛИНЫ В СТРУКТУРЕ ОБРАЗОВАТЕЛЬНОЙ ПРОГРАММЫ

Цикл (раздел) ОП:

ПЦ

Требования к предварительной подготовке обучающегося:

2.1

Русский язык

2.1.1

Литература

2.1.2

Математика

2.1.3

Дискретная математика с элементами математической логики

2.1.4

Операционные системы и среды

2.1.5

Информационные технологии

2.1.6

Основы алгоритмизации и программирования

2.1.7

Компьютерные сети

2.1.8

Дисциплины (модули) и практики, для которых освоение данной дисциплины необходимо как предшествующее:

2.2

Оптимизация веб-приложений

2.2.1

Обеспечение безопасности веб-приложений

2.2.2

Учебная практика

2.2.3

Проектирование и разработка веб-приложений (КПР 30)

2.2.4

3. ПЛАНИРУЕМЫЕ РЕЗУЛЬТАТЫ ОСВОЕНИЯ ДИСЦИПЛИНЫ

ОК 01.: Выбирать способы решения задач профессиональной деятельности применительно к различным контекстам

ОК 02.: Использовать современные средства поиска, анализа и интерпретации информации и информационные технологии для выполнения задач профессиональной деятельности

ОК 03.: Планировать и реализовывать собственное профессиональное и личностное развитие, предпринимательскую деятельность в профессиональной сфере, использовать знания по финансовой грамотности в различных жизненных ситуациях

ОК 04.: Эффективно взаимодействовать и работать в коллективе и команде

ОК 05.: Осуществлять устную и письменную коммуникацию на государственном языке Российской Федерации с учетом особенностей социального и культурного контекста

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

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

ОК 08.: Использовать средства физической культуры для сохранения и укрепления здоровья в процессе профессиональной деятельности и поддержания необходимого уровня физической подготовленности

ОК 09.: Пользоваться профессиональной документацией на государственном и иностранном языках

ПК 8.1.: Разрабатывать дизайн-концепции веб-приложений в соответствии с корпоративным стилем заказчика

ПК 8.2.: Формировать требования к дизайну веб-приложений на основе анализа предметной области и целевой аудитории

ПК 8.3.: Осуществлять разработку дизайна веб-приложения с учетом современных тенденций в области веб-разработки

В результате освоения дисциплины обучающийся должен:

3.1

Знать:

3.1.1

нормы и правила выбора стилистических решений; современные методики разработки графического интерфейса; требования и нормы подготовки и использования изображений в информационно-телекоммуникационной сети "Интернет" (далее - сеть Интернет); государственные стандарты и требования к разработке дизайна веб-приложений

3.2

Уметь:

3.2.1

создавать, использовать и оптимизировать изображения для веб-приложений; выбирать наиболее подходящее для целевого рынка дизайнерское решение; создавать дизайн с применением промежуточных эскизов, требований к эргономике и технической эстетике; разрабатывать интерфейс пользователя для веб-приложений с использованием современных стандартов

4. ТЕМАТИЧЕСКОЕ ПЛАНИРОВАНИЕ ДИСЦИПЛИНЫ

Код занятия

Наименование разделов и тем /вид занятия/

Семестр / Курс

Часов

Компетен-

ции

Литература

Примечание

Раздел 1. HTML

1. 1

Стандарты Веб разработки, деятельность W3C/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 2

Валидация кода/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 3

Протокол HTTP/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 4

Форматирование текста и фона/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 5

Язык разметки HTML. Гиперссылки. Использование изображений и медиа на странице. /Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 6

Списки. Таблицы. Фреймы, плавающие фреймы/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 7

Списки и ссылки/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 8

Симантическая разметка/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 9

Изображения и медиа/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 10

Составление форм, валидация данных, регулярные выражения/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 11

Элементы формы/Пр/

5

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 12

Регулярные выражения/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 13

Применение таблиц/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

1. 14

Проверочная работа/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

Раздел 2. CSS

2. 1

Основы CSS/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 2

Основы CSS/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 3

Создание макета страницы и верстка/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 4

Основы Вэб дизайна/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 5

Адаптивный дизайн  Flex элементы/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 6

Верстка по сетке Grid/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 7

Макеты и дизайн Вэб приложения/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 8

Адаптивный дизайн Flex/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 9

Адаптивный дизайн Grid/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

2. 10

Проверочная работа/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

Раздел 3. JavaScript

3. 1

Основные сведения о Java-script. Стандарт ECMA-262/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 2

Основные конструкции Java-script. Подключение скриптов к странице/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 3

Объекты Window, Document, Date»/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 4

Выполнение линейных алгоритмов в консоли/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 5

Массивы/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 6

«Java Script. Объекты Window, Document, Date»/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 7

Объекты клиентских приложений/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 8

Объекты DOM/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 9

Функции в JS. Повторяющиеся и отложенные функции setTimeout и setInterval/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 10

Создание слайдера/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 11

События клавиатуры и мыши/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 12

Управление персонажем с помощью клавиатуры и мыши/Пр/

5

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 13

Технология REST/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 14

J-son и ajax запросы/Лек/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 15

Тестирование серверного api/Пр/

5

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 16

Запросы и использование данных с сервера/Пр/

5

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 17

Классы и объекты в JavaScript/Лек/

5

6

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 18

Классы и объекты в JavaScript/Пр/

5

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

3. 19

Заключительное занятие, подготовка к экзамену/Пр/

6

2

Раздел 4. Графика

4. 1

Растровый холст Canvas/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

4. 2

Растровый холст Canvas/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

4. 3

Векторная графика svg/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

4. 4

Векторная графика svg/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

Раздел 5. Библиотеки и фреймворки

5. 1

Библиотека Jquery/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 2

Библиотека Jquery/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 3

Библиотека Jquery UI/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 4

Библиотека Jquery UI/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 5

Проектирование игры/Лек/

6

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 6

Проектирование игры/Пр/

6

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 7

Язык TypeScript/Лек/

6

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 8

Язык TypeScript/Пр/

6

4

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 9

Переменные и функции CSS/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 10

Переменные и функции CSS/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 11

Препроцессор css less/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 12

Препроцессор css less/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 13

Библиотека Tailweind/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 14

Библиотека Tailwind/Пр/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. 15

Заключительное занятие, подготовка к экзамену/Лек/

6

2

ПК 8.1.,ОК 01.,ОК 02.,ОК 03.,ОК 04.,ОК 05.,ОК 06.,ОК 07.,ОК 08.,ОК 09.,ПК 8.2.,ПК 8.3.

5. ЛИТЕРАТУРА

Сакулин, С. А. Основы интернет-технологий: HTML, CSS, JavaScript, XML : учебное пособие / С. А. Сакулин. - Москва : Издательство МГТУ им. Баумана, 2017. - 112 с. - ISBN 978-5-7038-4724-4. - Текст : электронный. - URL: https://znanium.ru/catalog/product/2169329 (дата обращения: 19.09.2024). – Режим доступа: по подписке.

5.1. Перечень ресурсов информационно-телекоммуникационной сети "Интернет"

W3C Making the Web work

1

ECMA-262. ECMAScript® 2024 language specification

2

5.2. Перечень программного обеспечения

VS CODE

Браузер Chrome

Браузер Mozila

OpenServer

NodeJs

5.3. Перечень информационных справочных систем

-

6. МАТЕРИАЛЬНО-ТЕХНИЧЕСКОЕ ОБЕСПЕЧЕНИЕ ДИСЦИПЛИНЫ

Персональный компьютер

Сеть Интернет

Левит Л.В. Ильюшеков Л.В. Методические указания по освоению МДК 08.01 Проектирование и разработка интерфейсов пользователя

https://moodle.pkgh.ru/course/view.php?id=1595

7. МЕТОДИЧЕСКИЕ УКАЗАНИЯ ДЛЯ ОБУЧАЮЩИХСЯ ПО  ДИСЦИПЛИНЕ