微信小程序项目实践 项目范围及开发计划

一、栏目及需求

1、首页： 要求产品信息带自动切换效果。

2、产品： 产品分类列表、产品列表、产品详情

3、新闻： 列表样式参考今日头条

4、介绍： 单页图文混排

5、互动： 留言板，样式参考微信，单页图片混排

二、页面截图

1、首页

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/5408238172784410293.png” style=”float:none;” title=”I.png” class=”aligncenter”>

2、产品

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/8763040205219032825.png” title=”M.png” style=”float:none;” class=”aligncenter”>

产品详情页

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/1035882255123540840.png” title=”M2.png” style=”float:none;” class=”aligncenter”>

3、新闻

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/246983484198061884.png” title=”N.png” style=”float:none;” class=”aligncenter”>

详情页

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/9062463951288486859.png” title=”N2.png” style=”float:none;” class=”aligncenter”>

4、ME秀

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/5977772444391030295.png” title=”P.png” style=”float:none;” class=”aligncenter”>

详情页

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4425982285462727848.png” title=”P2.png” style=”float:none;” class=”aligncenter”>

5、ME聊

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/517682195777673248.png” title=”L.png” style=”float:none;” class=”aligncenter”>

三、项目分析

我把所有页面及位置按我的工作习惯进行了编号，以方便检索和沟通，是我自己的习惯所以没有参考任何编码规范，别误导大家~

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;” class=”aligncenter”>

650) this.width=650;” src=”https://images.winkp.com/imgs/winkp/_winkp/2023/08/4463071004201618543.gif” title=”黑蜂园小程序.mmap” class=”aligncenter” style=”background:url("/e/u261/lang/zh-cn/images/localimage.png") no-repeat center;border:1px solid #ddd;”>

三、开发计划

注：因参考PC版网站，所以不需要美工出PSD，直接参考PC网站写前端页面。服务器我已经提前配好了，所有没计算到项目中。

1、准备阶段：服务器配置、参考页面、开发计划、工作量评估等等 工时：8小时

2、前端：共计8个页面，工时：8小时

3、数据接口：16个接口，其中6个可复用，工时：4小时

4、测试及录入数据：工时：4小时

5、上线：上线审核预计8小时（有不可控风险）

四、总结

这种微小型开发项目没有完全按项目管理流程来，因为以学习实践为主，所以写的不细致的地方还请大家批评指正，谢谢。