开始设计
在正式开始做之前，还需要做些设计，主要是：技术框架、UI框架。因为需要尽快上线，所以先把功能实现，详细设计以及实现在功能完成后再做优化。
技术架构
为了加快速度，架构上尽量沿用熟悉的技术，同时也要按照产品的规格去实现，完成项目兼具锻炼技术。
总体架构如下图：
技术体系
各端的技术体系如下：
| 模块 | 体系 | 说明 |
|---|---|---|
| Web管理后台 | Java + vue | 前后分离 |
| Web客户端 | Vue | Vue3.0 |
| 小程序 | WXML/WXSS/JS | 原生效果最佳 |
技术选型
- Web管理后台
后端：微服务架构，RuoYi-Cloud开源框架（http://www.ruoyi.vip/）
前端：Vue + ElementUI,RuoYi-Vue
- Web客户端
Vue3，Element-plus
架构图
技术架构图如下：
UI架构
因为是面向C端的项目，界面就显得非常重要，好的用户体验直接影响到项目运营。如果有产品美工资源，问题不大，但目前为了节省成本以及时间，先按常见的UI框架把功能实现，后续再对UI进行优化。
微信小程序
常用的小程序框架，底部导航+内容：
Web客户端
Web客户端界面需要根据业务功能来设计，整体模式为：顶部菜单+内容
Web管理后台
Web管理后台自己使用，标准框架即可，如下所示：
设计途径
后面在具体开发，UI优化过程中最好的方式就是参考其它较好的设计方案，eg:墨刀素材网,axsure原型模版网，其它小程序。