单据用户界面的改进

时间:2022-08-27 20:47:09
    以往的工作中开发过一套服装行业分销软件,这套软件里面有不少的单据需要处理,针对于单据的用户界面设计当时也做过不少的思考,可并没有把用户交互做得很好,今天打开程序来看连自己也觉得界面过于复杂和凌乱,整个界面看起来总觉得在逻辑性和结构性方面有所欠缺,我将自己摆在用户的角度来看,发现这个界面使我无从下手,没有一个清晰的做单思路,本来简单的事情变得复杂了。那拿给用户去用就不免会使别人感到困惑了!今天我以采购单为例对单据的用户界面设计做一些修改。下面这幅图是我程序的整体界面和每个页面区域的说明:
单据用户界面的改进
怎么样?头昏眼花吧!我自己也觉得,呵呵!

下面我来说说我自己对这个页面不满的地方。

1. 单据明细列表的统计数据信息:这个统计数据由于实际用户看报表比较多习惯与在单据明细列表的底部查看起统计数据(包括数量、金额等),而这个页面没有显示,而找了一圈后发现统计数据和实现功能的按钮放到一排了,这会是用户感到不习惯,并且使整个页面看起来没有章法

2. 按钮太多并且风格不能够统一:这个页面中包括了实现功能按钮面板和实现单据明细输入功能按钮面板,好没问题,这样放可以,但是按照这个方法设计下去你并不能保证系统中其它每个页面的按钮也放在同样的位置上,总会有一些特殊的情况限制你做不到这样的统一。那么如果不能够做到统一,用户便要每个页面都要去重新适应,因为用户的工作是连续性的,当他从采购单切换到其它单并想要保存数据的时候他会习惯性的去采购单那个位置找,而后他发现按钮不在那个地方,于是,抱怨就来了。

3. 单据明细列表难于维护:在页面的中部有一个单据明细输入面板,这个面板中有一些按钮用来实现单据明细的增、删、改。想一想,用户每增加一条商品信息就要来到输入面板中输入数据,输入完之后要点新增按钮把数据加到上面的明细列表中,如果想删除一条就要在明细列表里先选中那一条然后点删除按钮,如果想修改一条数据同样要先选中那一条,然后到对应的下面的输入面板里面改数据,我晕,我是用户也烦躁了,因为我有时候仅仅只是想改一个数量却要做这么多操作,这使系统显得难用!

4. 搜索单据面板功能不全:搜索单据面板中只有按单号、仓库、供应商搜索,而用户可能对采购日期记得比较清楚,比如某年某月某日采购了什么,就算不是记得很准确但大概的时间范围还是有印象的,这里就没有按采购日期进行搜索的选项,并且单据状态也可以做为辅助搜索条件,最后应该为搜索出来的表格也就是单据列表加上排序功能方便用户排序查看

5. 选择单据明细输入方式面板:这又是一个很多单据都要使用的功能,在摆放上如果不能一致又会造成界面风格不统一的毛病

今天针对这些不满,我从新对单据的界面设计进行了调整,下面这副图是调整后的页面:

单据用户界面的改进

 

首先,在调整后这个页面从整体上看上去要清晰简洁些,不再显得那么复杂,这是第一感官,不知道用户会不会也这样觉得,但愿吧!呵呵!然后这个界面看起来用种传统的单据的感觉,上面是单头下面是明细,或许会让用户觉得亲切些,因为他们纸张的单据就是这样,呵呵,不自卖自夸了!下面说说我的改动思路。

我首先那老界面的那些按钮通通都放在了工具栏里面,这样保持了风格的一致,用户只需要知道这里可以实现他想要的功能,在工具栏里我放了一个输入方式,这个是代替老界面中的选择单据明细输入方式面板的,这里也统一了,接下来,我把统计数据放在了单据明细列表的底部,作为合计出现,这样迎合了用户的习惯,跟着我为搜寻面板里加入了单据状态和采购日期这两个搜寻条件,并为单据列表表格中的每一列加了排序功能,使查找单据更方便。

这里要说说搜寻面板,我把搜寻面板做成了滑入滑出式的,像vs.net中的调试面板一样,默认是隐藏在页面底部的,鼠标移上去就显示出来,还有一个问题也是用户经常反馈给我的,他们说我做了一张单,可是我不知道加到那里去了,看不到,只是提示新增成功,可我希望即刻看到那张单出现在单据列表里,并用标识出来,针对这个问题我的解决方法是,当用户新增一张单成功后,我会把这张单显示在单据列表表格的第一行并用加粗的字体和背景颜色标识出来,然后自动滑出搜寻面板,让用户第一时间看到。

下面重点说说单据明细列表维护的改进,大家也许发现我去掉了老的单据明细输入面板,也去掉了新增,保存,删除,取消,选择商品那几个按钮,选择商品按钮我放到了工具栏里了,作为选择出现,那这样怎么样去维护明细信息呢?我的解决办法是这样,因为用户录资料时习惯使用键盘多过使用鼠标,而尤其爱用回车键,我的单据明细表格在页面一加载进来的时候默认会出现一个空行,空行里的单元格里面实际都放了输入控件,一旦单元格得到焦点我就会在表格里在加一个空行以备下一行的数据输入,因为如果不这样那就必须依赖回车才能加空行,而有时候用户又会使用鼠标去点,呵呵,“用户永远是对的”!这样用户输完一个单元格使用回车或Tab键或鼠标移动到下一个单元格,当他整行数据输完时一打回车自动跳到刚刚加的那个空行,而系统又自动的为表格加一个空行,直到其输入完成。那么使用这种方式,用户的输入方便了也提高了效率,不用到处点,而用户要改一个数据也只需要直接在对应的单元格里面改,想要删除时只需要点一下那行数据尾部的删除按钮,呵呵,应该是要比老界面的操作方式方便快捷多了!

好了,差不多就是这样了,各位看官如果你有自己的看法或建议或我设计不足的地方,欢迎您指正,呵呵,这只是我自己的一点记录而已,我也不是界面设计的行家,高手看了莫笑!