pos收款机如何使用(谈一下致心零售POS收银端设计思路)

致心零售的beta测试马上就要完成了，作为我们自主设计开发的第一个大型的项目，今天想在这里把当初设计的一些思路跟想法写下来，对个人作为一个沉淀，对他人算是一个分享。我主要从设计风格，布局，用户体验这3个方面来谈一下。

致心零售LOGO

设计风格

致心零售的整体设计风格还是沿用整个产品的设计风格，扁平化，抽像化，多用线性图标和圆角矩形表达一个圆润的感觉，少了一份犀利，多了一份亲合感。配色方面选用了产品logo中的主题亮黄色，亮黄色也是今年潘通（PANTONE）流行色之一，非常有活力，辅以黑灰色，呈现一种简单明快的感觉。图标采用线性图标，选中状态为反色高亮，这也是一种常见的设计，简单直观。按钮采用全圆角设计，感觉圆润有亲合力，非选中状态只有一个边框效果，使整个UI呈现一个干净的效果，减少视觉疲劳感。选中状态是一个线性渐变色，增加一些设计上的活力和变化。在tab项目的选中效果为一个放大和加粗的字体，这是一种简化认识的做法，选中效果一看便知。同时下面增加一个主题色的条状元素，同时该元素也是圆角的，保持一个设计上的一致性，可惜后面开发说不好做，给毙掉了，搞了一个简单的矩形效果，非常可惜。

设计风格一览

布局

收银机POS的屏幕大小可以简单理解为一个平板，当年我们做iPad APP的经验就可以参考来用了，好消息是该应用是只应用于pos机的，并不需要同时兼容平板和手机，这样我们设计产品整体布局就简单多了。

布局的产品UI的骨架，设计的好，产品后续的操作逻辑才能一以贯之，不然会造成操作逻辑混乱和复杂，增加用户学习和认知成本。

我第一个想法是采用“3段式设计”，3段分别为菜单区，列表区，详情区。目前这种设计应用的也比较多，比如我们常见的微信桌面端，但是这个设计并不微信的首创，我感觉最早用这个设计的应该是Twitter的mac客户端。

“3段式设计”一个最大的好处的操作逻辑比较清楚，把UI拆分成一个我们日常生活中常见的树状结构，简化认知和理解，用户能够做到举一反三，降低学习成本。

用户体验

前面我有提到UI的整体布局的“3段式设计”，这个设计有一个好处是带来操作动线是线性的，不需要来回操作。以收银界面为例子，致心零售的操作动线是从左到右的，先选菜单区，手移右点击选择商品，再移动到右边查看编辑商品并结账，整个的操作动线是从左到右，从上到下的，减少收银员的手部动作，减少收银员的疲劳感。而某些收银软件就完全没有考虑过这个问题，这样收银员的手部会来回摆动，时间长了会增加人的疲劳感。

三段式布局及操作动线

数据显示，从事收银工作的员工普遍存在年龄偏大，学习能力不强的问题。致心零售UI设计上特意简化操作，比如商品搜索。一般的搜索会让用户输入中文，这样就会增加操作的复杂度。致心零售会自动生成商品名称的助记码，配合我们专门研发的虚拟键盘，最大化减少用户操作。

虚拟键盘

后记

在整个致心零售的POS UI设计当中，有不少的遗憾。一是现在市场大部分收银机不支持高分屏而分辨率不高，这样的话整体显示效果非常不好, 希望以后有新的设备能支持高分屏。二是没有支持黑暗模式，可能有人会觉得黑暗模式可有可无，但是我们一直坚信设计还是以人为本的，用户在使用产品的时候能够感觉到你的设计，这个就是对设计人员的最大奖励。