天天看点

新手开始制作第一个H5移动端WEB购物流程页面的思路

今天,开始制作我自己需要的移动电商单产品页面,通过上次在网上下载的移动电商购物流程页面,我们现在开始。

今天主要说的是制作这个流程的思路。

由于我是新手,还有很多东西不懂,因此,我暂时只能是用最简单化的制作过程。

所以我的准备工作有:

1)chrome 浏览器,主要作用是预览和测试效果

2)手机一台,主要作用是预览和测试效果

3)Hbuilder 编辑器,主要是可以直接点击 运行,然后就可以测试效果(不用配置浏览器)

4)Visual Studio code编辑器

首先打开我的产品详情页面是这样的效果:

新手开始制作第一个H5移动端WEB购物流程页面的思路

而我要的效果是:

新手开始制作第一个H5移动端WEB购物流程页面的思路

于是,我开始用visual studio code 打开它,(直接把文件夹拖到VS code即可打开),修改文字,个性布局,ctrl+f ,全局查找变量,一大堆,中间在布局上,跟上面有点对不上。

这是最重要的一点,也是我今天所说的思路,就是先不必管细节。

如果我们陷于细节,就很容易就在那里浪费时间,我们在做任何事情的时候,都有可能是这样。

比如,我们开会,讨论一下,从产品拍摄,制作,到上架,出售等整个过程涉及的流程,负责人时,

如果我们讨论拍摄是陷于拍摄的细节,导致大家浪费时间是很没必要的,这种情况,尤其容易出现在开会的时间,毕竟会议通常是开放讨论的,因此,他容易因某个个体成员的意见,使讨论的方向转变,所以这时也及时调整过来。

费话不说了,当我发现,我在制作的过程中,对布局的修改,调整来来回回几分钟后,我发觉浪费了一些时间 ,于是,我马上调整了过来。

停止,然后继续往下一步走,(毕竟,作为新手,还有很多概念性的,基础的东西还不了解)。

于是,我忍住这个痛苦(实话说,很多人也会追求完美,做出来的一个页面,就是最终的页面,但事实往往并非如此),继续前行,继续把下单页面(忍受不完美),收货地址(忍受不完美),支付(忍受不完美),等等页面完成。

完成以后,我回头再去改这些问题,发觉反而很迅速,遇到阻碍,再看看教程,或视频。很快就解决了。

总结一句,一开始,当我们要完成一个工作时,可以快速的先完成所有功能,细节慢慢再调,这样,我认为还是蛮高效的。