КОС ПМ 08

Министерство образования и науки Республики Дагестан
Государственное бюджетное профессиональное образовательное
учреждение
«Дербентский профессионально-педагогический
колледж им.Г.Б.Казиахмедова»

Комплект
контрольно-оценочных средств
профессионального модуля
ПМ 08. РАЗРАБОТКА ДИЗАЙНА ВЕБ-ПРИЛОЖЕНИЙ
основной профессиональной образовательной программы (ОПОП) по
специальности СПО
09.02.07 Информационные системы и программирование
(код и наименование профессии/специальности в соответствии с ФГОС СПО)

г. Дербент, 2025 г.

СОДЕРЖАНИЕ
ОБЩИЕ ПОЛОЖЕНИЯ ......................................................................................................................... 3
1. ФОРМЫ КОНТРОЛЯ И ОЦЕНИВАНИЯ ЭЛЕМЕНТОВ ПРОФЕССИОНАЛЬНОГО
МОДУЛЯ ....................................................................................................................................................3
2. РЕЗУЛЬТАТЫ ОСВОЕНИЯ ПРОФЕССИОНАЛЬНОГО МОДУЛЯ .................................... 4
2.1

Результаты аттестации ............................................................................................................ 4

2.2

Распределение оценивания результатов обучения по видам контроля ....................... 11

3. ОЦЕНКА ОСВОЕНИЯ МЕЖДИСЦИПЛИНАРНЫХ КУРСОВ И ПРАКТИК................... 14
3.1

МДК 08.01 Проектирование и разработка интерфейсов пользователя ........................ 14
3.1.1. Оценка освоение теоретического материала междисциплинарного курса ...14

3.1.2. Оценка текущей аттестации .............................................................................................. 14
3.1.3. Оценка промежуточной аттестации ................................................................................ 16
3.2

МДК.08.02 Графический дизайн и мультимедиа .............................................................. 26

3.2.1. Оценка освоение теоретического материала междисциплинарного курса ............. 26
3.2.2. Оценка текущей аттестации .............................................................................................. 26
3.2.1. Оценка промежуточной аттестации ................................................................................. 42
3.3

МДК.08.03 Решение комплексных задач по модулю 08 ................................................... 48

3.1.4. Оценка освоение теоретического материала междисциплинарного курса ............. 48
3.1.5. Оценка текущей аттестации .............................................................................................. 48
3.1.6. Оценка промежуточной аттестации ................................................................................ 51
3.4

УП.08 Учебная практика ....................................................................................................... 54

3.5

ПП.08 Производственная практика ..................................................................................... 60

3.6

Экзамен по модулю (квалификационный) ......................................................................... 61

ОБЩИЕ ПОЛОЖЕНИЯ
Результатом освоения профессионального модуля является готовность обучающегося к
выполнению вида профессиональной деятельности Разработка дизайна веб-приложений и
составляющих его профессиональных компетенций, а также общие компетенции, формирующиеся
в процессе освоения ОПОП в целом.
Формой аттестации по междисциплинарному курсу является экзамен.

1. ФОРМЫ КОНТРОЛЯ И ОЦЕНИВАНИЯ ЭЛЕМЕНТОВ
ПРОФЕССИОНАЛЬНОГО МОДУЛЯ
Таблица 1.1
Элемент модуля
МДК 08.01 Проектирование
и разработка интерфейсов
пользователя
МДК.08.02 Графический
дизайн и мультимедиа

МДК.08.03 Решение
комплексных задач по
модулю 08
УП.08 Учебная практика

ПП.08 Производственная
практика
Экзамен по модулю
(квалификационный)

Форма контроля и оценивания
Промежуточная аттестация
Текущий контроль
3 семестр – другие формы контроля
Оценка выполнения
4 семестр – другие формы контроля
практических работ, тестовых
5 семестр – дифференцированный зачет
заданий
6 семестр – экзамен
3 семестр – дифференцированный зачет
Оценка выполнения
4 семестр – курсовая работа
лабораторных работ,
5 семестр - экзамен
самостоятельных работ,
тестовых заданий, семинара
7 семестр – другие формы контроля
Оценка выполнения
8 семестр – другие формы контроля
лабораторных работ,
самостоятельных работ,
тестовых заданий, семинара
4 семестра - дифференцированный зачет
Оценка выполнения
5 семестра - дифференцированный зачет практических работ, тестовых
7 семестра - дифференцированный зачет
заданий
8 семестра - дифференцированный зачет
4 семестра - дифференцированный зачет
Оценка выполнения отчета
6 семестра - дифференцированный зачет
7 семестра - дифференцированный зачет
7 семестр - экзамен

РЕЗУЛЬТАТЫ ОСВОЕНИЯ ПРОФЕССИОНАЛЬНОГО МОДУЛЯ

2.1

Результаты аттестации

В результате аттестации по междисциплинарным курсам профессионального модуля
осуществляется комплексная проверка следующих профессиональных и общих компетенций:
Таблица 2.1
Профессиональные и общие
Показатели оценки результата
компетенции, которые возможно
сгруппировать для проверки
МДК 08.01 Проектирование и разработка интерфейсов пользователя

ПК 8.1. Разрабатывать
дизайнконцепции веб-приложений в
соответствии с корпоративным стилем
заказчика.
ОК 1. Выбирать способы решения задач
профессиональной деятельности,
применительно к различным
контекстам.
ОК 2. Осуществлять поиск, анализ и
интерпретацию информации,
необходимой для выполнения задач
профессиональной деятельности.
ОК 3. Планировать и реализовывать
собственное профессиональное и
личностное развитие.
ОК 4. Работать в коллективе и команде,
эффективно взаимодействовать с
коллегами, руководством, клиентами.

Производить разработку эскизов, схем интерфейса, прототипов,
интерфейсов веб-приложений по требованию заказчика с учетом
корпоративного стиля.
Обоснованность постановки цели, выбора и применения методов
и способов решения профессиональных задач.
Адекватная оценка и самооценка эффективности и качества
выполнения профессиональных задач.
Использование различных источников, включая электронные
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
издания по специальности для решения профессиональных задач.
Демонстрация ответственности за принятые решения.
Обоснованность самоанализа и коррекция результатов
собственной работы.
Взаимодействовать с обучающимися, преподавателями и
мастерами в ходе обучения, с руководителями учебной и
производственной практик.
Обоснованность анализа работы членов команды (подчиненных).

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

Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.

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

Эффективность использовать средств физической культуры для
сохранения и укрепления здоровья при выполнении
профессиональной деятельности.

ОК 11. Планировать
предпринимательскую деятельность в
профессиональной сфере

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

Соблюдение норм поведения во время учебных занятий и
прохождения учебной и производственной практик.

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

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

Профессиональные и общие
Показатели оценки результата
компетенции, которые возможно
сгруппировать для проверки
МДК.08.02 Графический дизайн и мультимедиа
ПК 8.2. Формировать требования к
Умение формировать и оформлять требования к дизайну
дизайну веб-приложений на основе
вебприложений на основе анализа предметной области и целевой
анализа предметной области и целевой аудитории.
аудитории.
Использование различных источников, включая электронные
ОК 2. Осуществлять поиск, анализ и
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
интерпретацию информации,
издания по специальности для решения профессиональных задач.
необходимой для выполнения задач
Демонстрировать грамотность устной и письменной речи.
профессиональной деятельности.
Ясность формулирования и изложения мыслей.
ОК 5. Осуществлять устную и
Эффективное выполнение правил ТБ во время учебных занятий,
письменную коммуникацию на
при прохождении учебной и производственной практик.
государственном языке с учетом
особенностей социального и
Демонстрация знаний и использование ресурсосберегающих
культурного контекста.
технологий в профессиональной деятельности.
ОК 7. Содействовать сохранению
Эффективность использовать средств физической культуры для
окружающей среды,
сохранения и укрепления здоровья при выполнении
ресурсосбережению, эффективно
профессиональной деятельности.
действовать в чрезвычайных ситуациях. Эффективность использования в профессиональной деятельности
ОК 8. Использовать средства
необходимой технической документации, в том числе на
физической культуры для сохранения и английском языке.
укрепления здоровья в процессе
профессиональной деятельности и
поддержания необходимого уровня
физической подготовленности. ОК 10.
Пользоваться
профессиональной документацией на
государственном и иностранном
языках.
ПК 8.3. Осуществлять разработку
Демонстрация умения разрабатывать дизайн веб-приложения с
дизайна веб-приложения с учетом
учетом современных тенденций в области веб-разработки
современных тенденций в области
Обоснованность постановки цели, выбора и применения методов
вебразработки
и способов решения профессиональных задач.
ОК 1. Выбирать способы решения задач Адекватная оценка и самооценка эффективности и качества
профессиональной деятельности,
выполнения профессиональных задач.
применительно к различным
Демонстрация ответственности за принятые решения.
контекстам.
Обоснованность самоанализа и коррекция результатов
ОК 3. Планировать и реализовывать
собственной работы.
собственное профессиональное и
Взаимодействовать с обучающимися, преподавателями и
личностное развитие.
мастерами в ходе обучения, с руководителями учебной и
ОК 4. Работать в коллективе и команде, производственной практик.
эффективно взаимодействовать с
Обоснованность анализа работы членов команды (подчиненных).
коллегами, руководством, клиентами.
Соблюдение норм поведения во время учебных занятий и
ОК 6. Проявлять
прохождения учебной и производственной практик.
гражданскопатриотическую позицию,
Эффективность использования
демонстрировать осознанное поведение информационнокоммуникационных технологий в
на основе традиционных
профессиональной
общечеловеческих ценностей,

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

деятельности согласно формируемым умениям и получаемому
практическому опыту.

Профессиональные и общие
Показатели оценки результата
компетенции, которые возможно
сгруппировать для проверки
МДК.08.03 Решение комплексных задач по модулю 08
ПК 8.1. Разрабатывать
Производить разработку эскизов, схем интерфейса, прототипов,
дизайнконцепции веб-приложений в
интерфейсов веб-приложений по требованию заказчика с учетом
соответствии с корпоративным стилем корпоративного стиля.
заказчика.
Умение формировать и оформлять требования к дизайну
ПК 8.2. Формировать требования к
дизайну веб-приложений на основе
вебприложений на основе анализа предметной области и целевой
анализа предметной области и целевой аудитории.
аудитории.
Использование различных источников, включая электронные
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
издания по специальности для решения профессиональных задач.
Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.
ПК 8.3. Осуществлять разработку
Демонстрация умения разрабатывать дизайн веб-приложения с
дизайна веб-приложения с учетом
учетом современных тенденций в области веб-разработки
современных тенденций в области
Обоснованность постановки цели, выбора и применения методов
вебразработки
и способов решения профессиональных задач.
Адекватная оценка и самооценка эффективности и качества
выполнения профессиональных задач.
ОК 1. Выбирать способы решения задач Обоснованность постановки цели, выбора и применения методов
профессиональной деятельности,
и способов решения профессиональных задач.
применительно к различным
Адекватная оценка и самооценка эффективности и качества
контекстам.
выполнения профессиональных задач.
ОК 2. Осуществлять поиск, анализ и
Использование различных источников, включая электронные
интерпретацию информации,
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
необходимой для выполнения задач
издания по специальности для решения профессиональных задач.
профессиональной деятельности.
ОК 3. Планировать и реализовывать
Демонстрация ответственности за принятые решения.
собственное профессиональное и
Обоснованность самоанализа и коррекция результатов
личностное развитие.
собственной работы.
ОК 4. Работать в коллективе и команде, Взаимодействовать с обучающимися, преподавателями и
эффективно взаимодействовать с
мастерами в ходе обучения, с руководителями учебной и
коллегами, руководством, клиентами.
производственной практик.
Обоснованность анализа работы членов команды (подчиненных).

Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.

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

Соблюдение норм поведения во время учебных занятий и
прохождения учебной и производственной практик.

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

Профессиональные и общие
компетенции, которые возможно
сгруппировать для проверки
УП.08 Учебная практика

Показатели оценки результата

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

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

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

Умение формировать и оформлять требования к дизайну
вебприложений на основе анализа предметной области и целевой
аудитории.
Использование различных источников, включая электронные
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
издания по специальности для решения профессиональных задач.
Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.
Демонстрация умения разрабатывать дизайн веб-приложения с
учетом современных тенденций в области веб-разработки
Обоснованность постановки цели, выбора и применения методов
и способов решения профессиональных задач.

