Разрешенные JS-библиотеки: jQuery, jQuery UI. JavaScript фреймворки запрещены.




Открытый отборочный чемпионат ФГАОУ «Тюменский государственный университет» по стандартам Ворлдскиллс

Описание задания компетенции «Веб-дизайн»

 

Задание состоит из четырех обязательных (на 2 полных дня). При этом в течении дня конкурсант выполняет одно задание, состоящее из двух модулей. Нарушать порядок выполнения модулей в рамках одного дня нельзя.

 

Задания построены с учетом WSSS:

 

l Организация работы и управление (WSSS 6%)

l Коммуникативные и межличностные навыки (WSSS 6%)

l Графический дизайн веб-страниц (WSSS 22%)

l Верстка страниц (WS

l SS 22%)

l Программирование на стороне клиента (WSSS 22%)

l Программирование на стороне сервера (WSSS 14%)

l Системы управления контентом (Content management systems) (WSSS 8%)

 

Задание первого дня (Дизайн и верстка + JavaScript + PHP)

 

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

HTML и CSS код должны быть валидными. Создаваемые файлы должны структурированы и содержать комментарии. PHP и JS код должен выполняться без отображения ошибок, в т.ч. в консоли браузера.

Браузером для проверки основных функциональных возможностей является Mozilla Firefox Developer Edition. Однако работа приложения будет также проверена в браузере Google Chrome для проверки кроссбраузерности программы.

 

l стартовый экран - содержит наименование игры, поле ввода своего имени, а также кнопку “Начать игру”. Имя не может быть пустым. Кнопка “Начать игру” активна, если только введено имя пользователя.

l экран игры - интерфейс должен содержать:

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

 блок с заработанными баллами - количество заработанных игроком баллов за текущую игру. Обнуляется при начале новой игры.

 блок с именем игрока - если игрок на стартовом экране в имени ввел “terter” то имя пользователя должно отображаться по другому, так как это “кодовое” слово для игры в тестовом режиме.

 игровое поле - в зависимости от выбранной экспертами игры. Процесс игры должен включать в себя взаимодействия пользователя и компьютера и протекать без обновления страницы

l экран окончания игры - содержит таблицу результатов с первыми 10 лучшими результатами. Если игрок по баллам не вошел в 10 лучших, то вместо 10 места показывается его результат с указанием места в таблице рекордов.

 

Модуль 1 (3 часа)

 

В данном модуле необходимо решить следующие задачи:

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

l Верстка стартового экрана, игрового поля и экрана окончания игры

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

l Разработка анимации элементов управления

 

Модуль 2 (3 часа)

 

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

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

l Таймер обратного отсчета - начинает обратный отсчет с началом игры, как только доходит до значения 00:00 игра заканчивается.

l Таблица рекордов - показывает 10 лучших результатов игры. Если игрок не вошел в 10 лучших его результат показывает вместо 10 результата, с указанием его места в таблице рекордов.

l Сохранение итоговых результатов в базу данных на стороне сервера. Участнику предоставляется готовая структура базы данных(дамп таблицы), с которой он должен работать. Изменять структуру нельзя.

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

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

Разрешенные JS-библиотеки: jQuery, jQuery UI. JavaScript фреймворки запрещены.

 

В приведенной ниже таблице описывается, как распределяются баллы относительно разделов WSSS:

WSSS SECTION Описание Баллы
  Work organization and management  
  Communication and interpersonal skills  
  Website design  
  Website layout  
  Client side development  
  Server side development  
  Content management systems  
Итого    

Задание второго дня (PHP + JavaScript)

В данном задании участнику необходимо реализовать сервис по записи на услугу (кинотеатр, парикмахерская, автосервис и т.д.) Участнику дается готовый макет, который ему необходимо использовать. Использование PHP Framework по желанию участника. Также разрешено использование Jquery, Jquery UI.

HTML и CSS код должны быть валидными. Создаваемые файлы должны структурированы и содержать комментарии. PHP и JS код должен выполняться без отображения ошибок, в т.ч. в консоли браузера.

Работа будет проверяться в браузере Google Chrome.

Модуль 3 (3 часа)

 

Необходимо реализовать указанный функционал:

l Регистрация - Содержит следующие поля (все поля валидируются на стороне клиента:

 ФИО - содержит только кириллицу без цифр и знаков препинания.

 E-mail - валидируется на соответствие шаблону e-mail адресов

 Логин - должен быть уникальным

 Пароль - должен содержать не менее 6 символов английской раскладки, верхнего и нижнего регистра

 Подтверждение пароля - должно совпадать с полем Пароль

 Изображение пользователя (аватар) в указанном формате и ограничением по размеру

 кнопка Зарегистрироваться.

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

l Авторизация - после авторизации простого пользователя должно отправлять в личный кабинет, а администратора в панель управления сайтом. Логин администратора: admin, пароль: wsr2018.При успешной авторизации пользователя перенаправляет на страницу просмотра своих записей на услуги.

l Панель управления сайтом - страница доступная по адресу <сайт>/admin
панель управления сайтом доступна только администратору

Разделы пользователя:

l Просмотр услуг с фильтром (активна, прошла, нет мест)

l Записи на услугу

l Просмотр своих записей на услугу

l Отмена записи (не позднее 1 дня до срока оказания услуги)

Разделы администратора:

l Добавление услуги (с указанием количества доступных для записи мест)

l Просмотр записей на услугу

l Удаление записей на услугу

l Запрет удаления услуги, если на неё уже есть запись

l Запрет записи на услугу с прошедшей датой

 

 

Модуль 4 (3 часа)

 

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

l Пагинация страницы с услугами.

l Поиск по услугам с автодополнением (подсказки при наборе текста) слов в поиске (ajax).

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

l Улучшение дизайна, учитывая целевую аудиторию.

l Создание логотипа.

 

 

Разрешенные PHP-фреймворки: Yii2 (basic), Laravel 5.

 

В приведенной ниже таблице описывается, как распределяются баллы относительно разделов WSSS:

WSSS SECTION Описание Баллы
  Work organization and management  
  Communication and interpersonal skills  
  Website design  
  Website layout  
  Client side development  
  Server side development  
  Content management systems  
Итого    

 



Поделиться:




Поиск по сайту

©2015-2024 poisk-ru.ru
Все права принадлежать их авторам. Данный сайт не претендует на авторства, а предоставляет бесплатное использование.
Дата создания страницы: 2019-04-29 Нарушение авторских прав и Нарушение персональных данных


Поиск по сайту: