2018年山东省高职组“HTML5交互融媒体内容设计与制作”赛项任务书

第第页共25页第一部分竞赛须知一、竞赛要求1、按要求完成竞赛任务，正确使用计算机、手机等设备，爱惜赛场器材，严格遵守操作要求；2、竞赛过程中如有异议，可向现场监督或裁判人员反映，不得扰乱赛场秩序；3、严格遵守赛场纪律，禁止任何作弊行为，尊重赛场工作人员，服从安排。二、职业素养与安全意识1、参赛选手组内讨论应尽可能降低音量，禁止大声喧嚷，未经裁判允许，不得站立、走动，保证竞赛现场秩序；2、参赛选手所有操作均应符合安全规范，注意用电安全。三、选手须知1、纸质任务书如出现缺页、字迹不清等问题，请及时向裁判举手示意并要求更换。竞赛任务中所使用的非纸质资料都已拷贝至U盘中，请自行根据竞赛任务书要求使用；竞赛提供的所有资料，在竞赛结束后均不能带离考场；2、参赛小组应在规定时间内完成任务书要求的内容，任务完成后的作品必须按要求提交，作品未按要求提交的，则该任务不得分；3、竞赛过程中，选手认定设备或网络有故障应及时向裁判提出，竞赛后再提出的，不予认定。如设备或网络经测定完好，属误判时，设备或网络的认定时间计入竞赛时间（扣减该小组竞赛时间）；如果设备或网络经测定确有故障，则当场更换设备或维修网络，此过程中（设备或网络测定开始到更换完成）造成的时间损失，在竞赛时间结束后，酌情对该小组进行等量的时间延迟补偿；4、参赛选手竞赛过程中，请及时保存任务中间成果。因任务中间成果未及时保存，遇设备或网络故障导致前续工作结果丢失的，将仅对更换设备或网络造成的时间损失进行等量的时间延迟补偿；5、竞赛过程中由于人为原因造成设备损坏，则设备不予更换，如故意损坏竞赛设备的，应承担相应的赔偿责任；6、竞赛过程中由于自身人为原因造成网络中断，则网络修复的时间计入竞赛时间（扣减该小组竞赛时间）；7、参赛选手提交的作品内容中不得出现个人、团队及学校等标识信息，如有发现则竞赛成绩记为0分；8、在裁判组宣布竞赛开始前，选手不得对任务书、竞赛设备、纸、笔进行任何操作，在裁判组宣布竞赛结束后，参赛选手必须立即停止对计算机等竞赛设备的任何操作；9、档案袋中提供的三张白纸不得随意撕毁、标记任何团队信息，竞赛结束后须放回档案袋；10、在裁判组宣布竞赛结束后，参赛选手须将原档案袋中物品放回档案袋，其他竞赛设备放置到初始位置，并按裁判要求顺序离场。第二部分竞赛环境简介一、竞赛环境1、硬件环境（每个参赛小组）序号设备名称单位数量备注1手机部1去掉卡槽、带耳机2计算机台3带耳机3工作台套3桌、椅2、软件环境软件类型软件名称软件版本说明操作系统Windows64位Win7HTML5内容设计与制作软件北测—HTML5交互融媒体内容制作实训平台2017版浏览器GoogleChrome浏览器2017版网络环境基于以太网技术的局域网环境。二、注意事项1、竞赛开始时，参赛选手须检查北测－HTML5交互融媒体内容制作实训平台（下称“北测-H5平台”）账号登录、使用操作是否正常，如认定有故障应及时向裁判提出，竞赛后再提出的，不予认定。如经测定正常，属误判时，则认定时间计入竞赛时间（扣减该小组竞赛时间）；如果经测定确有故障，则当场修复，此过程中（测定开始到修复完成）造成的时间损失，在竞赛时间结束后，酌情对该小组进行等量的时间延迟补偿；2、竞赛过程中，请务必严格按照任务书要求对各竞赛设备进行操作使用，随意操作可能会出现作品不能正常制作、预览或提交的情况；3、竞赛任务完成后，请务必不要关闭任何竞赛设备，不要拆卸、移动竞赛设备的网络连接，不要对文件和设备进行加密。第三部分竞赛任务选题背景：中华好诗词。 古往今来，圣贤先哲、仁人志士都是传承和弘扬中华诗词文化的典范。2014年教师节，习近平总书记提出：我很不赞成把古代经典诗词和散文从课本中去掉，“去中国化”是很悲哀的。应该把这些经典嵌在学生脑子里，成为中华民族文化的基因。开展校园诗教，传承诗词文化，是时代的呼唤，是民族精神的需要，也是弘扬社会主义核心价值观的需要。 古诗是中华民族历史长河中一颗璀璨的明珠，它凝炼含蓄的语言，深邃的意境，倍受人们喜爱。它以简炼形象的语言生动地描绘了一幅幅色彩明丽、动静相宜的画面，创设了优美的意境，读来朗朗上口，千百年来脍炙人口的古诗在民间广为流传众所周知,古诗由于时空跨度较大,与学生的现实生活、个人情感体验有一定的距离,所以很难入情入境，与诗人难以产生共鸣，因此古诗教学一直是小学阅读教学的一大难点，再加之，语文教师对古诗教学或重视不够，或觉得无从下手，使得古诗教学长期处于停滞状态，仅仅成了试卷上的一个得分点，古典诗词是传统文化的精品，是中华民族精神文化的凝结体。所以曾经有人把中国传统文化直接叫做"诗的文化"。可以说，所有古典文明的精华都包容、凝结在古典诗词作品里。然而，在西方现代文明影响之下，在"全球化"发展的今天，中国的古典文明正面临着被进一步"边缘化"的危机。危机与希望并存，现实与传统共在。传承古典诗词，弘扬传统文化是我们所有人义不容辞的责任。备注：任务一和任务二是两个独立的任务，特此说明！任务描述任务一：分镜图文脚本设计部分1.任务主题主题：“中华好诗词”图文脚本设计分析题目并编写创意说明文档，利用“中华好诗词”文件夹所提供的图片素材元素编写完整分镜脚本，使作品起到宣传“赏中华诗词、寻文化基因、品生活之美”的作用，展现中国传统诗词文化的渊源、绚烂、魅力。2.任务内容根据“中华好诗词”的背景描述，请以“中华好诗词”为题，设计1个以中国传统诗词文化为主题的H5图文脚本，且不得抄袭任务二分镜图文脚本相关内容。在北测－H5平台“脚本设计”工具内的第一页编写不少于100字的创意说明，要求创意说明中至少包括“主题分析”、“详细描述”的相关描述。。根据创意说明，使用U盘“赛题要求\任务一\脚本设计图片素材\”目录下的图片素材，设计组合成分镜图文脚本，同时在分镜脚本中用文字注明动画运动方式、移动交互方式等内容。3.任务要求根据主题分析和任务内容，编写策划H5内容设计文档，设计文档要求如下：创意说明要求:1）主题：必须围绕任务一素材涉及的图文与宣传内容进行设计；2）概述：应该阐明作品整体设计理念及其宣传效果与用户体验等；3）详细描述：应该包括创意亮点，动画、交互、逻辑等特点以及音效配合等；4）文字表述：清晰、简练，不能超出脚本指定的输入框，不能出现错别字。图文脚本设计要求：1）页面：图文脚本页面应包括加载页、首页、选择题页、结果页，页面数量不能少于6页、不能超出10页；2）页号：页号顺序号不能标错；3）文案：每页分镜脚本文案不能超出50个字，且表达清晰、紧扣主题、无错别字；4）动画：必须设计三种以上的动画类型，图片、文案的运动方式描述清楚，无歧义；5）交互逻辑：逻辑关系及其实现方式表述完整、正确；4.任务设计根据“中华好诗词”的背景描述、需求分析等，使用北测－H5平台“脚本设计”工具创建项目、添加素材（U盘已提供）、调整素材、预览作品，最终完成本任务中“中华好诗词”任务书要求的H5图文脚本设计项目，并能在电脑设备上运行。创建内容使用北测－H5平台“脚本设计”工具创建内容，另存并命名为“座位号-任务一”（需使用“脚本设计”工具自带的格式）。添加素材按照任务要求选择场景、提取文案从提供的图片素材中添加素材，注意不要遗漏素材。调整素材对素材进行位置、角度、大小、透明度调整操作，使其符合编写需求。预览与提交作品参赛选手可使用电脑设备对所设计的内容进行预览、修改，完成所设计内容后，将内容由“管理账号”进行提交。任务二：H5内容制作部分1.任务主题主题：“中华好诗词”利用北测-H5平台技术对中国传统诗词文化做出有力宣传，源远流长、博大精深的中华民族文化，如同耀眼的星座，光耀了悠悠五千年。其中的许多精华，被代代相传，价值历久而弥新，这就是我们所说的国学文化经典。它是古老文化的智慧结晶，是中国文化和中华精神形成的基本根源，也是我们应该生生不息传递的瑰宝。2.任务内容根据提供的“中华好诗词分镜脚本”、“中华好诗词H5作品”及其素材，在北测－H5平台全真制作“中华好诗词H5作品”所有呈现的内容。手机扫描二维码可查看“中华好诗词H5作品”效果：打开手机照相功能对准作品二维码，点击手机屏幕上显示的“查看二维码”进入扫描结果界面，点击访问网址，选择手机上Chrome浏览器即可预览作品效果。中华好诗词H5作品3.内容制作需求1）分镜图文脚本请仔细分析“中华好诗词分镜脚本”，并注意观察“中华好诗词H5作品”中的场景、所有素材及交互。“中华好诗词分镜脚本”截图在U盘“赛题要求\任务二\截图\”目录下已提供，分镜图文脚本是部分内容提示，并非全部内容提示，完整的内容请参考“中华好诗词H5作品”，参赛选手需要完成H5作品中所有呈现的内容，分镜图文脚本详细内容如下：备注：页号描述如：1、2、3……为页号；1-1、1-2、1-3……为第1个页面的第1个场景、第2个场景、第3个场景……页号画面描述1画面情节1.本页作为加载页面，即第1个页面；2.“诗词大会”文字为主要画面。文案无动画描述1.云彩气泡在人物右上方由小极大循环播放；2.桃花花瓣徐徐下落（循环播放）；3.“诗词大会”四个字依次出现。交互与逻辑动画定格的同时自动跳转到第2页音乐与音效无页面切换缓入页号画面描述2-1画面情节1.本页作为首页画面，即第2个页面；2.使用小游戏的交互形式，将画面切换到下一个页面。文案无动画描述桃花花瓣徐徐下落消失（循环动画）；小鸟在树枝上上下晃动（循环动画）；问号“诗”图案沿问号形状轨迹运动（循环动画）；水墨元素缓慢出现。交互与逻辑手指按提示轨迹，将“诗”图案拖动完成轨迹，自动切换至第二个画面音乐与音效开始播放背景音乐，并且音乐图标显示在画面的右上角页面切换出现页号画面描述2-2画面情节1.本页作为“菜单栏”页面；2.以人物依次出现的动画展示菜单栏。文案无动画描述1.桃花花瓣徐徐下落消失（循环动画）；2.小鸟在树枝上上下晃动（循环动画）；3.人物依次出现，出现方式不同；4.“点击下面弹窗”缓缓出现；5.菜单最后缓慢出现。交互与逻辑四个标题分别对应此后四个页面，点击标题跳转到相应的页音乐与音效继续播放背景音乐页面切换平移（手动滑动）、出现（点击标题）