Адекватная оценка и самооценка эффективности и качества
выполнения профессиональных задач.

ОК 1. Выбирать способы решения задач
профессиональной деятельности,
применительно к различным
контекстам.
ОК 2. Осуществлять поиск, анализ и
интерпретацию информации,
необходимой для выполнения задач
профессиональной деятельности.
ОК 3. Планировать и реализовывать
собственное профессиональное и
личностное развитие.
ОК 4. Работать в коллективе и команде,
эффективно взаимодействовать с
коллегами, руководством, клиентами.

Обоснованность постановки цели, выбора и применения методов
и способов решения профессиональных задач.
Адекватная оценка и самооценка эффективности и качества
выполнения профессиональных задач.
Использование различных источников, включая электронные
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
издания по специальности для решения профессиональных задач.
Демонстрация ответственности за принятые решения.
Обоснованность самоанализа и коррекция результатов
собственной работы.
Взаимодействовать с обучающимися, преподавателями и
мастерами в ходе обучения, с руководителями учебной и
производственной практик.
Обоснованность анализа работы членов команды (подчиненных).

Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.

Соблюдение норм поведения во время учебных занятий и
прохождения учебной и производственной практик.

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

Профессиональные и общие
компетенции, которые возможно
сгруппировать для проверки
ПП.08 Производственная практика

Показатели оценки результата

Профессиональные и общие
компетенции, которые возможно
сгруппировать для проверки

Показатели оценки результата

Экзамен по модулю (квалификационный)
ПК 8.1. Разрабатывать
дизайнконцепции веб-приложений в
соответствии с корпоративным стилем
заказчика.
ПК 8.2. Формировать требования к
дизайну веб-приложений на основе
анализа предметной области и целевой
аудитории.

Производить разработку эскизов, схем интерфейса, прототипов,
интерфейсов веб-приложений по требованию заказчика с учетом
корпоративного стиля.
Умение формировать и оформлять требования к дизайну
вебприложений на основе анализа предметной области и целевой
аудитории.
Использование различных источников, включая электронные
ресурсы, медиаресурсы, Интернет-ресурсы, периодические
издания по специальности для решения профессиональных задач.
Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.
Демонстрация умения разрабатывать дизайн веб-приложения с
учетом современных тенденций в области веб-разработки
Обоснованность постановки цели, выбора и применения методов
и способов решения профессиональных задач.
Адекватная оценка и самооценка эффективности и качества
выполнения профессиональных задач.

Демонстрировать грамотность устной и письменной речи.
Ясность формулирования и изложения мыслей.

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

Соблюдение норм поведения во время учебных занятий и
прохождения учебной и производственной практик.

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

2.2

Распределение оценивания результатов обучения по видам
контроля

Формулировка темы
по программе МДК

Наименование элемента умений или знаний

Виды аттестации
Текущий
Промежуточная
контроль
аттестация

МДК 08.01 Проектирование и разработка интерфейсов пользователя
Тема 08.01.01 Основы
web-технологий.

У4. Разрабатывать интерфейс пользователя для веб-приложений с
использованием современных стандартов. З4 Стандарт UIX - UI
&UXDesign.
З5 Инструменты для разработки эскизов, схем интерфейсов и прототипа
дизайна веб-приложений.
Тема 08.01.02
У1. Создавать дизайн с применением промежуточных эскизов, прототипов,
Webдизайн
требований к эргономике и технической эстетике.
У2. Учитывать существующие правила корпоративного стиля.
У3. Придерживаться оригинальной концепции дизайна проекта и улучшать его
визуальную привлекательность.
З1. Нормы и правила выбора стилистических решений.
З2. Способы создания эскиза, схем интерфейса и прототипа дизайна по
предоставляемым инструкциям и спецификациям.
З3. Правила поддержания фирменного стиля, бренда и стилевых инструкций.
З4. Стандарт UIX - UI &UXDesign.
МДК.08.02 Графический дизайн и мультимедиа
Тема 1. Компьютерная
графика
Тема 2. Векторная
графика
Тема 3. Растровая
графика

Практическая
работа

Дифференцированный
зачет

Практическая
работа

Дифференцированный
зачет

Семинар
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений.
У 3. Создавать дизайн с применением промежуточных эскизов, требований к
эргономике и технической эстетике
З 2. Современные методики разработки графического интерфейса

Лабораторная
работа
Лабораторная
работа

Дифференцированный
зачет
Курсовая работа

ПО 2. В создании, использовании и оптимизировании изображений для
вебприложений

Тема 4. Трехмерная
У 1. Создавать, использовать и оптимизировать изображения для
графика
вебприложений
МДК.08.03 Решение комплексных задач по модулю 08
Тема 08.03.01 Решение
комплексных задач по
модулю 08.

У4. Разрабатывать интерфейс пользователя для веб-приложений с
использованием современных стандартов.
З4 Стандарт UIX - UI &UXDesign.
З5 Инструменты для разработки эскизов, схем интерфейсов и прототипа
дизайна веб-приложений.
У1. Создавать дизайн с применением промежуточных эскизов, прототипов,
требований к эргономике и технической эстетике.
У2. Учитывать существующие правила корпоративного стиля.
У3. Придерживаться оригинальной концепции дизайна проекта и улучшать его
визуальную привлекательность.
З1. Нормы и правила выбора стилистических решений.
З2. Способы создания эскиза, схем интерфейса и прототипа дизайна по
предоставляемым инструкциям и спецификациям.
З3. Правила поддержания фирменного стиля, бренда и стилевых инструкций.
З4. Стандарт UIX - UI &UXDesign.
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений.
У 3. Создавать дизайн с применением промежуточных эскизов, требований к
эргономике и технической эстетике
З 2. Современные методики разработки графического интерфейса

Тестирование

Экзамен

Практическая
работы

Другие формы контроля

ПО 2. В создании, использовании и оптимизировании изображений для
вебприложений

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

У4. Разрабатывать интерфейс пользователя для веб-приложений с
использованием современных стандартов. З4 Стандарт UIX - UI
&UXDesign.
З5 Инструменты для разработки эскизов, схем интерфейсов и прототипа
дизайна веб-приложений.
У1. Создавать дизайн с применением промежуточных эскизов, прототипов,
требований к эргономике и технической эстетике.
У2. Учитывать существующие правила корпоративного стиля.
У3. Придерживаться оригинальной концепции дизайна проекта и улучшать его
визуальную привлекательность.
З1. Нормы и правила выбора стилистических решений.
З2. Способы создания эскиза, схем интерфейса и прототипа дизайна по
предоставляемым инструкциям и спецификациям.
З3. Правила поддержания фирменного стиля, бренда и стилевых инструкций.
З4. Стандарт UIX - UI &UXDesign.
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений.
У 3. Создавать дизайн с применением промежуточных эскизов, требований к
эргономике и технической эстетике
З 2. Современные методики разработки графического интерфейса
ПО 2. В создании, использовании и оптимизировании изображений для
вебприложений
ПП 08. Производственная практика

Практическая
работы

Дифференцированный
зачет

У4. Разрабатывать интерфейс пользователя для веб-приложений с
использованием современных стандартов. З4 Стандарт UIX - UI
&UXDesign.
З5 Инструменты для разработки эскизов, схем интерфейсов и прототипа
дизайна веб-приложений.
У1. Создавать дизайн с применением промежуточных эскизов, прототипов,
требований к эргономике и технической эстетике.
У2. Учитывать существующие правила корпоративного стиля.
У3. Придерживаться оригинальной концепции дизайна проекта и улучшать его
визуальную привлекательность.
З1. Нормы и правила выбора стилистических решений.
З2. Способы создания эскиза, схем интерфейса и прототипа дизайна по
предоставляемым инструкциям и спецификациям.
З3. Правила поддержания фирменного стиля, бренда и стилевых инструкций.
З4. Стандарт UIX - UI &UXDesign.
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений
У 1. Создавать, использовать и оптимизировать изображения для
вебприложений.
У 3. Создавать дизайн с применением промежуточных эскизов, требований к
эргономике и технической эстетике
З 2. Современные методики разработки графического интерфейса
ПО 2. В создании, использовании и оптимизировании изображений для
вебприложений
Экзамен по модулю (квалификационный)

Дифференцированный
зачет

Экзамен

ОЦЕНКА ОСВОЕНИЯ МЕЖДИСЦИПЛИНАРНЫХ КУРСОВ И ПРАКТИК

3.1

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

Обучение по междисциплинарному курсу проводится в течении 4 семестров.

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

3.1.2. Оценка текущей аттестации
Тема 08.01.01 Основы web-технологий (3 семестр)
ПРАКТИЧЕСКАЯ РАБОТА №2
«Применение тегов HTML при создании webстраниц» Цель: изучение элементов и атрибутов HTML5. Задачи:
1. Изучить теоретические основы структуры страницы.
2. Изучить теги HTML5.
3. Выполнить задание по образцу.
Коды формируемых компетенций: ОК 1, ОК 2, ОК 3, ОК 9, ОК 10,ПК 8.1. Формируемые
умения и знания: У 4, З 4, З 5.

ПРАКТИЧЕСКИЕ ЗАДАНИЯ
Реализовать размещение элементов согласно образцу.

Рисунок 1. Образец дизайна на разработку 2.
Сделайте вывод по проведенной работе.
Критерии выставления оценки за практическую работу:
Оценка

Полная, системность, прочность знаний,

Обобщенность

«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Составленный дизайн полностью соответствует образцу.
Код валидный, соответствует HTML5.
Имеются комментарии в коде.
Использованы flex и grid технологии.
Владение профессиональной терминологией.
Составленный дизайн полностью соответствует образцу.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Владение терминологией.
Составленный дизайн не полностью соответствует образцу.
Код не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Нет четкости в изложении вопроса и ответа.
Составленный дизайн не соответствует образцу.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Ответ должен быть
самостоятельным

Ответ может быть
самостоятельным,
с
подсказками
преподавателя
Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя
Отсутствует порядок в
проведении анализа

Тема 08.01.01 Основы web-технологий (4 семестр)
ПРАКТИЧЕСКАЯ РАБОТА №7
«Использование циклических конструкций на языке JavaScript»
Цель: изучение методы использования циклических конструкций в JavaScript.
Задачи:
1. Изучить теоретические основы циклических конструкций.
2. Выполнить задание.
Коды формируемых компетенций: ОК 1, ОК 2, ОК 3, ОК 9, ОК 10,ПК 8.1. Формируемые
умения и знания: У 4, З 4, З 5.
ПРАКТИЧЕСКОЕ ЗАДАНИЕ
1.
Даны два числа. Вывести большее из них.
2.
Даны три числа. Найти сумму двух наибольших из них.
3.
С клавиатуры вводится год. Программа должна определять високосный это год
или нет. Вывести на экран соответствующую надпись, а также количество дней в году
(подсказка: Любой год, который делится на 4 без остатка, является високосным годом).
Критерии выставления оценки за практическую работу:
Оценка
«5»
(отлично)

«4» (хорошо)

Обобщенность
Ответ должен быть
самостоятельным

Ответ может быть
самостоятельным,
с
подсказками
преподавателя

Владение профессиональной терминологией.

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Код валидный.
Код структурирован, но есть недочеты.
Код работает без ошибок в консоли.
Нет комментариев в коде.
Результат верный.
Владение профессиональной терминологией.
Код валидный.
Код структурирован, но есть недочеты.
Код работает с ошибками в консоли.
Нет комментариев в коде.
Результат не верный.
Владение профессиональной терминологией.

Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя

Отсутствует порядок в
проведении анализа

Тема 08.01.01 Основы web-технологий (5 семестр)
ПРАКТИЧЕСКАЯ РАБОТА №19
«Использование Jquery при создании страниц»
Цель: изучение методы использования операций на JQuery. Задачи:
1. Изучить теоретические основы циклических конструкций.
2. Выполнить задание.
Коды формируемых компетенций: ОК 1, ОК 2, ОК 3, ОК 9, ОК 10,ПК 8.1. Формируемые
умения и знания: У 4, З 4, З 5.

ПРАКТИЧЕСКОЕ ЗАДАНИЕ
Создать выпадающее меню с помощью JQuery
Критерии выставления оценки за практическую работу:

Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

