哈喽大家好,上节课我们看了推电影项目电影详情模块的产品原型图,今天呢,我们来进行第二节课,前端的开发文档设计
一说到写文档,大家就觉得不敢下手,这是很多学生的通病,每个公司都有自己的文档格式,我们写文档是一个精简版,写出重点,一方面是自己开发过程中不会出问题,第二是为了方便后面的开发。
一、下载地址
本课程涉及的官方版开发文档,关注【校招VIP】公众号,回复【2006】,可自行下载开发文档
这个图是产品原型图,大家可以去公众号下载。现在公司里面很少有直接用word来进行开发,因为我们最后是要提供下载,所以就以这种模式来做。
二、课程重点
1、基本信息
首先特权写两行。注意两个事:标题两行,后面的上映时间不要流出来。电影时间是多长,后端会把它对应成一个ID,前端需要写死他。
2. 电影类型和电影地区
后台文档会给出一个对应的枚举值,项目内要固定,这个变动会很低频,它不是动态的,如果是在数据库里面的话,那就不能写死。
3. 电影评分
要求要有小数。比较麻烦是这个观影渠道,观看渠道这种方式叫一级展示,如果是第三方平台,他不会写爱奇艺的。
三、项目难点
1.锚点。 锚点跳到页面下方的观看渠道模块,这个地方的问题是怎么跳。最好是在做之前就定下来。有些难题,有同学说很简单,直接做一个HTML跳转。ID跳转实际上是发生跳转了,页面多了一层,等发现点后退时,他还是在当前页面,但它加载了一个新的页面调用。
2.使用高度。 使用高度值去重新定位展示,高度值的变量,指定跳转位置,这是我们最终要选择的方式。但是这有个问题,你会发现往下跳的时候,如果给个固定的地址,那实际上这个地方还有展开收起功能,它的距离可能会变。就等于是要重新去计算到上面的距离,要去实时计算。
面试官的第一个问题,亮点为什么不行,后面的HTML5的那些问题肯定会问上去。
2. 演职员
这是比较简单的左右滑动,这里面第二个难度是tab跟下面的滚动。 因为它是个锚点,锚点tap与页面对应位置滚动的双向绑定,所以实现是一个难点。
3. 展开收起
这是原型图的UI,上面会说这个展开收起必须放在这个位置上,怎么能够展开正好放在这,而且不压字。那么这个时候有可能计算的话,你会把它盖住,把它往前改也可以啊,这是一种方案。
但是商用的话要求严格,是可以用JS来实现,也可以用纯CS来实现。是各自选择,但CS3可以实现最优化的结果。因为JS的变动是没法控制的,为了保证展开的时候定位准确性和兼容性,那么CS3可以实现。
虽然就一个页面,但是有三个大的功能,有的同学说太简单了,但你做和不做,要求高和不高,实际上都是很多同学最后搞不定的一个原因。
好啦,今天的分享今就到这里。