再设计:北京公交充值界面改进方案

摘要:每次在地铁站充值面前都会有一块屏幕,提示你卡上余额还有充了多少钱,但每次看都很麻烦,找不到关键信息。所有自己就动了再设计的想法。

每次在地铁站充值面前都会有一块屏幕,提示你卡上余额还有充了多少钱,但每次看都很麻烦,找不到关键信息。所有自己就动了再设计的想法。

先看原有的界面样子:

问题主要在于:

信息摆放缺少逻辑

重点信息没有得到突出

再设计:

首先模拟充值的过程,一般生活中常见的情形:

“我卡里还有多少钱”

“您卡里还有105.2块,请问您充多少钱”

“充75块”

“收您100块”

“这是找您的25块,卡里一共还有180.2块”

以此可以得到大致信息的如下:

账户余额-充值金额-找零-充值后金额(“充值前金额”并列呈现),除外以外还有一些与充值流程无关的信息,充值次数-车票类型-有效期限。

拿到信息后经过整理设计,得到如下样子:

当把充值卡放到查询机器上,直接显示查询界面,左侧显示账户余额,右侧显示车票类型和有效期并进行弱化。

当输入充值相关信息时,则显示充值界面,成功充值的话语突出显示。

注销因为没有见过,所以没有设计,这是我第一次对原有东西再设计,欢迎拍砖讨论。

一句话总结此次收获:

在需要的时候显示合适的信息,而不是一股脑的全放到上面。