Полная, системность, прочность знаний,
Код валидный.
Код структурирован.
Код работает без ошибок в консоли.
Имеются комментарии в коде.
Результат верный.
Владение профессиональной терминологией.
Код валидный.
Код структурирован, но есть недочеты.
Код работает без ошибок в консоли.
Имеются комментарии в коде.
Результат верный.
Владение профессиональной терминологией.
Код валидный.
Код структурирован, но есть недочеты.
Код работает без ошибок в консоли.
Нет комментариев в коде.
Результат верный.
Владение профессиональной терминологией.

Обобщенность
Ответ должен быть
самостоятельным

Ответ может быть
самостоятельным,
с
подсказками
преподавателя

Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя

«2»
(неудовлетвори
тельно)

Код валидный.
Код структурирован, но есть недочеты.
Код работает с ошибками в консоли.
Нет комментариев в коде.
Результат не верный.
Владение профессиональной терминологией.

Отсутствует порядок в
проведении анализа

Тема 08.01.01 Основы web-технологий (6 семестр)
ПРАКТИЧЕСКАЯ РАБОТА №19
«Использование Figma для построения
дизайна» Цель: изучение методы построение дизайна в Figma.
Задачи:
1. Изучить теоретические основы циклических конструкций.
2. Выполнить задание.
Коды формируемых компетенций: ОК 1, ОК 2, ОК 3, ОК 9, ОК 10,ПК 8.1. Формируемые
умения и знания: У 4, З 4, З 5.

ПРАКТИЧЕСКОЕ ЗАДАНИЕ
Создать дизайн сайта по образцу

Критерии выставления оценки за практическую работу:
Оценка

Полная, системность, прочность знаний,

Обобщенность

«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Код валидный.
Код структурирован.
Код работает без ошибок в консоли.
Имеются комментарии в коде.
Результат верный.
Владение профессиональной терминологией.
Код валидный.
Код структурирован, но есть недочеты.
Код работает без ошибок в консоли.
Имеются комментарии в коде.
Результат верный.
Владение профессиональной терминологией.
Код валидный.
Код структурирован, но есть недочеты.
Код работает без ошибок в консоли.
Нет комментариев в коде.
Результат верный.
Владение профессиональной терминологией.
Код валидный.
Код структурирован, но есть недочеты.
Код работает с ошибками в консоли.
Нет комментариев в коде.
Результат не верный.
Владение профессиональной терминологией.

Ответ должен быть
самостоятельным

Ответ может быть
самостоятельным,
с
подсказками
преподавателя

Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя

Отсутствует порядок в
проведении анализа

3.1.3. Оценка промежуточной аттестации
Тема 08.01.01 Основы web-технологий (3 семестр)
Промежуточной аттестацией 3 семестра являются «Другие формы контроля».
Результатом промежуточного контроля является «Практическая работа «Вёрстка», которая
реализуется

при

последовательном

выполнении

предшествующих

практических

работ:

«Практическая работа «Создание формы на html-странице.» и «Практическая работа
«Форматирование web-страниц с использованием каскадных таблиц стилей.»
ПРАКТИЧЕСКАЯ РАБОТА № 5 «Вёрстка»
Цель: Провести итоговый сбор страницы для отправки сообщений, с помощью формы.
Задачи:
1. Изучить теоретические основы построение форм на HTML.
2. Изучить теги построения интерактивных элементов.
3. Выполнить задание по описанию.
Коды формируемых компетенций: ОК 1, ОК 2, ОК 9, ПК 8.1.
Формируемые умения и знания: У 4, З 2, З 3.
ПРАКТИЧЕСКИЕ ЗАДАНИЯ
1. Собрать воедино страницу, реализующий верстку согласно образцу (используйте
алгоритмы и коды предыдущих практических работ).

Рисунок 2. Образец реализации задания
Критерии выставления оценки за практическую работу:
Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Полная, системность, прочность знаний,
Составленный дизайн полностью соответствует образцу.
Код валидный, соответствует HTML5.
Имеются комментарии в коде.
Использованы flex и grid технологии.
Владение профессиональной терминологией.
Составленный дизайн полностью соответствует образцу.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Владение терминологией.
Составленный дизайн не полностью соответствует образцу.
Код не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Нет четкости в изложении вопроса и ответа.
Составленный дизайн не соответствует образцу.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Обобщенность
Ответ должен быть
самостоятельным

Ответ может быть
самостоятельным, с
подсказками
преподавателя
Ответ не
самостоятельный, с
наводящими
вопросами
преподавателя
Отсутствует
порядок
в
проведении анализа

Тема 08.01.01 Основы web-технологий (4 семестр)
Промежуточной аттестацией 4 семестра являются «Другие формы контроля».
Тестовое задание
Какие значения можно хранить в переменных?
- Строки, числа с точкой, простые числа и булевые выражения
- Только числа и строки
- Строки, числа с точкой и простые числа
В чем отличие между локальной и глобальной переменной?
- Локальные видны повсюду, глобальные только в функциях
- Глобальные можно переопределять, локальные нельзя
- Глобальные видны повсюду, локальные только в функциях
- Отличий нет
- Локальные можно переопределять, глобальные нельзя

Что будет выведено в консоль?
var b = 10;
if (b % 3 == 0) {
var i = 10;
}
console.log(i);

- Ошибку
- Значение undefined
- Число 10
- Значение пустой строки
- Значение Nan
Какие циклы есть в языке JavaScript? for, forMap, foreach, while
- for, forMap, foreach, while, do while
- for, while, do while, foreach
- for, while, do while
Какая переменная записана неверно?
- var num = "STRING";
- var isDone = 0;
- var number = 12,5;
- var b = false;
Какое количество сообщений будет выведено в консоль?
for(var i = 10; i < 35; i += 5) {
console.log(i);
}

-5
-6
- 15
- 25
- Такой цикл работать не будет
Где верно указан запуск всплывающего окна?
- new alert ("Hi")
- Нет верных вариантов
- alert ("Hi")
- info ("Hi")
Что будет записано в переменную test?
var a = 5;
var test = 5 != a ? "Yes" : "No";

- "No"
- Будет ошибка
-5
- "Yes"
-a
Где верно указано имя переменной?
- var 2num;
- var num-1;
- ver num;
- var num_1;
- var num

Почему код ниже не будет работать?

- Неверно записан атрибут type
- Запись console.log необходимо прописывать лишь в отдельных файлах
- Необходима точка с запятой после console.log("Hi!")
Где можно использовать JavaScript?
- Веб-приложения
- Серверные приложения
- Можно во всех перечисленных
- Прикладное программное обеспечение
- Мобильные приложения
Какие функции выполняет JS?
* В вопросе не идет речь про платформу Node JS
- Отвечает за функции на стороне клиента
- Отвечает за работу с базами данных
- Создает стилевое оформление сайта
- Выполняет работу с сервером
- Создает разметку на странице сайта
Что такое условный оператор?
- Оператор сравнения значений
- Конструкция для создания определенной переменной
- Конструкция, что выполняет код несколько раз
Где верно указан вывод данных?
- print(Hello);
- write("Hello");
- prompt("Hello")
- console.log("Hello");
- documentWrite("Hello");
В чем разница между confirm и prompt?
- Они ничем не отличаются
- prompt вызывает диалоговое окно с полем для ввода, confirm - окно с подтверждением
- confirm вызывает диалоговое окно с полем для ввода, prompt - окно с подтверждением
Критерии выставления оценки за практическую работу:
Оценка
Количество правильных ответов
«5» (отлично)
12-15
«4» (хорошо)
9-11
«3» (удовлетворительно)
6-8
«2» (неудовлетворительно)
<6
Тема 08.01.01 Основы web-технологий (5 семестр)
Промежуточной аттестацией 5 семестра являются «дифференцированный зачет».
ПРАКТИЧЕСКАЯ РАБОТА
Разработать сайт по образцу с применением технологий Bootstrap и JQuery

Критерии выставления оценки за практическую работу:
Оценка
«5»
(отлично)

«4» (хорошо)

Обобщенность
Ответ должен быть
самостоятельным

Ответ
может
быть
самостоятельным, с
подсказками
преподавателя

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Составленный дизайн не полностью соответствует образцу.
Код не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Нет четкости в изложении вопроса и ответа.
Составленный дизайн не соответствует образцу.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя
Отсутствует порядок в
проведении анализа

Тема 08.01.02 Web-дизайн (6 семестр)
Промежуточной аттестацией 6 семестра являются «экзамен».
Экзаменационное
задание Цель: Разработать Landing Page по описанию.
Задачи:
1. Ознакомиться с легендой.
2. Изучить необходимые средства разработки.
3. Выполнить задание по описанию.
Коды формируемых компетенций: ОК 1, ОК 2, ОК 9, ПК 5.1.
Формируемые умения и навыки: У1, У2, У3, З1, З2, З3, З4.
ЗАДАНИЕ
Легенда
Вы молодой специалист в области веб-дизайн и работаете в одной из крупных веб-студий своего
города. В вашу студию обратилась молодежная организация «NS», занимающаяся организацией и
проведением молодежных массовых мероприятий, праздников и концертов. В ситуации обострения
пандемии, организация мероприятий и праздников не может быть организована в обычном формате,
поэтому Вам была дана задача реализовать дизайн интернет-портала для занятости молодежи в
период самоизоляции. На портале реализуются культурно-массовые мероприятия с целью
образования и развлечения молодых людей.
Ваша работа состоит из двух задач:
1.
Реализация графического представления портала «NS» (создать wireframe и дизайн
макеты портала).
2.
Реализовать верстку страниц портала по разработанным wireframe и дизайн макеты
портала.
Заказчик предоставил вам всю необходимую информацию:
Описание структуры и функционала портала
Графическая информация (набор фотографий, рисунков) для размещения на портале
Текстовая информация (описание основных блоков портала, текстовое наполнение блоков
портала, описание квестов) Основное требование заказчика:
Часть 1.
Проектирование, прототипирование интерфейса и разработка дизайн-макетов уникальных
страниц сайта
ВАЖНО: Прототип можно отрисовать на листах бумаги А4, либо в программах Axure / Adobe XD
/ Adobe PhotoShop / Gimp
Описание задания:

Необходимо разработать каркасную модель (wireframe) и дизайнмакеты Landing Page под смартфон,
планшет и десктоп. Landing Page должен иметь следующую структуру:
1.
Главный экран — текстово-графическая информация про основной посыл Landing
Page. На главном экране должно присутствовать меню, описание молодежной организации и
контакты модератора проекта. (Логотип портала необходимо разработать самостоятельно!)
(Элементы меню должны быть релизованы с hover-эффектом)
2.
Второй экран – портфолио существующих квестов. Вывод портфолио выполнить в
виде слайдера. (необходимо учесть, что у организации есть несколько квестов: «Квест Наука»,
«Квест
История», «Квест Искусство»!)
3.
Третий экран — форма заявки на выполнение задачи квеста. (в форме-заявке
используются обязательные поля: выбор квеста для выполнения, кнопка «Команда», ФИО
участника(ов), название команды, email, выбор волонтера-помощника, кнопка согласия на
обработку данных, ссылка на описание основных правил, кнопка подтверждения заявки)
4.
Четвертый экран — отзывы. (есть возможность просмотреть отзывы других
участников и возможность оставить свой отзыв (состоит из названия квеста, ФИО участника,
название команды, поле для отзыва, кнопки отправки отзыва))
5.
Пятый экран — подвал с копирайтом и контактами.
Приветствуется использование модальных окон и кнопки возврата в «шапку страницы».
ВХОДНЫЕ ДАННЫЕ
В папке «media» содержится тестовое наполнение портала, а также другая текстово-графическая
информация, полезная в процессе разработки сайта. Нет необходимости использовать все
предоставленные материалы — каждый участник сам решает полезность тех или иных материалов
для конкретно его задачи.
ВЫХОДНЫЕ ДАННЫЕ
1. Каркасная модель графического интерфейса (wireframe).
Сохраните свою работу в папке Модуль1, если выполняете электронно, либо сдайте заказчику листы
бумаги А4 с выполненным задание.
2. Дизайн-макеты сайта:
2.1. Макеты дизайна каждого экрана Landing Page под смартфон, планшет и десктоп должны
состоять из нескольких файлов (Photoshop-исходник в формате .psd и предпросмотр в формате .png
или .jpg).
✓
Макет под смартфоны — должен отражать схему отображения страниц при ширине экрана
320767 пикселей.
✓
Макет под планшеты — должен отражать схему отображения страниц при ширине экрана
7681279 пикселей.
✓
Макет под настольные компьютеры и ноутбуки — должен отражать схему отображения
страниц при ширине экрана 1280 пикселей и более.
2.2. Каждая версия макета должна иметь название в формате:
[НАЗВАНИЕ_СТРАНИЦЫ]_[ШИРИНА_ЭКРАНА].psd.
2.3. Сохраните свою работу в папке Модуль1.
Часть 2.
Разработка клиентской части сайта (front-end)
ВАЖНО: Запрещается экспорт кода из Axure/Adobe XD, оценивается «чистый» код и экспертами
отслеживается процесс самостоятельной верстки страниц.

Сверстать дизайн макеты страниц сайта с использованием современного технологического стека
разработки: HTML5, CSS3, JavaScript.
Допустимо и даже поощряется использовать техники, методы, библиотеки и фреймворки,
упрощающие разработку на каждом из описанных уровней, например Вы можете использовать при
разработке Bootstrap, Gulp, Less, Sass(SCSS), jQuery, Angular, или какое либо другое расширение
стека.
ВХОДНЫЕ ДАННЫЕ
Используются макеты-дизайна, разработанные в рамках Модуля 1. Код Landing Page должен быть
сверстан самостоятельно, участниками конкурса, допускается использование редакторов кода,
ускоряющих разработку, таких как Emmet или Jade, но совершенно недопустима машинная
генерация кода на основе макета.
ВЫХОДНЫЕ ДАННЫЕ
1. Работа должна состоять из набора html, css, js-файлов, изображений, а также других необходимых
для корректного отображения Landing Page в браузерах файлов.
2. Код максимально насколько это возможно должен соответствовать спецификации стандартов
HTML5 и CSS3. Для установления соответствия организационный комитет будет пользовать
официальным инструментом validator.w3.org. Любое отклонение от стандартов должно быть
обоснованно в комментариях непосредственно перед или сразу после места отхождения от
спецификации.
3. Необходимо обеспечить некоторую степень кроссбраузерности: полученные в результате верстки
страницы должны одинаково адекватно отображаться, работать и соответствовать макетам в
последних версиях браузеров Chrome, FireFox, Opera, Safari, Internet Explorer и Edge.
4. Сохраните свою работу в папке Модуль2.
Критерии и вес оценки
Критерии
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

Прототип полностью соответствует техническому заданию (на Landing Page присутствует вся
информация из общей структуры данных)
Есть макеты под все предложенные устройства
На Landing Page присутствует логотип
Присутствуют отдельные модальных окон
Присутствуют отдельные макет логотипа
Есть отдельный макет меню под мобильный телефон
Макеты Landing Page разработаны по принципу единообразия: единый размер элементов,
одинаковая высота навигационных кнопок, оформление заголовков, подзаголовков и основного
текста, оформление ссылок и изображений для всех страниц сайта.
Присутствует макет, демонстрирующий hover эффект
Интерфейс Landing Page эргономичен и понятен, при создании использована модульная сетка,
направляющие
Общее впечатление от дизайна макета под настольные системы - 1280px
Дизайн привлекателен и гармоничен, удобен для использования на планшете
Дизайн привлекателен и гармоничен, удобен для использования на мобильном телефоне
Валидный код HTML5 (штраф -0.25 за каждый тип ошибки)
Весь текст выделяется, включая текст на кнопках
Расположение каждого раздела соответствует созданному макету
При ширине экрана от от 320 до 767 и от 768 до 1279 пикселей выводится версия дизайна для
смартфонов и планшетов, горизонтальная прокрутка отсутствует, целостность верстки,
элементов на страницах не нарушается на всём диапазоне ширин экрана
Настроена ссылка на возвращение в шапку
На Landing Page присутствуют Header и Footer

Max
оценки
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2

19
20
21
22
23
24
25

В коде присутствуют комментарии
Все внутренние ссылки ведут по нужным адресам
Использованы техники, методы, библиотеки и фреймворки, упрощающие разработку на каждом
из описанных уровней
В верстке не используется атрибут style, а также другие атрибуты, идентичные CSS-свойствам,
все стили вынесены в отдельные CSS-файлы
На Landing Page применяется hover эффект
Форма регистрации отображается корректно. Задан атрибут required, устанавливающий поле
формы обязательным для заполнения
Идентичность отображения сверстанных блоков в последних версиях браузеров Chrome, Opera,
Firefox, Safari, Internet Explorer.
ИТОГО

Критерии выставления оценки за практическую работу:
Оценка
Количество баллов
«5» (отлично)
44-50
«4» (хорошо)
34-44
«3» (удовлетворительно)
24-34
«2» (неудовлетворительно)
Менее 24

2
2
2
2
2
2
2
50

3.2

МДК.08.02 Графический дизайн и мультимедиа

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

Семинар по теме «Компьютерная графика»
Коды формируемых компетенций и личностных результатов: ОК 1, ОК 3, ОК 5, ОК 11, ЛР 4,
ЛР 9.
Вариант №1.
1. Какие виды компьютерной графики вы знаете?
2. Какой вид компьютерной графики стоит применить для обработки цветной фотографии,
предназначенной для рекламного буклета?
3. В каких единицах измеряют: разрешение экрана, разрешение принтера, разрешение
изображения?
4. Назовите наименьший элемент векторного изображения.
5. Цветовая модель CMYK.
6. Перечислите растровые форматы графических данных (3 шт)
7. Какой графический редактор лучше Pictureman или Microsoft Photodraw? Почему?
Вариант №2.
1. Какой вид компьютерной графики стоит применить для разработки эмблемы предприятия,
если заранее известно, что размер эмблемы может быть как малым (на бланках предприятия),
так и большим (на рекламных плакатах или футболках и сувенирах)?
2. В каких единицах измеряются размеры экранных изображений и печатных изображений?
3. Назовите наименьший элемент растрового изображения.
4. Цветовая модель RGB.
5. Какие векторные графические редакторы вы знаете?
6. Перечислите векторные форматы графических данных (3 шт).
7. Какой графический редактор лучше Paint Shop Pro или Microsoft Picture It? Почему?

Оценка

Критерии выставления оценки за семинар:
Полная, системность, прочность знаний,

Обобщенность

«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)
«2»
(неудовлетвори
тельно)

Четкость и культура изложения ответов на
заданные вопросы. Ответ на поставленный
вопрос изложен лаконично, грамотно.
Владение
профессиональной
терминологией. Изложение полученных
знаний и умений полное, в соответствии с
требованиями учебной программы.
Ответ на поставленный вопрос изложен
лаконично, грамотно.
Владение
терминологией.
Нет четкости в изложении вопроса и ответа.

Ответ
должен
быть
самостоятельным, без наводящих
вопросов преподавателя

Ответ
может
быть
самостоятельным, с наводящими
вопросами преподавателя
Ответ не самостоятельный, с
наводящими вопросами
преподавателя
Изложение учебного материала неполное, Отсутствует ответ на
бессистемное.
Отсутствие
знаний поставленный вопрос.
профессиональной терминологии. Не даны
ответы на поставленные вопросы.

Тема 2. Векторная графика
Лабораторная работа «Освоение приемов работы со слоями.
Создание сложных изображений»
Цель работы: научиться выполнять следующие операции:
• векторную маску отсечения; •
теневую маску отсечения;
• обтравочного контура.
Коды формируемых компетенций и личностных результатов: ОК 1 – ОК5, ПК 8.2., ПК 8.3.,
ЛР 4, ЛР 9.
Формируемые умения и навыки: У 1.
ПРАКТИЧЕСКИЕ ЗАДАНИЯ
Задание 1. Векторная маска отсечения
1.
Откройте файл Lessons\Слои. Маски отсечения\Розы.jpg. Создадим картинку для
открытки с розами.
2.
Инструментом Pencil (Карандаш) обведите розы, для удобства установив отсутствие
заливки при работе. Для создания маски важно, чтобы маскирующий объект находился сверху
растрового изображения (рис. 1).
3.
Выделите оба объекта (фото и контур). Выполните команду главного меню Object |
Clipping Mask | Make (Объект | Маска отсечения | Создать) или нажмите комбинацию клавиш
+<7> (рис. 1).

Рис. 1. Обводка карандашом и создание отсечения
Обратите внимание, что при превращении объекта в «служебный» (в маску) он потерял все
свои атрибуты, получив «пустые» обводку и заливку.
Маскирующий и маскируемый объекты связаны друг с другом подобно элементам группы:
при необходимости их можно выделять по отдельности инструментом Group Selection (Выделение
в группе) или Direct Selection (Частичное выделение).
Инструмент Direct Selection (Частичное выделение) позволяет редактировать форму
маскирующего объекта в любой момент.

Рис. 2. Возможный дизайн с использованием кистей
Итоговое изображение с возможным оформлением (применением кистей) представлено в
файле Lessons\Слои. Маски отсечения\Розы_итог.ai (рис. 2).
Здание 2. Создание теневой маски отсечения
1. Откройте файл Lessons\Слои.Маски отсечения\Джаз.ai (рис. 3).
2. Выделите фотографию и надпись и создайте маску отсечения: +<7> (рис. 3).
Текст потерял заливку, но сохранил все возможности форматирования: вы можете изменить
его гарнитуру, начертание и другие параметры, можете изменить надпись, но он все равно останется
маскирующим объектом. По окончании работы, как и в случае обычного текста, нужно перевести
текст в кривые: ++.

Рис. 3. Фотография с текстом для маски и выполнение маскирования

Задание 3. Создание обтравочного контура
1. Создайте новый документ.
2.
Командой File | Place (Файл | Поместить) поместите растровое изображение из файла
Lessons\Слои. Маски отсечения\Porsche.jpg. При этом в диалоговом окне поставьте флажок
Template (Шаблон) (рис. 4).

Рис. 4. Поместить фотографию на трафаретный слой
3.
При выполнении команды у вас образуются два слоя: трафаретный с фото,
обыкновенный слой для создания векторного аналога сверху (рис. 5).

Рис. 5. В палитре слоев образованы два слоя
4. На слое Layer 1 создайте векторный контур вокруг машины с фотографии (рис. 6). Контур
должен максимально точно повторять очертание машины, поэтому он создается инструментом Pen
(Перо) в режиме Outline (Макет).

Рис. 6. Процесс создания обтравочного контура
5.
Снимите блокировку у слоя-шаблона. Перейдите обратно в режим Preview
(Иллюстрация) +.
6.
Выделите контур и фотографию. Выполните с помощью «горячих» клавиш
+<7> маску отсечения (рис. 7).

Рис. 7. Маска отсечения
Обратите внимание, что машина стала яркой, в полный цвет. При этом она переместилась со
слоя-шаблона на слой с контуром, а слой-шаблон остался пустым. Эта технология очень удобна,
поскольку в процессе работы картинка настроена для максимального удобства рисования, а в
финале она сразу занимает свое место как полноправный элемент макета.
Покажите выполненные задания преподавателю.
Критерии оценки работы
Лабораторная работа считается выполненной на 5 (отлично) в том случае, если студент
выполнил все указанные задания, следуя порядку выполнения работы, освоил методику выполнения
типовых заданий и способен продемонстрировать работу программы;
Лабораторная работа считается выполненной на 4 (хорошо) в том случае, если студент
выполнил все указанные задания, следуя порядку выполнения работы, но не освоил методику
выполнения типовых заданий, но способен продемонстрировать работу программы;
Лабораторная работа считается выполненной на 3 (удовлетворительно) в том случае, если
студент выполнил не все указанные задания, следуя порядку выполнения работы, не в полной мере
освоил методику выполнения типовых заданий и продемонстрировать работу программы.
Тема 3. Растровая графика
Лабораторная работа «Создание оригинал-макетов, элементов дизайна сайта»
Коды формируемых компетенций и личностных результатов: ОК 1 – ОК5, ПК 8.2., ПК 8.3.,
ЛР 4, ЛР 9.
Формируемые умения и навыки: У 1, У 3, З 2.
Пояснения к работе
Дизайн это один из этапов в процессе создания сайта. От того как будет выглядеть сайт
зависит первое впечатление посетителя, комфорт пребывания и удобство пользования сайтом.
Практические задания
Создание и подготовка файла проекта
Создаем новый документ и настраиваем его следующим образом:

