每次在地铁站充值面前都会有一块屏幕,提示你卡上余额还有充了多少钱,但每次看都很麻烦,找不到关键信息。所有自己就动了再设计的想法。
先看原有的界面样子:
问题主要在于:
信息摆放缺少逻辑
重点信息没有得到突出
再设计:
首先模拟充值的过程,一般生活中常见的情形:
“我卡里还有多少钱”
“您卡里还有105.2块,请问您充多少钱”
“充75块”
“收您100块”
“这是找您的25块,卡里一共还有180.2块”
以此可以得到大致信息的如下:
账户余额-充值金额-找零-充值后金额(“充值前金额”并列呈现),除外以外还有一些与充值流程无关的信息,充值次数-车票类型-有效期限。
拿到信息后经过整理设计,得到如下样子:
当把充值卡放到查询机器上,直接显示查询界面,左侧显示账户余额,右侧显示车票类型和有效期并进行弱化。
当输入充值相关信息时,则显示充值界面,成功充值的话语突出显示。
注销因为没有见过,所以没有设计,这是我第一次对原有东西再设计,欢迎拍砖讨论。
一句话总结此次收获:
在需要的时候显示合适的信息,而不是一股脑的全放到上面。