2017/3/16 优化：登录/注册流程
新增：购物车相关流程
2017/3/10 初稿。
老板：现在我们公司需要做一个App。
PM（我）：什么类型的App？
老板：商城类的，就做某宝，某东那样的。（你懂得）
.........暴走！
PM（我）：那我们打算卖什么商品呢？
老板：现在不清楚，你就先做个框架，反正以后后台也可以更新。
.........暴走！
PM（我）：那我得根据商品的多少，商品的类型去设计功能，页面啊。
老板：你就搭个框架，可以没有二级页面，但是基本的购买功能得有。
.........暴走！
PM（我）：强行压着无奈暴躁的心情，那给我多长时间去规划功能和设计页面？
老板：这个App比较紧急，你加加班，争取10天做完。
PM（我）： ...............(省略1000000字）
老板：快去做吧。
作为一名打杂人员，要时刻的摆正自己的位置。
废话不说了，直奔主题，快准狠。
第一步，做一个思维导图，流程图等（下方会有）
第二步，开始画原型图，我的习惯一般是按照思维导图规划的模块去创建文件夹，比如首页/上新/购物车/我的，将登录注册及重要功能（订单相关）单独放置一个文件夹，这样做的好处就是便于查看，简洁明了。 在原型图中，我通常包含修改记录，全局说明，产品结构图，产品流程图，移动UI设计规范（后期加入），至于标准的PRD文档我一般不会去写，个人觉得能让公司流水线作业就可以，没有必要拘泥于文档。
原型图架构 初稿
下面对于我原型设计中设计的内容，进行一个说明，如果有不同意见和错误，欢迎下方留言指正，谢谢！
一、修改记录
修改记录中我一般是创建表格，分成三列，包含时间，内容，编写人姓名（昵称）。 便于自己对于项目时间的把控和留档备案。
修改记录
二、全局说明
包含信息架构说明，页面切换方式，全局交互，弹窗/模态窗口，页面标题/滚动条等，安卓和iOS不同之处的说明。下方图片中的信息架构说明是复制之前做的，这个我一般是在文档做好后，才回去写，算一个检查反思的过程。
信息架构说明 是便于开发人员去了解当前页面层级关系及页面数量，便于阅读和估算开发时间。
信息架构说明---初稿
页面切换方式 是分为iOS和Android两种。 由于两个操作系统的区别，硬件的不同，所以手势操作也不同，但现在个人觉得市面上的多数App都是Android向iOS靠拢了，基本一致的，只是稍有区别。
页面切换方式---初稿
弹窗/模态窗口 是分iOS和Android两种。主要是弹窗的方式和样式及位置的区别。
弹窗/模态窗口---初稿
页面标题/滚动条 是分iOS和Android两种。页面标题的位置两个操作系统不同，但是滚动条是一致的。
页面标题/滚动条---初稿
全局交互 是以iOS为主去做的，Android基本上也是适用的。
全局交互- 1---初稿
全局交互-2---初稿
三、产品结构图
运营给的业务的流程图，如图1所示；
我修改和细化的产品结构图，如图2所示。
修改原因：
1、因为目前公司对于产品的类别没有一个很好的规划，所以自然不可能做一个类似与某宝和某东那样复杂的商城；
2、运营给出的方案有重复的地方，而且功能并不适合于当前阶段。
优化原因：
1、便于自己梳理商城类App的结构；
2、便于自己对商城类App做整体规划；
3、可以将产品结构图中的内容完美转换成原型图进而进行设计；
4、其实目前我已经将【上新】模块去掉了，只是结构图没有来得及修改。 T^T
图1
图2---初稿
四、产品流程图
一般情况我不会去画整个产品的流程图，因为查看不方便，好吧，我承认重点是电脑屏幕小，画的时候不方便，整体流程更多采用的是在需求评审会上的口述讲解和白板画图；
But，对于重要功能，我一定是会画流程图的，便于开发去理解逻辑。
产品流程图---初稿
五、移动UI设计规范（暂无）
由于目前这个产品没有移交到UI手中，所以设计规范暂无。
六、商城类App典型页面---查看全部订单
查看全部订单---初稿
七、商城类App典型页面---购物车
包含编辑购物车中的商品，领取并使用优惠券，消息中心，结算及页面提示等。
购物车---初稿
八、登录注册功能
登录方式一般有三种：
第一种，账号（手机号/邮箱号/用户名）+密码的方式登录；
第二种，账号（手机号/邮箱号/用户名）+验证码的方式登录；
第三种，通过第三方平台（微信，QQ，微博）直接登录；
本次采用第一种和第三种方式登录App。
登录功能--- 复稿
注册方式
一般有三种：
第一种，邮箱注册；
第二种，手机号注册；
第三种，用户名注册；
第四种，第三方注册。
本次采用第二种方式和第四种进行账号的注册，使用手机号注册已经成为移动端App的主流方式了并且安全性高，验证方便，ID是唯一的。
注册功能---复稿
登录流程
第一种，需要登录后才能继续使用产品功能服务，社交类偏多。
第二种，不需要登录就可以使用产品或者产品的部分功能，商城类偏多。
本次采用第二种，商城类App重点就是用户购买率，所以在这之前一定要保证用户正常的操作流程，只有当需要用户填写个人信息的时候才会提示用户需要进行登录/注册的，否则一定不要打断用户的使用流程，要保证流程的简单顺畅。
结束，谢谢阅读
网友评论