1.
Дать имя своему макету, например, "mysite".
2.
Ширину рекомендую выбрать в зависимости от разрешения монитора минус
20px. Если разрешение 1440х900px. А высоту сделать 1200px, при необходимости в будущем
можно будет ее увеличить.
3.
Единицы измерения установи в "Пикселях". Разрешение "72" Пиксели/дюйм.
4.
"OK". Сохранить его как psd "Файл > Сохранить как..." в нужной папке.
Создаем новый слой. Выберите инструмент "Прямоугольник", смените основной цвет на
неброский (например, c7b299) и создайте прямоугольник размером 1000х1200px (его заливка будет
зависеть от того, какой цвет выбран основным). Подкорректировать результат можно при помощи
панели Свойств.
Теперь прямоугольник нужно разместить по центру холста (отступив от края 200 рх,
растрировать прямоугольник и установить направляющие по краям. Направляющие имеют полезное
свойство прилипать к границам активного слоя.

Теперь нужно установить отступы внутри прямоугольника и поставить направляющие. Для
этого воспользуемся инструментом для выделения "Прямоугольная область". А именно создаем
выделенную область нужного размера, перетаскиваем ее в нужное мне место и тянем
направляющую пока она ни прилипает к краю выделенной области. Обычно устанавливают отступы
15-20px.

Получится вот так:

Все первоначальная настройка макета окончена.
Рекомендую сохранить его как шаблон и использовать каждый раз, когда потребуется
макет такого типа.
Сохраните, то что получилось "Файл -> Сохранить для Web -> PNG-24"
Теперь открой в проводнике или файловом менеджере папку с сохраненным файлом.
Теперь можно видеть, как выглядит макет в реальном размере. Когда производите изменения
файле повторяйте процедуру, но вместо того что бы каждый раз открывать файл через контекстное
меню просто нажимайте F5 в браузере, и оно будет обновляться.

Создание шапки сайта
Теперь залейте слой, который мы использовали для установки направляющих, белым цветом.
И приступим к созданию шапки сайта. Для этого создайте новую группу слоев и назовите ее "Шапка
сайта"

Разместим логотип компании. Поставим его традиционно с левой стороны. Это является не
обязательным местоположением, но принято размещать логотип именно слева или по центру
макета.
Это связанно с тем, что, попав на сайт пользователь сразу определит к какой именно
организации принадлежит сайт, к тому же большинство пользователей визуально изучают
страницу начиная с верху, слева на право. Если нарисовать линию, то получится нечто похожее на
букву Z.
Перенесите логотип компании Нестле в документ.
Если все правильно логотип скопируется новым слоем на холст с макетом. Перенесите его в
группу Шапка сайта.
Теперь нужно подогнать размер логотипа таким образом, чтобы он был не сильно большим,
но и не был мелким и выровняйте его левый край по направляющей. Растрируйте слой и определите
цвет логотипа как основной для последующей работы (это #005695).
Что бы проверить правильно ли подобран размер сохраните свой макет в формате png-24 и
откройте в браузере.

Теперь в группе Шапка сайта создаем новую группу слоев и называем ее Телефоны. При
помощи инструмента "Текст" пишем "Горячая линия" и номер телефона организации "+7 (3435)
1234-56". Часто размещают телефон в шапке по двум причинам. Первая это наличие телефона с
правой стороны в шапке уже привычно пользователям, так сделано на большинстве сайтов
компаний. Вторая, если это сайт компании, то многие посетители, почитав, то что их интересуют
наверняка захотят позвонить и им не придется открывать страницу контакты. Необходимо
подобрать подходящий (на ваш взгляд) шрифт, размер и выровнять телефон по правой внутренней
направляющей.
Располагая элементы на странице помни о соотношении размеров и цветов. Страница
должна быть сбалансирована. Если элементы находятся на одной линии выравнивай их с помощью
направляющих (по нижнему краю, верхнему или центру всех элементов на линии)

Создание дизайна главного меню сайта
Создаем новую группы слоев Меню.
Для того что бы сделать меню можно выбрать инструмент "Прямоугольная область",
создать 2 прямоугольника разного размера и с разным цветом и поместить больший сверху, а
меньший снизу. На верхний наложить эффект градиента. Вот что получилось:

Теперь нужно добавить пункты меню и подобрать для них подходящий цвет (один пункт
меню оставим белым - это нужно для того что бы показать, как будет выглядеть пункт меню при
наведении курсора мыши).
Теперь, что бы меню лучше смотрелось, а пункты меню имели визуальные разделители
добавим полоски по 2 пикселя в ширину. Один пиксель сделал чуть темнее, а другой чуть светлее
основных цветов градиента прямоугольника.

Потом размножить и распределить их между пунктами меню.

И на последнем шаге добавим hover эффект (эффект при наведении курсора мыши) для
одного из пунктов меню.

Создание дизайна левого меню сайта
Меню сделано в том же стиле и мало отличается от предыдущего по методу его создания
поэтому весь процесс выполните самостоятельно.
Однако стоит заострить внимание на следующих моментах:
1.
Разделение места при создании дизайна вопрос больной и требует особого внимания.
Чаще всего определяют, что левое меню не должно быть больше 250 px так как большая ширина
съедает место у контента. Однако все зависит от конкретного макета.
2.
Отступы между блоками не следует делать меньше 10 px. Оптимальными значениями
являются 10px, 15px, 20px.
3.
Создавая пункты меню можно не делать для каждого пункта отдельный текстовый
слой. Можно это сделать в одном слое начиная каждый пункт с новой строки (через ентер), а потом
просто отрегулировать меж строчный интервал в окне "Символ"
Старайтесь использовать стандартные шрифты по максимуму. Так как при просмотре
сайта пользователь используется шрифты своей системы.
Получилось вот такое меню:

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

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

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

Результат:

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

«Хорошо» - выполнение заданий полностью, но при наличии не более одной негрубой ошибки и
одного недочета, не более трех недочетов.
«Удовлетворительно» - продемонстрированы практические умения и правильное выполнение не
менее 2/3 практической части лабораторной работы.
«Неудовлетворительно» - обучающийся не смог выполнить лабораторную работу; задание
выполнено менее 2/3 всей работы.
Тема 4. Трехмерная графика
Лабораторная работа «Моделирование и анимация персонажей»
Цель работы: научиться выполнять следующие операции:
• моделировать персонаж;
• настраивать анимацию трехмерных объектов;
• запускать анимацию;
• редактировать эффекты анимации.
Коды формируемых компетенций и личностных результатов: ОК 1 – ОК5, ПК 8.2., ПК 8.3.,
ЛР 4, ЛР 9.
Формируемые умения и навыки: У 1.
1.
Загрузите в Blender файл ball.blend (меню Файл – Открыть, File – Open) и сохраните
его под именем ball-ready.blend (меню Файл – Сохранить как, File – Save As).
2.
Перейдите к виду сверху и добавьте на сцену плоскость (Добавить – Полисетка Плоскость, Add – Mesh – Plane). Нажмите клавишу N, чтобы вывести на экран панель
преобразований. Увеличьте размеры площадки в 10 раз по оси X и в 2 раза по оси Y (в группе
Масштаб, Scale). Затем перейдите к виду спереди (Num1), включите ортографическую проекцию
(Num5) и переместите плоскость немного вниз так, чтобы мяч её касался.

3.
В нижней части окна под временной шкалой установите последний кадр (Конец, End)
– 150, и текущий кадр – 1.

4.
Немного наклоните вид «на себя», чтобы видеть плоскость, и установите мяч на
некоторой высоте на левой границе плоскости (см. рисунок). Затем нажмите клавишу I (вставить
ключевой кадр) и выберите из списка вариант Положение и вращение ( LocRot, Location – Rotation).

5.
Сделайте текущим кадр 50 и установите мяч на плоскость, сдвинув его вправо.
Поскольку мяч касается плоскости при Z-координате, равной нулю, удобно выставить это значение
вручную на панели преобразований (клавиша N).

6.
Вставьте новый ключевой кадр типа Положение и вращение (LocRot). Обратите
внимание, что на панели преобразований координаты (Location) и углы поворота (Rotation)
выделены желтым фоном, это значит, что для них установлена анимация. кадр 50 кадр 90
Аналогично добавьте ключевые кадры 90, 125 и 150. кадр 125 кадр 150 После этого временная шкала
(Timeline) с расставленными ключевыми кадрами должна выглядеть примерно так:

7.
Запустите анимацию, нажав клавиши Alt+A, и посмотрите, что получилось.
Остановить анимацию можно с помощью клавиши Esc. Что не так?
8.
В верхней части экрана найдите список, позволяющий выбрать стандартное
расположение окон на экране, и выберите в нём вариант Animation (анимация).
9.
Переведите курсор в окно Редактора F-кривых (F-Curve Editor). Щелчком мыши по
треугольнику слева от типа ключевого кадра (LocRot) раскройте список всех кривых анимации.

10.
Раскройте окно редактора кривых на полный экран, нажав Ctrl и клавишу «стрелка
вверх».
11.
Щёлкая по значкам с изображением глаза, отключите все кривые, кроме X Положение
(X Location). Оставьте в ней только два узла (в кадрах 1 и 150). Для удаления узла нужно выделить
его и нажать клавишу Delete. Сделайте эти узлы векторными (выделить, нажать клавишу V, выбрать
в меню Векторный, Vector).

12.
Отключите все кривые, кроме Z Location (Z-координата). Сделайте узлы, в которых
мяч касается плоско- сти, свободными (клавиша V, выбрать из списка Свободный, Free) и измените
направляющие так, чтобы кривая состояла из кусков парабол. Для перемещения выделенного узла
или рукоятки нужно нажать клавишу G (grab, схватить) мышкой передвинуть узел в нужное
положение и нажать ЛКМ, чтобы зафиксировать его.

13.
Вернитесь к нормальному (не полноэкранному) режиму, нажав на клавиши
Ctrl+«стрелка вверх». Проверьте анимацию, нажав клавиши Alt+A.
14.
Теперь осталось сделать так, чтобы мяч вращался. Зададим вращение только вокруг
оси Y (вращение вокруг других осей вы сможете сделать самостоятельно). Оставьте в окне
редактора кривых только кривую Y Вращение Эйлера (Y Euler Rotation) и перейдите в
полноэкранный режим.
15.
Оставьте на кривой только два узла в кадрах 1 и 150. Пусть за время анимации мяч
поворачивается на 720 градусов, то есть делает два оборота вокруг своей оси. Выделите узел в кадре
150, нажмите клавишу N, чтобы вызвать панель преобразований, и введите Y-координату узла 720 .

16.
Нажмите клавишу Home, чтобы автоматически подобрать масштаб графика (его
можно также регулировать колесиком мыши). Сделайте оба узла векторными и проверьте
анимацию.

17.
Перейдите к виду с камеры (Num0) и настройте его так, чтобы видеть мяч во время
всей анимации (используйте «режим полёта», клавиши Shift+F).
18.
Теперь «покрасим» плоскость в зелёный цвет и сделаем ее шероховатой. Перейдите
на страницу свойств Материал (Material) и щелкните по кнопке Создать (New). В поле Диффузный
(Diffuse) установите зеленый цвет. Уменьшите интенсивность бликов до нуля: поле Интенсивность,
Intensity на панели Блик (Specular).

19.
Перейдите на страницу свойств Текстура (Texture). Создайте новую текстуру (кнопка
Создать, New). В списке Тип (Type) оставьте вариант по умолчанию Clouds (облака). На панели
Influence (влияние) снимите флажок Цвет (Color) и включите флажок Номаль (Normal), увеличив
значение в этом поле до 3. Выполните рендеринг и посмотрите результат.

20.
Перейди те на страницу свойств World (окружение). Установите белый Цвет
горизонта (Horizon Color), включите внешнее освещение (флажок Освещение от окружениия,
Environment Lighting) и уменьшите его интенсивность (Энергия, Energy) до 0,2.

21.
Перейдите на страницу свойств Рендеринг (Render). Уменьшите размер до 25% (чтобы
ускорить рендеринг). Установите формат выходного файла MPEG, задайте имя файла (с
расширением *.mpg). Затем щелкните по кнопке Animation (анимация) и ждите, когда ролик будет
готов. Это может занять несколько минут даже на достаточно мощном компьютере.
22.
Найдите получившийся видеофайл на диске и просмотрите его в проигрывателе.
Критерии оценки работы
Лабораторная работа считается выполненной на 5 (отлично) в том случае, если студент
выполнил все указанные задания, следуя порядку выполнения работы, освоил методику выполнения
типовых заданий и способен продемонстрировать работу программы;
Лабораторная работа считается выполненной на 4 (хорошо) в том случае, если студент
выполнил все указанные задания, следуя порядку выполнения работы, но не освоил методику
выполнения типовых заданий, но способен продемонстрировать работу программы;

Лабораторная работа считается выполненной на 3 (удовлетворительно) в том случае, если
студент выполнил не все указанные задания, следуя порядку выполнения работы, не в полной мере
освоил методику выполнения типовых заданий и продемонстрировать работу программы.
3.2.1. Оценка промежуточной аттестации
МДК.08.02. Графический дизайн и мультимедиа
В 3 семестре в форме дифференцированного зачета.
Проверяемые результаты обучения.
В процессе выполнения заданий экзаменационного билета обучающиеся осваивают
следующие компетенции и личностные результаты: ПК 8.2., ПК 8.3., ОК 1. – ОК 11., ЛР 4, ЛР 9.
1. Blender – это
a) пакет для создания трёхмерной компьютерной графики, анимации и
интерактивных приложений
b) графический редактор
c) текстовый редактор
d) программная среда для объектно-ориентированного программирования 2. Окно
blender состоит из трёх дочерних окон:
a) меню, окно 3D вида, панель кнопок
b) строка заголовка, панель инструментов, рабочая область
c) меню, панель инструментов, рабочая область
d) окно запуска программы, строка состояния, окно задач 3. Объекты сцены:
a) квадрат, лупа, курсор
b) куб, лампа, камера
c) куб, шар, цилиндр
d) окно, лампа, камера
4. Рендер является
a) графическим редактором
b) графическим отображением 3D сцены или объекта
c) источником света
d) отображением осей координат
5. Лампа является
a) графическим редактором
b) графическим отображением 3D сцены или объекта
c) источником света
d) отображением осей координат
6. Клавиша F12 служит для
a) рендеринга
b) вида сверху
c) поворота сцены
d) изменения масштаба
7. Клавиша 7 (NumPad) служит для
a) рендеринга
b) вида сверху
c) поворота сцены
d) изменения масштаба

8. Клавиша 5 (NumPad) служит для
a) рендеринга
b) перспективы
c) текстурирования
d) масштабирования
9. Клавиша 1 (NumPad) служит для
a) вида спереди
b) вида сверху
c) поворота сцены
d) изменения масштаба
10. Клавиши 2, 4, 6, 8 (NumPad) служат для
a) рендеринга
b) вида сверху
c) поворота сцены
d) изменения масштаба
11. Клавиша 0 (NumPad) служит для
a) вида из камеры
b) вида сверху
c) вида справа
d) поворота сцены
12. Прокрутка колеса мыши
a) меняет масштаб
b) поворачивает сцену
c) передвигает сцену
d) показывает перспективу
13. Движение мыши в 3D-окне при нажатом колесе
a) поворачивает сцену
b) передвигает сцену
c) показывает перспективу
d) меняет размер объекта
14. Движение мыши в 3D-окне при нажатом колесе + Shift
a) передвигает сцену
b) меняет масштаб
c) показывает перспективу
d) меняет размер объекта
15. Чтобы выделить несколько объектов:
a) щёлкать по ним по очереди правой кнопкой мыши при зажатой клавише Shift
b) щёлкать по ним по очереди левой кнопкой мыши при зажатой клавише Shift
c) щёлкать по ним по очереди левой кнопкой мыши при зажатой клавише Alt
d) обвести вокруг объектов мышью
16. Для изменения местоположения объекта на сцене используется
a) клавиша G
b) клавиша S
c) клавиша R
d) клавиша E
17. Для изменения размеров объекта на сцене используется
a) клавиша G

b) клавиша S
c) клавиша R
d) клавиша E
18. Для поворота объекта на сцене используется
a) клавиша G
b) клавиша S
c) клавиша R
d) клавиша E
19. Трехмерный курсор (3D-курсор) используется
a) для определения места, где будут добавляться другие объекты
b) для масштабирования объекта
c) для определения вида и размера объекта
d) для текстурирования объекта
20. Трехмерный курсор (3D-курсор) перемещается
a) щелчком левой кнопки мыши по 3D-окну
b) щелчком правой кнопки мыши по 3D-окну
c) щелчком правой кнопки мыши по 3D-окну при зажатой клавише Alt
d) нажатием клавиши F12
21. Клавиша 'R' служит для выполнения
a) вращения выделенных объектов или вершин
b) масштабирования выделенных объектов или вершин
c) перемещения выделенных объектов или вершин
d) экструдирования (вытягивания) выделенных вершин
22. Клавиша 'S' служит для выполнения
a) вращения выделенных объектов или вершин
b) масштабирования выделенных объектов или вершин
c) перемещения выделенных объектов или вершин
d) экструдирования (вытягивания) выделенных вершин
23. Клавиша 'E' служит для выполнения
a) вращения выделенных объектов или вершин
b) масштабирования выделенных объектов или вершин
c) перемещения выделенных объектов или вершин
d) экструдирования (вытягивания) выделенных вершин в режиме
редактирования
24. Клавиша 'Z' служит для
a) вращения выделенных объектов или вершин
b) масштабирования выделенных объектов или вершин
c) перемещения выделенных объектов или вершин
d) ограничения изменения объекта только по одной оси
25. Основной 3D меш-объект
a) куб
b) икосаэдр
c) тор
d) сфера
26. К меш-объектам относятся
a) куб, сфера, окружность, плоскость
b) цилиндр, кольцо, отрезок, вектор

c) цилиндр, конус, додекаэдр, параллелограмм
d) куб, сфера, прямоугольник, плоскость
27. Окно редактор нодов (свойств объектов)
a) служит для настройки применяемых эффектов при рендеринге
b) появляется автоматически при сохранении файла или картинки
c) служит для отображения конечного изображения
d) используется для просмотра и работы с моделями
28. Обозреватель Файлов/Картинок
a) служит для настройки применяемых эффектов при рендеринге
b) появляется автоматически при сохранении файла или картинки
c) служит для отображения конечного изображения
d) используется для просмотра и работы с моделями
29. Правая кнопка используется для
a) выбора объектов (или вершин в режиме Редактирования)
b) перемещение трехмерного курсора
c) выбора инструмента заливки
d) включения Лампы в режиме Объекта
30. Изображение рендеринга сохраняется
a) в формате объекта blender
b) в формате изображения jpeg
c) объектный программный код
d) в формате текстового файла
Критерии выставления оценки за практическую работу:
Оценка
Количество баллов
«5» (отлично)
25-30
«4» (хорошо)
20-24
«3» (удовлетворительно)
16-20
«2» (неудовлетворительно)
Менее 16
В 4 семестре в форме оценки выполнения этапов курсовой работы.
В процессе выполнения курсовых работ обучающиеся осваивают следующие компетенции и
личностные результаты: ПК 8.2, ПК 8.3, ОК 1. – ОК 10., ЛР 4, ЛР 9.
Выполнение курсовой работы решает задачи:
- изучение методических рекомендаций по выполнению работы;
- подбор и изучение информационных источников;
- составление плана курсовой работы;
- написание введения;
- составление теоретической главы курсовой работы;
- составление практической главы курсовой работы;
- написание заключения; - оформление курсовой работы;
- подготовка доклада и презентации.
Перечень тем курсовых проектов (работ):
1. Разработка дизайна сервиса для автоматизации работы корпоративной библиотеки
2. Разработка дизайна автоматизированной системы «База знаний» в организации

3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
20.
21.
22.
23.
24.

Создание дизайна информационного сайта для торговой компании
Разработка дизайна интернет – магазина компании
Разработка дизайна сайта на тему «Развлечения и отдых нашего города»
Разработка дизайна виртуального руководства по обслуживанию автомобиля
Разработка дизайна мобильного веб-приложения
Разработка дизайна электронного учебного пособия по программированию
Создание дизайна сайта – визитки предприятия
Разработка дизайна информационного регионального портала о футболе
Разработка дизайна интернет – приложения для проверки и учета студенческих работ
Создание дизайна информационного сайта компании
Разработка дизайна спортивного сайтов с результатами игр НХЛ и КХЛ
Разработка дизайна информационного Web-сайта о киноиндустрии
Создание дизайна сайта туристического агентства
Разработка дизайна системы оказания услуг для Интернет-провайдера
Разработка дизайна корпоративного портала с возможностью контроля за выполнением
проектов и работой удаленных сотрудников
Редизайн действующего веб-сайта, интернет-магазина 19. Разработка дизайна сайтафайлообменника.
Разработка дизайна сайта-форума.
Разработка дизайна поискового портала.
Разработка дизайна фотосайта.
Разработка дизайна музыкального сайта.
Разработка дизайна электронной библиотеки. 25. Разработка дизайна игрового web-сайта.

Критерии оценки выполнения курсового проекта (работы):
«Отлично» - самостоятельное выполнение курсового проекта (работы) в соответствии с
планом-графиком; работа соответствует заданию и выполнена в полном объеме; оформлена в
соответствии с методическими рекомендациями, отсутствуют грамматические ошибки.
Соблюдение регламента выступления, наличие презентации, оформленной в соответствии с
требованиями, полные и грамотные ответы на вопросы членов комиссии.
«Хорошо» - самостоятельное выполнение курсового проекта (работы) в соответствии с
планом-графиком; работа соответствует заданию и выполнена в полном объеме; присутствуют
недочеты в оформлении и грамматические ошибки. Соблюдение регламента выступления, наличие
презентации, оформленной в соответствии с требованиями, неполные ответы на вопросы членов
комиссии.
«Удовлетворительно» - выполнение курсового проекта (работы) не в соответствии с
планомграфиком; работа соответствует заданию и выполнена в полном объеме; присутствуют
недочеты в оформлении и грамматические ошибки. Не соблюдение регламента выступления,
наличие презентации, оформленной не в соответствии с требованиями, неполные ответы на вопросы
членов комиссии.
«Неудовлетворительно» - выполнение курсового проекта (работы) не в соответствии с планомграфиком; работа не соответствует заданию, присутствуют недочеты в оформлении и
грамматические ошибки. Отсутствие презентации.
В 5 семестре в форме экзамена Вопросы
к экзамену:
1.
Разновидности компьютерной графики. Сфера применения компьютерной
графики.
2.
Понятие растровой графики, достоинства и недостатки.

3.
Средства для работы с растровой графикой, источники получения растровых
изображений.
4.
Разрешение монитора. Разрешение принтера.
5.
Обзор растровых графических редакторов. Инструментальные средства
растровых редакторов.
6.
Векторная графика, достоинства и недостатки. Фрактальная графика.
7.
Средства создания векторных изображений. Структура векторной
иллюстрации.
8.
Понятие цветовой модели, типы цветовых моделей.
9.
Способы описания цвета, аддитивные цветовые модели. Ограничения RGB
модели.
10.
Субтрактивные цветовые модели, CMY CMYK. Ограничения модели CMYK.
11.
Цветовые режимы. Цветовые палитры.
12.
Форматы графических изображений, растровые форматы, векторные форматы.
13.
Алгоритмы сжатия растровых изображений.
14.
Работа с текстом, простой и фигурный текст в Illustrator.
15.
Графический редактор Photoshop: назначение, возможности, основные
характеристики.
16.
Инструменты выделения в Photoshop. Работа с выделениями.
17.
Слои, основные характеристики слоёв в Photoshop.
18.
Каналы в Photoshop, основы работы с альфа – каналами.
19.
Фильтры, основные характеристики фильтров в Photoshop.
20.
Цветовая и тоновая коррекция изображений.
21.
Инструменты ретуширования и корректировки изображений в Photoshop.
22.
Назначение и возможности трёхмерной графики.
23.
Интерфейс программы 3ds max. Окна проекций.
24.
Способы создания трехмерных объектов в 3ds max.
25.
Сплайны и модификаторы в 3ds max.
26.
Освещение. Виды источников освещения в 3ds max.
27.
Текстурирование в 3ds max. Основные материалы и карты. Редактор
материалов.
28.
Работа с кривыми в Illustrator.
29.
Эффекты и фильтры в Illustrator.
30.
Графический редактор Illustrator: назначение, возможности, основные
характеристики.
31.
Инструменты ретуширования и корректировки изображений в Illustrator.
32.
Инструменты выделения в Illustrator. Работа с выделениями.
33.
Слои, основные характеристики слоёв в Illustrator.
34.
Фильтры, основные характеристики фильтров в Illustrator.

Оценка
«5» (отлично)
«4» (хорошо)
«3» (удовлетворительно)
«2» (неудовлетворительно)

Критерии выставления оценки
Количество баллов
30-34
24-29
18-23
Менее 18

3.3

МДК.08.03 Решение комплексных задач по модулю 08

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

3.3.2. Оценка текущей аттестации
Тема 08.03.01 Решение комплексных задач по модулю 08. (7 семестр)
Задание
Разработать сайт по образцу

Критерии выставления оценки за практическую работу:
Оценка
«5»
(отлично)

Обобщенность
Ответ должен быть
самостоятельным

«4» (хорошо)

Составленный дизайн полностью соответствует образцу.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Владение терминологией.

Ответ может быть
самостоятельным,
с
подсказками
преподавателя

«3»
(удовлетворите
льно)

Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя

«2»
(неудовлетвори
тельно)

Тема 08.03.01 Решение комплексных задач по модулю 08. (8 семестр)
Задание
Разработать сайт по образцу

Отсутствует порядок в
проведении анализа

Критерии выставления оценки за практическую работу:
Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Обобщенность
Ответ должен быть
самостоятельным

3.3.3. Оценка промежуточной аттестации
Тема 08.03.01 Решение комплексных задач по модулю 08. (7 семестр) Промежуточной
аттестацией 7 семестра являются «Другие формы контроля».
Задание
Описание предметной области:
Портал сознательных граждан «Нарушениям.Нет» представляет собой информационную
систему для помощи полиции по своевременной фиксации нарушений правил дорожного движения.
Перед тем как впервые воспользоваться услугами портала гражданин должен
зарегистрироваться. В ходе регистрации он указывает данные о себе (ФИО, телефон, адрес
электронной почты), логин и пароль.
Войдя в систему, гражданин может сформировать заявление, указав номер автомобиля и
описание нарушения.
Заявления граждан хранятся в системе. В каждой заявке описание, номер автомобиля и статус
заявки (новое, подтверждено или отклонено).

Оценка
«5»
(отлично)

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

быть
без

Ответ
может
быть
«4» (хорошо) Составленный
дизайн
полностью
самостоятельным,
с
соответствует
образцу.
Код
наводящими
вопросами
валидный, соответствует HTML5.
преподавателя
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Владение терминологией.
«3»
Составленный
дизайн
не
полностью Ответ не самостоятельный, с
(удовлетвор соответствует образцу. Код не валидный, наводящими вопросами
преподавателя
ительно)
соответствует HTML5. Отсутствуют
комментарии в коде. Не использованы flex и grid
технологии.
Нет четкости в изложении вопроса и ответа.
«2»
Составленный дизайн не соответствует Отсутствует
ответ на
(неудовлетв образцу. Код не валидный, не соответствует поставленный вопрос.
орительно)
HTML5. Отсутствуют комментарии в коде. Не
использованы flex и grid технологии.
Отсутствие
знаний
профессиональной
терминологии. Не сделан вывод по работе.
Тема 08.03.01 Решение комплексных задач по модулю 08. (8 семестр)
Промежуточной аттестацией 8 семестра являются «Другие формы контроля».
Задание
Основной
функционал
информационной
системы:
1.
Страница
регистрации.
На
данной
странице необходимо предусмотреть добавление
пользователя
в
систему.
Пользователю
необходимо предоставить возможность ввести
логин, пароль, ФИО, телефон и адрес электронной
почты.
По
кнопке
«Зарегистрироваться»
пользователь должен заноситься в базу.
2.
Страница
авторизации.
На
данной
странице
необходимо
предусмотреть
возможность
ввода
логина
и
пароля
для
зарегистрированных
пользователей.
Попытки
некорректного ввода логина и пароля должны
сопровождаться сообщениями.
3.
Страница заявлений. На данной странице
авторизованный
пользователь
имеет
возможность просмотреть свои заявления со
статусами, а также оставить новое заявление.
4.
Страница
формирования
заявления.
Гражданин указывает:
государственный
регистрационный
номер
автомобиля и описание нарушения.
5.
Панель администратора. Доступ в панель
администратора осуществляется по логину copp и

паролю password. В панели администратора видны все
заявления (ФИО подавшего, описание нарушения,
номер
автомобиля
и
статус
заявления).
Администратор может сменить статус заявления.
Критерии выставления оценки за практическую работу:
Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Обобщенность
Ответ должен быть
самостоятельным

Ответ
может
быть
самостоятельным, с
подсказками
преподавателя
Ответ не
самостоятельный,
с
наводящими вопросами
преподавателя
Отсутствует порядок в
проведении анализа

3.4

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

Промежуточная аттестация по учебной практике во всех семестрах осуществляется в форме
дифференцированного зачета.

Основное задание учебной практики заключается в реализации дизайна сайта.
Тематика сайта меняется ежегодно и согласуется на собрании методического объединения.
Структура задания остается без изменения.

Примерное задание для проведения промежуточной аттестации (4 семестр):
Вам

необходимо

разработать

дизайн

страницы

портала

сознательных

граждан

«Нарушениям.Нет».
Дизайн можно представить в виде файлов изображений .png, либо в виде .html файлов.
Описание предметной области:
Портал сознательных граждан «Нарушениям.Нет» представляет собой информационную
систему для помощи полиции по своевременной фиксации нарушений правил дорожного движения.
Структура страницы должна отвечать требованиям:
1.

Наличие «шапки» сайта с названием и логотипом

Наличие навигационного меню

Наличие основного контента сайта (описание назначение портала, памяткой

профилактики нарушений правил дорожного движения, 2-3 фотографии)
4.

Наличие «подвала» сайта с логотипом, названием сайта и годом разработки.

Критерии выставления оценки промежуточной аттестации по учебной практики 4 семестр:
Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

Полная, системность, прочность знаний,
Составленный дизайн полностью соответствует заданию.
Код валидный, соответствует HTML5.
Имеются комментарии в коде.
Использованы flex и grid технологии.
Владение профессиональной терминологией.
Составленный дизайн полностью соответствует заданию.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Владение терминологией.
Составленный дизайн не полностью соответствует заданию. Код
не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Нет четкости в изложении вопроса и ответа.

Обобщенность
Ответ должен быть
самостоятельным, без
наводящих вопросов
преподавателя
Ответ может быть
самостоятельным, с
наводящими
вопросами
преподавателя
Ответ не
самостоятельный,
с наводящими
вопросами
преподавателя

«2»
(неудовлетвори
тельно)

Составленный дизайн не соответствует заданию.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Отсутствует ответ на
поставленный вопрос.

Примерное задание для проведения промежуточной аттестации (5 семестр):
Вам дам дизайн-шаблон страницы портала сознательных граждан «Нарушениям.Нет».
Вам необходимо также разработать дизайн страницы для использования со смартфоном с
разрешением 390x844 px и для использования с планшетом с разрешением 1024х960. Дизайн можно
представить в виде .html файлов.
Описание предметной области:
Портал сознательных граждан «Нарушениям.Нет» представляет собой информационную
систему для помощи полиции по своевременной фиксации нарушений правил дорожного движения.
Структура страницы должна отвечать требованиям:
1.

Наличие «шапки» сайта с названием и логотипом

Наличие навигационного меню. В случае работы со смартфон и планшет –

версий меню должно быть собрано в бургер-меню.
3.

Наличие анимационного баннера или слайдера на странице.

Наличие основного контента сайта (описание назначение портала, памяткой

профилактики нарушений правил дорожного движения, 2-3 фотографии)
5.

Наличие «подвала» сайта с логотипом, названием сайта и годом разработки.

Критерии выставления оценки промежуточной аттестации по учебной практики 5 семестр:
Оценка
«5»
(отлично)

«4» (хорошо)

Полная, системность, прочность знаний,
Составленный дизайн полностью соответствует заданию.
Код валидный, соответствует HTML5.
Имеются комментарии в коде.
Использованы flex и grid технологии.
Использована анимация, реализованная на языке программирования
JavaScript или библиотеке JQuery. (работает без ошибок в консоли).
Владение профессиональной терминологией.
Составленный дизайн полностью соответствует заданию.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Использована анимация, реализованная на языке программирования
JavaScript или библиотеке JQuery. (работает с ошибками в консоли).
Владение терминологией.

Обобщенность
Ответ должен быть
самостоятельным, без
наводящих вопросов
преподавателя

Ответ может быть
самостоятельным, с
наводящими
вопросами
преподавателя

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Составленный дизайн не полностью соответствует заданию. Код
не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Использована анимация, реализованная на CSS.
Нет четкости в изложении вопроса и ответа.
Составленный дизайн не соответствует заданию.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствует анимация.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Ответ не
самостоятельный,
с наводящими
вопросами
преподавателя
Отсутствует ответ на
поставленный вопрос.

Примерное задание для проведения промежуточной аттестации (7 семестр):
Вам необходимо разработать wireframe, mockup и дизайн страниц портала сознательных
граждан «Нарушениям.Нет».
Вам необходимо также разработать дизайн страницы для использования со смартфоном с
разрешением 390x844 px и для использования с планшетом с разрешением 1024х960. Дизайн должен
быть представлен в виде файлов изображений .png (отдельное изображение для каждой страницы)
и в виде .html файлов (отдельный файл для каждой страницы).
Описание предметной области:
Портал сознательных граждан «Нарушениям.Нет» представляет собой информационную
систему для помощи полиции по своевременной фиксации нарушений правил дорожного движения.
Перед

тем

как

впервые

воспользоваться

услугами

портала

гражданин

должен

зарегистрироваться. В ходе регистрации он указывает данные о себе (ФИО, телефон, адрес
электронной почты), логин и пароль.
Войдя в систему, гражданин может сформировать заявление, указав номер автомобиля и
описание нарушения.
Заявления граждан хранятся в системе. В каждой заявке описание, номер автомобиля и статус
заявки (новое, подтверждено или отклонено).
После подачи заявления администратор может подтвердить или отклонить заявления.
Основные страницы информационной системы:
1.

Страница регистрации. На данной странице необходимо предусмотреть добавление

пользователя в систему. Пользователю необходимо предоставить возможность ввести логин,
пароль, ФИО, телефон и адрес электронной почты, наличие кнопки «Зарегистрироваться».

Страница авторизации. На данной странице необходимо предусмотреть возможность

ввода логина и пароля. Попытки некорректного ввода логина и пароля должны сопровождаться
сообщениями.
3.

Страница заявлений. На данной странице авторизованный пользователь имеет

возможность просмотреть заявления со статусами, а также оставить новое заявление.
4.

Страница

формирования

заявления.

Гражданин

указывает:

государственный

регистрационный номер автомобиля и описание нарушения.
5.

Панель администратора. В панели администратора видны все заявления (ФИО

подавшего, описание нарушения, номер автомобиля и статус заявления). Администратор может
сменить статус на подтверждено или отклонено.
Структура страниц должна отвечать требованиям:
1.

Наличие «шапки» сайта с названием и логотипом

Наличие навигационного меню. В случае работы со смартфон и планшет –

версий меню должно быть собрано в бургер-меню.
3.

Наличие анимационного баннера или слайдера на странице.

Наличие основного контента сайта (в зависимости от страницы)

Наличие «подвала» сайта с логотипом, названием сайта и годом разработки.

Сайт должен быть размещен на учебной хостинге.
Отчет по работе демонстрируется с презентацией и публичным выступлением.
Критерии выставления оценки промежуточной аттестации по учебной практики 7 семестр:
Оценка
«5»
(отлично)

Обобщенность
Ответ должен быть
самостоятельным, без
наводящих вопросов
преподавателя

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

Составлен wireframe.
Составлен mockup.
Составленный дизайн полностью соответствует заданию, wireframe и
mockup с незначительными изменениями.
Все страницы реализованы.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Использована анимация, реализованная на языке программирования
JavaScript или библиотеке JQuery. (работает с ошибками в консоли).
Проведена защита работы.
Владение терминологией.
Составлен wireframe.
Составлен mockup.
Составленный дизайн не соответствует заданию, wireframe и mockup.
Все страницы реализованы.
Код не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Использована анимация, реализованная на CSS.
Проведена защита работы.
Нет четкости в изложении вопроса и ответа.
Составлен wireframe.
Составлен mockup.
Составленный дизайн не соответствует заданию, wireframe и mockup.
Реализованы не все страницы.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствует анимация.
Проведена защита работы.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Ответ может быть
самостоятельным, с
наводящими
вопросами
преподавателя

Ответ не
самостоятельный,
с наводящими
вопросами
преподавателя

Отсутствует ответ на
поставленный вопрос.

