谈谈对交互设计与原型设计的认识

1）刚接手了一个任务，做一个手机上的充值界面和食行卡申请，

要求----手机用户界面

充值界面：1、客户可以选用支付宝、银联、充值卡等充值。

分析：

1、通过支付宝、银联、微信的只要选择和输入充值金额就可以了；而充值卡要输入卡号和激活码、

2、还有是否要让用户改变充值的账号（也就是为他人充值）；在充值界面是否让用户看到以往余额？；

3、最后就是对用户充值后的一个反馈页面（这里会出现两种情况，充值成功；充值失败；）这个页面是一闪而过还是停留在那里等用户下一步操作；他下一步会做什么？返回到充值页还是去别的什么地方；对于充值成功如何反馈给用户，只有一个提示还是有一此表情，想一下，你掏了钱你会希望看到什么？；要是充值失败了你要如何安慰你的用户？

    当你能列出这些问题时，那要恭喜你!你以入门了，那么怎么触决这此问题呢？下面就让我们就来一步步的去解决这些问题。

开始吧：

    首先我的解决方法是，把这两种情况的充值放在一个面页，分上下部分，上半部分放支付宝、银联、微信充值内容，开始吧，先选择你所充值的价格和输入充值数量（就想当于你去交电话费一样，先说出你要充多少钱）

    然后选择你所付款的方式，这样本应该完成你愉快的交易了。可是，【这里问题来了】

我刚才把充值卡充值放到了下面，这样的话要放两个确定充值按钮吗？答案是肯定不可以。

那让用户再看一遍充值卡充值的内容在确认充值？这样行到是行，不过，要是你购物时，你选好东西要付款了，可是你又看到别的东西，这样肯定会打断你的视线，到最后你还能愉快的付款吗？所以这样不是最好的解决方法。

    那么要怎么解决呢？把充值卡充值和支付宝、银联充值分成两页（一个叫在线充值；一个叫充值卡充值），这个主意不错，可以试试，但是如何排列？首先我们是有一个进入充值界面的按钮，那么我们是分别用两个按钮来进入这两个页面吗？这样操作起来就有点烦锁了，我要是以经在充值卡充值界面我突然想用支付宝充值我是不是要先选返回再进入在线充值页呢？

    那么再把两个页面并再一起试试看，通过一个小导航按钮进行这两个页面的切换。就这样了，最后效果（如图-原型 还未上传）

到了这一步这个页基本就完成了，那么接下来我们要做什么呢？当然是确认充值了，然后看我们把钱花到那去了，对吧！刚才我说过会出现两情况，小伙伴可还记得（不记得没关系，看上面我们分析的结果。

所以小伙伴们要养成一个好习惯：1、先例出你要的需求；2、分析内容，用思维导图或者说用大括号例出你分析出解决的问题点，是不是这样就可以着手做了呢？当然不是，还得画出流程图也叫站点图，当然我这只做一个小的页面就没画了，但是要是遇到大的多功能的就一定要通过搭建流程图来分析这样才不会漏掉。）

分析的结果是有充值成功和充值失败这两种情况对吧！

    先说说充值成功吧！那么我刚才问了反馈出一种怎样的结果？是有表情的还是直接一个提示；是一闪而过，还是要用户确定。明白人都能看懂当然得有表情，还得有信息内容告诉你的用户他把钱充到那了，这是你就是一个充当小管家的角色了，先给一个成功喜气的表情告诉你的客户他以成功充值，那么接下来你得告诉他充了多少钱，现在帐号的余额是多少？对吧！相信你要是用户也希望能看到这一点，这和你去充电话费是一样的道理，所以这里的内容是这样的“你以通过安卓手机机成功充值￥100元；你的当前余额为￥134元”当然这句话不能直白的这样写要通过美术来设计一下会更好看地些，这样一个有内容的反馈当然不能一闪而过了，所以我们要让用户来确定。到这里就基本完成，只须再放上一些按钮就好了，比如返回（如果只是安卓机有没有返回都一样，因为安卓机有一个热键返回）。在这里如果你够细心你可能会发现 返回 进入到之前充值时的页面，那 确定 会到那里呢？默认的 确定 只是关闭当前页，这样就可以不放置 返回 键了，当然你也可以再加入一个按钮如： 

去购物、去逛逛

这样就算完成这项任务了，简单吧！聪明的你会不会已有更好的方法呢？

    接下来再看看第二个任务的条件要求吧！

食行卡申请：1、对新用户充值满￥50以上的可以申请食行卡;2、需要用户填写收货地点（但是又不是所有的地点都可以送达）3、要让用户知道此卡的作用；4、此卡分主副两张同时发放；5、对此卡的挂失和补办分别办理并收取一定的费用；6、对于以前申请过的不可从新申请只可挂失，补办；

    还是老规矩，先分析，聪明的你有没有一点思路了呢？这回我把问题留给大家了，具体的到下周我们再来一起分析吧，接下来的时间就留给小伙伴你们了，只想不做怎么会有进步？一起加油吧！下周见！