页号画面描述3-1画面情节1.本页作为“看诗史”页面，即第3个页面；2.主要展示诗词历史上三个重要的时代。文案{春秋、战国时期}；中国古典诗歌最早起源于民歌，劳动创造了诗歌；{魏晋南北朝｝；诗人和他在楚歌的基础上创制的诗体，这就是屈原和楚辞；｛唐宋时期｝；唐诗是我国古代诗歌的最高峰。李白、杜甫分别代表了我国古典诗歌中浪漫主义和现实主义的最高成就，被誉为唐诗的“双子星座”；返回。动画描述长图自动向左缓慢移动；鸟延轨迹飞翔直至消失；进入页面出现左右滑动提示，循环播放两次之后缓慢消失；描述诗史的三个模块依次出现，由春秋战国至魏晋南北再到唐诗，船在空中左右微弱晃动；白云缓慢移动，中间部分两座山由下到上出现。交互与逻辑1.点击三个模块都可以进入诗史视频介绍界面；2.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）；3长图自动播放的同时，可左右拖动观看，拖动结束之后，继续自动播放。音乐与音效继续播放背景音乐页面切换禁止翻页页号画面描述3-2画面情节1.本页作为“诗史视频播放”页面，即第3个页面第二个场景；2.播放视频来介绍诗的历史，并伴有文字介绍。文案诗词；诗词源远流长，是阐述心灵的文学艺术，用用凝练的语言、绵密的章法、充沛的情感以及丰富的意象来高度集中地表现社会生活和人类精神世界；3.返回。动画描述无交互与逻辑1.点击下方“返回”按钮，即可返回第三页长图拖动页，继续向左移动；2.点击左上角“返回”，即可返回第二页菜单栏（不重新播放，即直接进入人物出现动画）；3.点击视频可切换视频播放、暂停状态。音乐与音效播放视频的同时背景音乐暂停。页面切换出现页号画面描述4画面情节1.本页作为“赏名诗”页第一个画面，即第四个页面；2.通过滑动，来观看三首诗。文案返回动画描述1.手指左右滑动，提示动画；2.实现翻页查看的效果。交互与逻辑1.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）；2.左右滑动可以查看其他图片。音乐与音效继续播放背景音乐页面切换出现页号画面描述5-1画面情节本页作为“去答诗”页第一个画面，即第五个页面文案1.会当凌绝顶一览众山小；2.返回。动画描述右侧两句诗依次浮入，两个按钮依次移入，“诗词大会”上浮进入交互与逻辑1.点击“看规则”按钮即可进入规则演示画面；2.点击“去答诗”按钮即可进入答题画面；3.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换出现页号画面描述5-2画面情节1.本页作为“去答诗”页面第二个画面，即规则画面；2.以循环动画展示如何答题。文案返回动画描述循环播放“把酒问青天”移入明月几时有之后的横线上（稍作停留）；“我知道了”按钮在动画播放一次之后缓慢出现。交互与逻辑点击“我知道了”按钮之后进入答题画面；点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换出现页号画面描述5-3画面情节1.本页作为“去答诗”第三个画面，即答题画面；2.通过拖拽的方法将正确答案放到指定位置。文案返回动画描述无交互与逻辑1.拖动诗词放入指定位置，“下一题”按钮出现，点击“下一题”进入下一个答题画面；2.在最后一题，拖动诗词放入指定位置，点击去看分数，进入最终结果展示页；3.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换缓入页号画面描述5-3画面情节1.本页作为“去答诗”第三个画面，即第一道答诗题；2.通过拖拽的方法将正确答案放到指定位置。文案返回动画描述无交互与逻辑1.拖动诗词放入指定位置，“下一题”按钮出现，点击“下一题”进入下一个答题画面；2.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换缓入页号画面描述5-4画面情节1.本页作为“去答诗”第四个画面，即第二道答诗题；2.通过拖拽的方法将正确答案放到指定位置。文案返回动画描述无交互与逻辑1.拖动诗词放入指定位置，“下一题”按钮出现，点击“下一题”进入下一个答题画面；2.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换缓入页号画面描述5-5画面情节1.本页作为“去答诗”第五个画面，即第三道答诗题；2.通过拖拽的方法将正确答案放到指定位置。文案返回动画描述无交互与逻辑1.拖动诗词放入指定位置，“查看分数”按钮出现，点击“查看分数”进入分数展示画面；2.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换缓入页号画面描述5-6画面情节1.本页作为“去答诗”页的第六个画面，即分数展示界面；2.本页通过“5-5”答题结束判断用户得分并展示结果。文案1.共得XX分；2.莫等闲、白了少年头，空悲切！；3.长风破浪会有时,只挂云帆济沧海。；4.莫大意，须知“山外青山楼外楼,强中自有强中手”；5.返回。动画描述中间分数缓慢出现，之后评价语上浮出现交互与逻辑1.通过5-5答题结束，将分数控制在三个分数段：<70、=70、=100；2.长河落日圆、举头望明月、但闻人语响，为正确答案，分值分别为30、40、30；3.分值<70出现文本“莫等闲、白了少年头，空悲切！”，=70出现文本“长风破浪会有时,只挂云帆济沧海。”，=100出现文本“莫大意，须知“山外青山楼外楼,强中自有强中手”；4.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效继续播放背景音乐页面切换出现页号画面描述6画面情节1.本页作为“去听诗”页的第一个画面，即第六个页面；2.本页通过模拟音乐播放器来实现听诗。文案卜算子·咏梅；陆游；咏兰诗；斯兰；咏菊诗；李红；咏竹诗；方志敏。动画描述1.圆圈内图片，360°循环旋转；2.进度条跟随音乐进度逐渐变长；3.竖线（操作杆）跟随音乐进度逐渐向右移动；4.手指提示左右滑动并循环运动。交互与逻辑1.在听诗第一个界面向左滑动即可进入第二个界面，同时播放第二首诗歌；2.点击向左向右按钮即可切换前一首后一首；3.点击中间暂停按钮可以切换音乐播放状态，图标也会发生改变，音乐暂停状态下，中间图片停止旋转，播放音乐之后继续旋转；4.滑动操作杆可以调整音乐播放进度；5.点击“返回”即可返回第二页，即菜单栏（不重新播放，即直接进入人物出现动画）。音乐与音效1.暂停背景音乐；2.切换到对应的画面分别播放声音咏梅、咏兰、咏菊、咏竹。页面切换出现2018年湖南省高职院校“HTML5交互融媒体内容设计与制作”赛项任务书22/232）H5内容制作要求严格按照“中华好诗词H5作品”预览效果及脚本，制作一个H5内容，要求如下：页数一致画面、内容及排版一致；动画