描述
开 本: 16开纸 张: 胶版纸包 装: 平装-胶订是否套装: 否国际标准书号ISBN: 9787302649601
交互媒体设计与开发是一个较为广泛的领域,其中以 H5 技术
为核心的Web 前端开发占据重要地位。各高校在传媒和设计相关专
业的教学中,也越来越重视学生新媒体应用技术与创新能力的培养。
但是,受限于师资、设备与理念等方面的不足,教学效果不甚理想。
比较常见的窘境是计算机类学生技术能力较强,但缺乏艺术设
计与创新能力;文科和艺术类学生虽然具备较好的策划和设计能力,
但受限于技术能力不足,作品往往只能停留在原型设计阶段,无法达
到可以实际使用的程度。这两类学生的合作也往往因为不了解对方领
域的基本原理和流程而困难重重。iVX 作为 H5 开发工具iH5 的升级版,
以其强大易用的专业化功能吸引了大批不懂代码但又希望从事前端开发
的非计算机专业人员,也成为众多程序员提高效率、简化开发流程的有力
助手。
本书以iVX平台的前端开发技术为主线,在编写过程中,充分考
虑了零代码基础的文科生与艺术生的实际情况,以深入浅出的讲解和
丰富的案例带领读者迅速掌握 H5 交互设计的核心技术与设计理念。本
书的另一大特色是介绍了大量“全国大学生广告艺术大赛”历年交互
类的获奖作品,这些作品都是企业真实命题,并且超过半数使用了iH5
或iVX平台开发。
本书介绍了零代码在线开发平台 iVX 的开发流程和基本功能,以 H5 交互媒体开发为主要应用,结合“全国大学生广告艺术大赛”历年获奖作品,深入浅出地讲解了交互媒体设计的理念和技术,帮助读者快速提高交互媒体的开发和创作能力。
本书适合作为网络与新媒体、传播学、广告学、视觉传达等相关专业的核心教材,也适合广大新媒体爱好者与从业者参考学习。
第1 章 iVX 入门 001
11 H5 概况 001
111 H5 是什么 001
112 H5 编辑工具 001
113 H5 案例展示 002
12 iVX 工作流程 004
121 准备工作 004
122 新建应用 004
123 界面 006
124 父子对象 008
125 项目实训:翻页 008
13 前台布局 011
131 常用布局组件 011
132 项目实训:自适应网页 015
14 常用素材组件 018
15 拓展训练 023
16 本章小结 024
第2 章 交互基础 025
21 事件 025
211 事件概述 025
212 项目实训:活动报名表 027
22 轨迹 032
221 轨迹与关键帧动画 032
222 时间轴 033
223 项目实训:切西瓜 034
224 项目实训:冰冻果汁 037
23 计数器与条件容器 040
231 计数器 040
232 条件容器 041
233 项目实训:按住1 秒钟 041
234 项目实训:色觉游戏 044
24 触发器 047
241 触发器概述 047
242 项目实训:倒计时 047
25 拓展训练 053
26 本章小结 054
第3 章 动画基础 055
31 组件 055
32 动效与动效组 055
321 动效的使用场景 055
322 动效的添加 055
323 动效组 057
324 项目实训:动效果汁 057
33 滑动时间轴 059
331 滑动时间轴概述 059
332 项目实训:滑动天气 059
34 运动与缓动 064
35 图片序列与面板 065
351 图片序列 065
352 面板 066
353 项目实训:蓝色星球 066
36 画中画 068
361 画中画概述 068
362 项目实训:画中画 068
37 拓展训练 071
38 本章小结 072
第4 章 全景与3D 世界 073
41 全景 073
411 全景概述 073
412 项目实训:720°全景风光 074
413 全景视频 082
42 3D 世界 083
421 3D 世界概述 083
422 项目实训:3D 邀请函 084
43 拓展训练 088
44 本章小结 088
第5 章 物理世界 089
51 物理世界概述 089
511 项目实训:小熊滑滑梯 091
512 项目实训:飞机大战 093
52 拓展训练 101
53 本章小结 104
第6 章 数据库与服务 105
61 数据库 105
611 数据库概述 105
612 项目实训:简易表单提交 107
613 项目实训:数据库抽奖 113
62 用户数据库 126
621 用户数据库概述 126
622 项目实训:手机短信验证注册与登录 127
63 微信注册与登录 135
631 微信注册与登录概述 135
632 项目实训:微信注册与登录 137
64 拓展训练 139
65 本章小结 139
第7 章 适配 141
71 适配概述 141
711 适配的含义 141
712 设备像素比(DPR) 141
72 iVX 中的屏幕适配 142
721 设备适配 142
722 前台适配 142
723 排版容器 144
724 横幅 145
73 横屏适配 146
731 项目实训:设备适配 148
732 项目实训:视频真横屏适配 150
74 拓展训练 154
75 本章小结 154
第8 章 H5 创意设计 155
81 H5 作品的分类 155
82 H5 作品的设计原则 155
821 交互作品量表 155
822 H5 作品创作的一般性原则 156
83 H5 作品的设计流程 156
831 版面设计 157
832 交互设计 159
84 H5 设计常用工具软件 163
841 设计工具 163
842 H5 制作工具 164
843 辅助工具 165
85 “大广赛”参赛指南 166
851 “大广赛”简介 166
852 “大广赛”互动作品创作要点 167
853 “大广赛”iVX 平台创作与提交问题汇总 168
86 本章小结 172
参考文献 173
致谢 174
交互媒体设计与开发是一个较为广泛的领域,其中以H5 技术为核心的Web 前端开发占据重要地位。近年来,H5 技术发展迅速,尤其是在移动端得到广泛应用,逐渐成为App 开发、UI 设计、网络营销、传媒娱乐等领域中的重要技术之一。各高校在传媒和设计相关专业的教学中,也越来越重视学生新媒体应用技术与创新能力的培养。但是,受限于师资、设备与理念等方面的不足,教学效果不甚理想。比较常见的窘境是计算机类学生技术能力较强,但缺乏艺术设计与创新能力;文科和艺术类学生虽然具备较好的策划和设计能力,但受限于技术能力不足,作品往往只能停留在原型设计阶段,无法达到可以实际使用的程度。这两类学生的合作也往往因为不了解对方领域的基本原理和流程而困难重重。
近年来,随着互联网作为基础设施的快速发展,前端开发技术和工具也发生了前所未有的变化。以Figma、Canva 为代表的在线开发工具引领了设计软件从离线到在线、从大而全到小而美的潮流。这些强调无感迭代、多人合作、海量资源的在线开发平台大大降低了交互媒体设计和开发的技术门槛,掀起了一波交互媒体开发的新浪潮。在这次浪潮中,国内企业纷纷跟进,易企秀、即时设计、iVX 等在线开发平台脱颖而出。其中,iVX 作为H5 开发工具iH5 的升级版,以其强大易用的专业化功能吸引了大批不懂代码但又希望从事前端开发的非计算机专业人员,也成为众多程序员提高效率、简化开发流程的有力助手。
本书以iVX 平台的前端开发技术为主线,在编写过程中,充分考虑了零代码基础的文科生与艺术生的实际情况,以深入浅出的讲解和丰富的案例带领读者迅速掌握H5 交互设计的核心技术与设计理念。本书的另一大特色是介绍了大量“全国大学生广告艺术大赛”历年交互类的获奖作品,这些作品都是企业真实命题,并且超过半数使用了iH5或iVX 平台开发。通过对这些同龄人真实创作案例的赏析,学生可以建立信心、激发兴趣,快速提升实践能力。坚持以赛促教、以赛促学、以赛促改,是笔者所在院系教师团队经过多年探索的经验总结,本书的编写正是基于此经验。
在体例上,本书每章包含4 个部分,各部分安排如下。理论讲解:围绕本章主题讲解基本概念和理论。
项目实训:对理论讲解部分内容做项目实训,教师当堂演示,学生当堂模仿练习。
拓展训练:在项目实训的基础上进一步引导学生应用本书所学技能动手实践。课时充裕的课程,可将本部分用作学生的课堂练习,教师进行现场辅导。课时紧张的课程也可留作课后作业。
本章小结:总结本章要点。
教师在授课过程中应根据实际情况灵活选用章节内容,例如,部分章节有多个项目实训的可以按需选用其一,其余留作课堂练习或课后作业。我们建议的教学时间为每章4 ~ 6 课时,总学时32 ~ 48 学时,其中包含了讲授、演示与实训时间。
为避免链接失效导致案例无法访问,书中所有互动作品均以录屏方式展示,读者扫描案例对应的二维码即可在线观看,您也可以在浏览器中输入脚注中的网址直接访问互动作品原件。
由于在线开发平台的版本迭代较快,读者在使用本教材时可能会发现书中内容与软件界面不符的情况,为最大限度保证教材内容的时效性,我们会持续发布《更新说明》。请读者扫描前言中的二维码下载书中使用的案例素材及更新文件。
由于编者水平有限,书中难免存在不足之处,欢迎广大读者批评指正。
编者
2023 年8 月
评论
还没有评论。