介绍
移动收银是提供给美业店铺营业SaaS服务的一部分，是现有桌面Web平台收银在移动场景下的补充，一套集商品、服务收银、开卡充值、购买赠送优惠券和疗程、还款等服务的系统。
主要功能：创建会员、查看会员消费信息、服务商品开单、开卡、充值、购买疗程套餐(含标准和自定义)、购买优惠券、卡升级、还款、卡金转赠、多收款方式包括手牌号收款、推送收款
面向行业：美容、美发、美甲等美业
目标人群：前台收银员、店铺经理、手艺人(包括个人营业的)
适配平台/环境：Web开发适配 iOS、Android、微信H5
产品价值
店铺价值
1、丰富交易场景，发挥移动收银的便捷性，快速完成交易
不需要每次结账都要跑到前台，省去顾客等候时间，节省商家的操作成本。
2、增进营收，增加员工积极性
店员即销售，店员(发型师、技师等手艺人)在服务的同时向顾客销售其它服务或商品、或开卡充值等创收行为时，通过移动收银提供当场即时结账功能，给店铺带来营收的同时，也会店员带来业绩提成，双赢。
3、随时查看订单信息，避免漏单走单
店员：可以随时关注订单信息，避免漏单走单错单。
老板：随时随地了解当前或历史的订单，了解店铺收银结账的情况。
4、不受电脑设备或网络故障影响店铺的正常营业收银
店铺如果遇到电脑故障、停电、断网等问题，就会影响到他们的收银（通常借助笔纸工具做记录，后面再重新录进电脑）。借助手机的便利性，移动收银可以很好地解决这种问题。
5、无纸化收银
通常店铺开单收银都需要用到纸质单，但借用移动收银可以随时快速开单结账，随时查看订单信息。
平台价值
1、覆盖移动收银场景，丰富平台产品蓝图，增加商家使用伊智产品的粘性
培养商家的产品使用的习惯养成和粘性，打造标杆产品，为长期提供服务和合作打造功能基础。
2、提升收银的效率和降低使用成本
不需要购买额外的设备，在手机上动动手指就能轻松结账。
3、打造产品卖点，促进运营和销售
增加功能卖点，有助于产品自身的销售和运营推广。
4、减少培训成本
通过流程和交互优化，减少对商家使用产品的教学培训
用户分析
🌁 体验地图: 点击查看
问题&优化
原来的版本上线后，有上面几大方面的问题，最终导致的结果的移动收银的口碑差、使用率低，对购买服务的商家和我们平台来说都是一种损失。
接下来，下面会从流程、交互和功能三个方面选取部分问题进入分析，以及对应的解决方案。主要的优化方向是流程交互，重塑用户在使用移动收银时的心智模型，目的是提升收银的效率和使用体验。
流程问题
开单流程
问题概括：
查找会员不符合一般用户养成的心智模型
输入手机号 ⇢ 选择功能 ⇢ 搜索会员和选择 ⇢ 进入功能详情
输入手机号接下来的操作直觉就是搜索会员，但这里在输入完手机号之后的操作是先选功能（开单、充值等）才能搜索会员。这种与一般人已养成的心智模型不一样，把两个不一样作用的操作交叉组合在一起，在操作流程的认识上会出现断层。
收银首页面示能不突出
主页上面放置的是数字键盘用来输入手机号，底下放置的是功能集，但这两块区域静态地放在一起，并看不出是有关联。特别是在输入手机号后，用户会愣一下“我接下来该怎么操作？要点什么？”。在示能设计上是失败的。
开单流程单线程
同一会员，在执行每一项功能（开卡、充值等）操作前，都要返回到收银主页输入一次手机号或会员卡号进行会员搜索，增加了交互步长，而且繁琐。具体体现有下面两点：
同一个会员在开单（服务/商品）时，无法直接给顾客充值或开卡，极大影响操作的便捷性。
同一个会员在充值或开卡之后，也无法直接进行开单（服务/商品），必须要重新回到收银主页，重新输入手机号才能继续开单。
整个开单过程步骤多，经常会迷失，不知道[我在哪里]、[我能到哪里去]。
针对这些问题，对开单的流程进行了优化，流程概览如下图：
主要优化点：
- 优化从搜索会员到进入开单的交互流程，符合普通用户已养成的认知和操作习惯。
- 会员开单时，可以进行开卡、充值、还款等操作。
- 服务商品开单时，可以直接快速地对项目进行增删查改操作。
- 开卡或充值后，可以继续给同一个会员进行服务商品开单结账。
- 优化导航，减少页面跳转，尽量使用轻弹窗。
增删改项目流程
挂单后的待支付订单，如果要继续添加项目，需要离开当前页面，跳转到添加项目的开单主页才能添加项目，然后再重新走一遍增删服务项目的流程。
实际情况：通常助理开完单之后，一般要等服务完成才结账，所以从下单到正式结账存在一段时间差。期间顾客如果需要变换服务、增加其它额外服务或者修改项目优惠和价格，按原有的流程会降低开单结账的效率，还增加商家的操作负荷和繁琐感
进入待支付订单进行结账时，如果要增删改项目，只需要在当前页面操作，减少中间不必要环节，不需要跳转和重新走流程。具体看下方的待支付订单
交互问题
收银主页
1、键盘交互
只支持数字键盘输入，会员卡号存在数字很长或有字母，输入起来很不方便，以及部分商家习惯通过姓名搜索会员，目前的关键字只能数字输入，并不满足实际的使用需要。
键位小，输错率很高。个人通过测试这个键盘输入的准确性，接近60次的测试输入，接近17次出错，高达30%（数据不具代表性，仅是个人测试得出的结果）。
出错的主要原因：
1、key之间的上下间距小，容易按错数字；
2、漏输入（已明确地按下了数字但没有响应，特别是快速输入数字的时候)。大屏问题，键盘位置放得过高，手指够不着，输入非常不友好。
2、重要信息不突出
开单的主要顾客类型分会员和散客，在实际使用时会发现，绝大部分的注意力会放在数字键盘上和底下的功能入口，忽略掉了散客开单的入口（当前散客的入口不太明显），一般的新手用户都觉察不到有这么两个散客开单的入口，除非刻意地指导使用。
3、页面承载功能过多，主要目的不明确
收银主页既用大面积区域做会员搜索，又做功能聚合，虽然之前只有开单、疗程和充值，但后面也会把开卡、升级、还款、购买自定义疗程加上。
其次是从页面上很难快速地看出上下这两块原来是存在关联，要先输入手机号再选择下面的功能，选择功能后是进入会员搜索，并不直接进入所选功能对应的页面。
这种布局直观感觉上下两个区域的功能是独立的：上方是用来快捷搜索会员的入口，下方的功能是可以直接点击使用的。用户心理期望与实际没有达到一致，这会很容易让人迷惑，还增加使用时的认识负荷（特别是新手用户）。
1、调整键盘的设计，包括Key高度和布局。
2、增加切换系统和第三方键盘的交互和输入。 ⌨️键盘切换动效
3、增强散客的视觉吸引。
4、结合流程的优化，简化和明确主页的作用，把它作为会员搜索入口和散客开单入口。
开单主页面
1、顾客信息不完整，缺少关键信息点 (使用的会员卡、卡号、余额等)，而且会员选错了也不了重新选择。
2、默认展示的是店铺所有的服务和商品，但从商家开单的角度来看，更需要知道已经给顾客添加了哪些商品和服务。
3、项目按部门筛选不符合店铺收银的常规使用，一般是按服务或商品的分类。
4、已添加的服务或商品放在购物车里，这里的购物车设计隐藏过深，并不方便收银员、助理或发型师直观查看。
5、购物车里已添加的商品服务无法修改信息：价格、数量、优惠、服务员工。必须要先删除项目再重新操作 ，严重拖慢了收银的开单效率。
6、服务或商品开单过程中，无法给顾客充值或开卡，必须要退出返回主页，再重新搜索会员和选择充值或开卡的功能再操作，极大影响操作的便捷性。
重构开单主页信息结构
1、完善顾客的信息显示，包括姓名、手机号、会员卡、余额等，并可以通过下拉箭头触发重选会员。
2、结合开单流程的优化，在当前页面可以随时给顾客充值、开卡、购买疗程等操作。
3、默认展示已添加的服务和商品。
4、服务商品按分类筛选。
5、减少繁锁的操作，在当前页面可以随时修改项目信息，不需要先删除再重新添加。
6、利用浮层操作，不过分打断当前的页面，沉浸式完成添加项目、修改项目、使用优惠、服务员工等操作。
待支付订单页
1、订单的会员信息缺失
- 结账时，店员会查看顾客的会员卡、余额等关键信息点，也会核对姓名、手机号，但如果错了就不能更换会员，跟收银主页的问题一样。
2、继续添加项目不明显，且流程复杂
继续添加项目的操作，视觉上太弱不突出（字体太浅、放在顶部），并不容易能察觉到有这个操作。
其次在当前这个页面如果要继续添加项目，是需要跳转到项目的添加页面，并且重新走一遍流程，具体查看上面的增删改项目流程。
3、修改项目的触发点分散
- 改价、改员工、使用优惠各一处操作触发点，影响操作效率。
4、可交互元素尺寸小，功能堆彻密集，视觉负荷大
- 底部区域的单号、性别、备注、记客也存在一样的问题，点击区域小而密集，再加上移动场景下本身缺乏稳定性，点击操作的准度会很低，也就是说点错的概率会很高。
- 同样，在Cell列表上操作点击区域小密集，每条列表单元上承载多个不同的点击事件（优惠、改价、删除）。既增大操作负荷，也增大浏览查找信息时的视觉负荷，不适合移动端上的操作习惯。
1、增加可点击操作元素的面积。
2、复用开单主页面添加和修改项目的交互，保证从开单到结账不同阶段，项目信息最大的可编辑性，以及操作交互上保持一致，减少学习成本。
3、底部的订单功能操作做了列表结构化排列处理，设计上增大可交互元素的尺寸和留白空间，也保证后续功能调整的扩展性，可减可增。
部分弹窗交互和设计问题
比较多的页面都存在这种问题，缺少对信息的设计，可以多考虑从信息的分组、适当隐藏，对空间结构进行优化设计，确保在移动端上的信息设计和交互简单合理。
1、对于需要频繁切换的操作，过渡使用全屏弹窗设计会无形地占用用户更多的交互时长。
2、选择员工：
服务员工平铺展示列表太长，屏幕空间利用率差。
一项服务可能会有多个步骤，每个步骤都可以选择员工，旧版的做法是把每个步骤的所有员工都直接展示出来。这样设计的最大问题是占用了太多的高度空间，增加浏览信息的难度，不适合快捷地信息浏览和选择操作。
3、选择优惠：
优惠（赠金、积分、优惠券、疗程套餐）像大杂烩一样排列出来，展现方式和交互不适合用户浏览查看和选择。
1、统一改用底部弹窗设计。
- 提高UI和交互的复用率，在其它地方可共用。
- 占窗口75%，减少浏览满屏信息时带来的复杂感和畏惧感。
2、选择员工：
每个服务步骤的员工数量超过9个，采用左右滑动浏览，不再直接平铺展示，节省屏幕高度空间。
3、选择优惠：
重组优惠方式的信息组合方式，进行分组设计，把「赠金积分」、「优惠券」、「疗程套餐」分成三个tab。
功能
在功能范围层面，移动端应该要求精不求全。精：一是指能够精准匹配大部分核心主要的业务，保证完整业务闭环和落地；二是用户体验和设计上的精细。不求全，主要原因是很难做到面面具到，如果要迎合客户说什么就做什么很容易会让这个功能型产品变得冗肿，不同的客户可能只使用其中一小部分功能。
虽然原版本已经有了商品服务收银、充值、疗程销售这三个核心主要功能，但在店铺日常营业移动收银的场景下并不能很好的实现无纸化收银的完整闭环。下面的几个功能对于覆盖商家的日常使用有很大的需要，比如还款、购买自定义疗程套餐、结账方式支持推送收款、礼品卡等等。
这次改版设计重点要考虑交互框架的拓展性和易用性，即在不需要大改的情况下，以迭代的方式把功能追加上去。
总结
设计的作用
- 核心交互和流程重新设计
- 重塑移动收银的产品概念模型以符合用户的心智模型
- 视觉细节优化
重构的设计原则
贴近实际业务
脱离实际业务的设计没有多大的价值，要以解决问题为原则；其次是不要一直陷在考虑美观层面，跳出来多思考更顶层的业务场景、真实的商业模式。
提升效率
提升收银开单和结账的效率，快速完成开单和结账，减去不必要的页面跳转和流程重复。
增强产品交互框架的扩展性
考虑后面有其它功能新增时，可以以最少的成本进行增量叠加。
容错性
减少操作失误的发生，即发生输入错误、选择错误等操作都可以用最少的成本修正。
尊重客户已养成的使用习惯和认知模型
好的地方要借鉴甚至加以优化使用，不好的果断要去掉。除非有更好的选择，否则遵循已有的设计原则和模式。
移动优先
原有的设计掺有不少桌面软件的交互和操作习惯，但这些在移动端上是极不友好和难以使用。