Примерное задание для проведения промежуточной аттестации (8 семестр):
Вам необходимо разработать wireframe, mockup и дизайн страниц портала сознательных
граждан «Нарушениям.Нет».
Вам необходимо также разработать дизайн страницы для использования со смартфоном с
разрешением 390x844 px и для использования с планшетом с разрешением 1024х960. Дизайн должен
быть представлен в виде файлов изображений .png (отдельное изображение для каждой страницы)
и в виде .html файлов (отдельный файл для каждой страницы).
Описание предметной области:
Портал сознательных граждан «Нарушениям.Нет» представляет собой информационную
систему для помощи полиции по своевременной фиксации нарушений правил дорожного движения.

Перед

тем

как

впервые

воспользоваться

услугами

портала

гражданин

должен

Страница регистрации. На данной странице необходимо предусмотреть добавление

пользователя в систему. Пользователю необходимо предоставить возможность ввести уникальный
логин, пароль (минимум 6 символов), ФИО (символы кириллицы и пробелы), телефон (в формате
+7(XXX)-XXX-XX-XX) и адрес электронной почты (формат электронной почты). Все поля
обязательны для заполнения. Ошибки валидации должны отображаться на форме, наличие кнопки
«Зарегистрироваться».
2.

Страница авторизации. На данной странице необходимо предусмотреть возможность

ввода логина и пароля. Попытки некорректного ввода логина и пароля должны сопровождаться
сообщениями.
3.

Страница заявлений. На данной странице авторизованный пользователь имеет

возможность просмотреть заявления со статусами, а также оставить новое заявление.
4.

Страница

формирования

заявления.

Гражданин

указывает:

государственный

регистрационный номер автомобиля и описание нарушения.
5.

Панель администратора. В панели администратора видны все заявления (ФИО

Наличие навигационного меню. В случае работы со смартфон и планшет – версий
меню должно быть собрано в бургер-меню.

Наличие анимационного баннера или слайдера на странице.

Наличие основного контента сайта (в зависимости от страницы)

Наличие «подвала» сайта с логотипом, названием сайта и годом разработки. Сайт
должен быть размещен на учебной хостинге. Отчет по работе демонстрируется
с презентацией и публичным выступлением.

Критерии выставления оценки промежуточной аттестации по учебной практики 8 семестр:
Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

3.5

Полная, системность, прочность знаний,
Составлен wireframe.
Составлен mockup.
Составленный дизайн полностью соответствует заданию, wireframe и
mockup.
Все страницы реализованы.
Код валидный, соответствует HTML5.
Имеются комментарии в коде.
Использованы flex и grid технологии.
Использована анимация, реализованная на языке программирования
JavaScript или библиотеке JQuery. (работает без ошибок в консоли).
Проведена защита работы.
Владение профессиональной терминологией.
Составлен wireframe.
Составлен mockup.
Составленный дизайн полностью соответствует заданию, wireframe и
mockup с незначительными изменениями.
Все страницы реализованы.
Код валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Использованы flex и grid технологии.
Использована анимация, реализованная на языке программирования
JavaScript или библиотеке JQuery. (работает с ошибками в консоли).
Проведена защита работы.
Владение терминологией.
Составлен wireframe.
Составлен mockup.
Составленный дизайн не соответствует заданию, wireframe и mockup.
Все страницы реализованы.
Код не валидный, соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Использована анимация, реализованная на CSS.
Проведена защита работы.
Нет четкости в изложении вопроса и ответа.
Составлен wireframe.
Составлен mockup.
Составленный дизайн не соответствует заданию, wireframe и mockup.
Реализованы не все страницы.
Код не валидный, не соответствует HTML5.
Отсутствуют комментарии в коде.
Не использованы flex и grid технологии.
Отсутствует анимация.
Проведена защита работы.
Отсутствие знаний профессиональной терминологии.
Не сделан вывод по работе.

Обобщенность
Ответ должен быть
самостоятельным, без
наводящих вопросов
преподавателя

Ответ может быть
самостоятельным, с
наводящими
вопросами
преподавателя

Ответ не
самостоятельный,
с наводящими
вопросами
преподавателя

Отсутствует ответ на
поставленный вопрос.

ПП.08 Производственная практика

Дифференцированный зачет по производственной практике выставляется на основании
данных аттестационного листа (характеристики профессиональной деятельности студента на
практике) с указанием видов работ, выполненных обучающимся во время практики, их объема,

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

Титульный лист

Лист-задание на практику

1. Общая часть

2. Практическая часть

Вывод по практике

Общая часть описывает предприятие:
-

краткая информация о предприятии;

организационная структура предприятия (схема), с описанием должностей и их

обязанностей;
-

описание рабочего места практиканта;

описание

установленного

аппаратного

обеспечения

рабочего

места

практиканта, с разбиением на классы аппаратуры (например: устройства ввода-выводы,
системные компоненты, периферийное оборудование и т.д.);
-

описание программного обеспечения рабочего места практиканта с указанием

типа программного обеспечения (например: графические редакторы, текстовые редакторы,
текстовые процессоры, специализированное программное обеспечение предприятия и т.д.);
-

провести анализ текущего сайта предприятия (указание доменного имени,

хостинга, используемых технологий построения сайта);
-

краткое

(разработанных

для

описание

специализированных

программ

данного предприятия) (ЕСЛИ ЕСТЬ).

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

Построение эскиза

Вёрстка шаблона

Программирование шаблона

Наполнение страницы контентом

Тестирование страницы на доступность и функционал

В выводе по практике указываются выполненные задания, результат выполнения, возникшие
проблемы и пути решения проблем, не выполненные задачи.

Критерии выставления оценки промежуточной аттестации по производственной практике:
Оценка
«5»
(отлично)

«4» (хорошо)

«3»
(удовлетворите
льно)

«2»
(неудовлетвори
тельно)

3.6

Полная, системность, прочность знаний,
Соблюден план-график практики.
Оформлен отчет по итогам практик.
Отчет соответствует требованиям оформления.
Выступание-защита отвечает требованиям.
Соблюден план-график практики.
Оформлен отчет по итогам практик.
Отчет соответствует требованиям оформления с не значительными
ошибками.
Выступание-защита отвечает требованиям.
Соблюден план-график практики.
Оформлен отчет по итогам практик.
Отчет не соответствует требованиям оформления.
Выступание-защита не отвечает требованиям.
Нарушен план-график практики.
Отчет не сформирован по итогам практик.
Отчет не соответствует требованиям оформления.
Выступание-защита не отвечает требованиям.

Экзамен по модулю

К экзамену по профессиональному модулю допускаются обучающиеся, полностью
выполнившие все практические работы/задания в рамках междисциплинарных курсов, прошедших
учебную и производственную практику в полном объеме, и, имеющие положительные оценки по
результатам

текущего

контроля

промежуточного

контроля,

освоивших

общие

профессиональные компетенции.

Примерное задание экзамена по модулю
Необходимо разработать Landing Page отображающий суть праздника 9 мая (День Победы)
и рассказывающий о мероприятиях, которые должны пройти в Кемеровской области в рамках 2024
года.
Landing Page должен иметь следующую структуру:
1.

Первый экран. Должен содержать: шапку с логотипом, меню, адресом и контактами.

Шапка должна быть зафиксирована в верхней части экрана. Для тезисного описания функционала

и назначения данного веб-ресурса необходимо привязать 3-4 баннера и оформить их в виде
слайдера. При наведении курсора на слайдер он должен останавливаться.
2.

Второй экран. Должен содержать информацию о празднике, кратким тестовым

описанием и возможностью прочитать подробнее о важных событиях праздника. При нажатии на
кнопку Подробнее должно открываться модальное окно с описанием (не более 3-4-х предложений)
и кнопкой закрытия.
3.

Третий экран. Содержит информацию о предстоящих мероприятиях.

Четвертый экран. Содержит форму обратной связи по вопросам мероприятий.

Выбор мероприятия должен реализоваться в формате выпадающего списка. На форме должны
находиться кнопки Очистить форму (или Отменить), Заказать звонок, Закрыть. Предусмотреть
проверку заполнения полей формы.
5.

Пятый экран. Должен содержать футер с копирайтом, логотипом, навигацией,

контактной информацией, ссылкой на социальные сети, кнопкой Вверх.
На каждом экране должны присутствовать ссылки якори. Предусмотреть адаптивный дизайн
и использовать адаптивную верстку. Ресурс должен одинаково хорошо демонстрироваться на
экране компьютера, планшета, смартфона, что гарантирует полноценный охват аудитории.
Необходимо разработать каркасную модель (Wireframe) и дизайн-макеты Landing Page под
десктоп, планшет и смартфон.
В папке «Ресурсы» содержится тестовое наполнение Landing Page, а также другая
текстовографическая информация, полезная в процессе разработки сайта. Нет необходимости
использовать все предоставленные материалы.
По итогу работы вы должны получить:
1.

Каркасная модель графического интерфейса (wireframe). Данная модель

должна учитывать все экраны, наличие модальных окон и каркасные модели под адаптив.
2.

Дизайн-макеты сайта:

2.1. Макеты дизайна каждого экрана Landing Page под десктоп, смартфон и планшет должны
состоять из нескольких файлов (в формате используемого приложения и предпросмотр в формате
.png или .jpg).
•

Макет под смартфоны — должен отражать схему отображения страниц при ширине

экрана 320-767 пикселей.
•

Макет под планшеты – должен отражать схему отображения страниц при ширине

экрана 768-1279 пикселей.
•

Макет под настольные компьютеры и ноутбуки — должен отражать схему

отображения страниц при ширине экрана 1280 пикселей и более.

Свёрстанные страницы в формате .html

Пояснения к работе
1.
На главном экране каркасной модели и макетов дизайна сайта должно быть четко
видно, что в верстке должен настраиваться слайдер.
2.

Сверстать

дизайн

макеты

страниц

сайта

использованием

современного

технологического стека разработки: HTML5, CSS3, JavaScript.
3.

При разработке допускается использовать техники, методы, библиотеки и

фреймворки, упрощающие разработку на каждом из описанных уровней, например, Bootstrap, Less,
Sass (SCSS), jQuery, Angular, или какое-либо другое расширение стека.
4.

Работа должна состоять из набора html, css, js-файлов, изображений, а также других

файлов необходимых для корректного отображения Landing Page в браузерах.
5.

Код максимально насколько это возможно должен соответствовать спецификации

стандартов HTML5 и CSS3. Для установления соответствия экспертами будет использован
официальный инструмент проверки validator.w3.org. Любое отклонение от стандартов должно быть
обоснованно в комментариях непосредственно перед или сразу после места отхождения от
спецификации.
6.

Необходимо обеспечить адаптивность и кроссбраузерность. Полученные в результате

верстки страницы должны соответствовать макетам, одинаково адекватно отображаться и работать
в последних версиях браузеров Chrome, FireFox, Opera, Edge.
Максимальный
балл
Разработана каркасная модель, которая полностью соответствует техническому заданию (на сайте
15
присутствует вся информация из общей структуры данных). (штраф за отсутствие экрана 3б.)
Предусмотрены модальные окна.
5
Разработаны дизайн-макеты всех страниц сайта.
5
Дизайн-макеты страниц созданы по ранее разработанной каркасной модели
5
Присутствуют макеты адаптации страниц под смартфоны и планшеты (штраф 2,5 б. если нет одного
15
варианта)
Макеты страниц разработаны по принципу единообразия.
10
Дизайн сайта привлекателен, эргономичен и понятен.
10
Валидный код HTML5 (отнимать 2 балла за каждый тип ошибки)
5
Сверстанные страницы полностью соответствуют, ранее созданным дизайн-макетам (штраф за
10
отсутствие блока 2 б.)
На страницах присутствуют ссылки как внутренние, так и внешние, применяются hover-эффекты с
5
элементами анимации, используются модальные окна.
Все стили вынесены в отдельные CSS-файлы В верстке не используется атрибут style, а также
5
другие атрибуты, идентичные CSS свойствам.
Отображения сверстанных блоков идентичны при просмотре в последних версиях браузеров
5
Chrome, Opera, Firefox, Edge.
Общее впечатление о верстке макета
5
Итого:
100
Показатель критерия

Таблица перевода результата экзамена по модулю (квалификационному)
Оценка
«5» (отлично)
«4» (хорошо)
«3» (удовлетворительно)
«2» (неудовлетворительно)

Количество баллов
80 – 100
60 – 79
40 – 59
< 40