非出网教程/手机应用/内容

网站色彩、布局之间的比较:支付宝VS财付通_交互设计指南

手机应用2024-02-11 阅读()
支付宝 (中国)网络技术有限公司是国内的第三方支付平台,致力于提供“简单、安全、快速”的支付解决方案。支付宝公司从2004年建立开始,始终以“信任”作为产品和服务的核心。旗下有“支付宝”与“支付宝钱包”两个独立品牌。自2014年第二季度开始成为当前全球最大的移动支付厂商。

  客户量:

  支付宝:依托淘宝网,3亿客户

  财付通:依托QQ,1.5亿客户

  色彩方面:

  共同点:

  Logo都用了蓝色与橙色,

  红色警告、绿色安全、蓝色超链接,这已经成为两家公司的共同点。

  不同点:

  支付宝:继承了淘宝网的风格,用了大量的暖色元素-橙色,其中导航条橙色渐变,banner大色块暖色炫目图。偏向iPhone风格。

  财付通:大胆创新的色彩,浅灰色系+暖色图标,明暗度对比,黑白阴阳图标,表现丰富,把黑白灰运用的淋漓尽致。偏向windows phone7 风格。

  windows phone7 风格将打破iPhone式高光阴影界面局面,将成为接下来流行的趋势。从这点上说,财付通更具有前瞻性。

  视觉心理:

  支付宝:大量的橙色,给人激动、兴奋

  财付通:清新淡雅,给人冷静、平稳

  做为第三方支付,冷静更为合适。淘宝购物的时候用暖色系,它可以激发购物热情,这无可厚非,然而付费的时候,我的体会给人冷静的颜色较佳,因为不容易出错。

  口号:

  支付宝:“支付宝 知托付” 在页面上没有明显口号,这样不够有效的提高品牌宣传度。

网站色彩、布局之间的对比:支付宝VS财付通 三联

  财付通:“会生活 会支付”在logo旁,醒目表现,提高品牌宣传度

  图标:

  支付宝

  财付通

  相同点:图标都是饱和度高且丰富细致

  布局:

  支付宝:

  1、块面多:页面小块面太多,容易让用户眼花缭乱。用户群有个人服务和商家服务,虽然在页面上有大块的区分两者,但是对用户来说,还是有些混乱(请看下图);

  2、过于突出广告:用了高饱和度的图片广告在最重要位置,抢走了页面重点,弱化了目的信息;

  3、布局遗憾:我们希望在第一屏看到内容是:个人和商家享受的服务,然而在一般的分辨率显示器下,商家服务内容在第二屏才能看到。

  财付通:

  1. 色块大而少

  2. 色彩饱和度低,对比支付宝,财付通页面久看而不累

  3. 布局清晰,区域内容表达清晰易懂。我们很高兴一屏看到所表达的内容--登录和服务内容。

  综合:

  中国最牛的两家交互设计公司--淘宝和腾讯,一直在PK。这次我的交互体验的感觉,在色彩、布局等,财付通都略胜一筹。大概支付宝已经看到了自己的不足,开始改版了。让我惊喜的是,这次改版支付宝驾驭在财付通之上,做了很多的优化,改版前和改版后简直判若两“人”。

  接下来介绍下改版后的支付宝。

  支付宝的进步

  1、 用色:支付宝开始模仿财付通用色了,降低了导航条饱和度了,灰底大块面,给人干净而整洁的感觉。

  2、 块面:倒影效果用得少了,块面的运用多了,页面更加清新淡雅。

  3、 布局:第一屏展示最重要的账户与交易,且把最具创意的年度账单放在醒目位置,当然这也是我们在第一屏想看到的。导航条保持原用横向, F型展示形式。差别在于支付宝用了通栏的展示账户信息,更加强调重点。

  支付宝这次改版很成功,优于财付通。我想财付通一定不甘落后,改版之日很快就要到来。支付宝、财付通在用户体验方面都在不停的努力着,有很多学习之处。我们能做的是:研究他们,学习他们。

  作者:ShiftBee

  文章来源:站酷网


微信支持多种语言,支持Wi-Fi无线局域网、2G,3G和4G移动数据网络,iOS版,Android版、Windows Phone版、Blackberry版、诺基亚S40版、S60V3和S60V5版。


……

相关阅读