理财APP的视觉重构 随手记发力扁平化

2013年12月03日 13:50   投稿:   作者:张义   分享

  泡泡网手机频道12月3日 在APP应用流行初期,从PC端延续而来的模拟实物的视觉设计和交互体验,让用户不用抽象的理解就可以直观的认知和使用,曾一度盛行。

   当智能手机大面积普及,APP应用进入爆发式增长后,在市场认知体系已趋于成熟的环境下,碎片化,及时性,高频次,多样化的信息接触环境让用户的关注度被打散,耐心在降低。滥用形式模仿主义已经对用户在使用上造成困惑。突出视觉核心的极简主义扁平化设计风格正在成为新的潮流。

   理财APP的UI设计一直是一个难点,作为以数字显示为核心,直接产生数据,通过多维度的财务报表帮助用户整理财务的APP品类,在提供财务决策依据的过程中既要生动形象避免枯燥乏味,又要清晰直观展现数据维度。用户的习惯正在向轻量化变革,该如何把握这两者的平衡呢?随手记用一个革命大版做出了清晰的诠释。

   去繁就简 让视觉回归数字

理财APP的视觉重构 随手记发力扁平化

   扁平化设计风格本质上就是把良好的体验给了用户,把挑战留给了开发团队自己。随手记的V9.2革命版,采用了全新的扁平化风格UI设计,放弃了诸如阴影,透视,渐变等能做出 3D 效果的装饰元素。所有元素的边界都干净利落,没有任何羽化和阴影。

理财APP的视觉重构 随手记发力扁平化

   通过类扁平化,随手记因此变得简单,但在视觉上变得非常有吸引力。整个界面的配色平均会采用到6-8种颜色,有着鲜明的视觉体验,页面效果更加绚丽、明亮。它所使用的元素之间有着清晰的层次和布局,这使得用户在使用随手记中能直观的了解每个元素的作用以及交互方式。整个实现过程的背后,随手记团队在色彩平衡和底层实现上经历了严峻的考验。

   与其它品类APP相比,个人财务管理APP在界面内需要展现多维度的数字和强大的信息流。随手记新版带来全新扁平化简约清新风格,具备优秀的组织和展现信息的能力,可以让用户最大程度地减少学习使用成本。仅仅凭借直觉就大概能够明白每个对象、按钮的作用。

理财APP的视觉重构 随手记发力扁平化

   在UI细节上随手记对流水功能做了进一步优化。流水承担着查账、对账、统计的功能,新版的流水界面,将筛选和搜索合并成了搜索,放在了右上角,腾出了更多的空间给流水本身。金额上有细线图表,可以即时对比。并且还加入了手势操作,用户可以上下拉动切换前一段、后一段时间的流水,比较方便。

理财APP的视觉重构 随手记发力扁平化

   丰富精美的分类图表一直随手记的一大特色,然而光有好看并能清楚表达图表给用户记账时带来的温暖感受。本次改版随手记设计师团队通过数十个昼夜的挑灯夜战,几乎将所有的图表进行重绘,全部实现扁平化,让图表好看,耐看,易用。

   65项交互优化与全能搜索

理财APP的视觉重构 随手记发力扁平化

   拥有超过6000万用户的随手记老版功能已经非常全面,目前国内还没有另外一款记账APP能出其右。但是此前过于追求功能的全面也带来了一些体验上的问题。部分界面的交互过于繁琐,或者不统一。本次改版交互优化也是目标之一,最终优化的交互体验达到65项,匹配扁平化的风格,实现了操控体验的全面提升。

理财APP的视觉重构 随手记发力扁平化

   通过多年对记账用户使用APP习惯的跟踪和分析,随手记产品团队发现用户经常通过搜索财务流水记录来回顾和整理个人生活记录。本次新版也对搜索功能进行了重要的内化升级。新版将流水的筛选和搜索进行了合并,用户可以进行关键字快捷搜索,即搜即现,也可以使用高级搜索,筛选更符合需求的流水信息。通过搜索性能的优化,实现了更高效率的展现。

   全面瘦身的随手记加入自动同步

   目前,用户的智能手机中安装数十个以上的APP是标准动作,热衷新奇的年轻用户群体安装的APP数量甚至已过百。许多APP通过功能模块的简单叠加追求功能涉及面的大而全,安装包越做越大,多数已超过10M以上。用户手机的内存空间被大量安装包挤占,逐渐影响到智能手机在多任务运行中的效率。

理财APP的视觉重构 随手记发力扁平化

   随手记新版的扁平化优化也考虑到了用户智能手机运营环境,重构优化了80%以上的代码,通过扁平化的设计图片资源由原来的200多个,变成了130多个。这一系列的努力最终让随手记得包大小缩减至不到4M,在所有功能全面的原生客户端记账理财APP中,做到了最小,帮助用户腾出更多的手机内存空间,辅助提升运行效率。

理财APP的视觉重构 随手记发力扁平化

   不仅如此,新版随手记还响应了众多用户的要求,加入自动同步功能。用户记账后不用再点同步按钮,后台将自动为用户同步备份更新数据,避免用户在因遗忘、手机丢失、随意刷机等各种特殊情况中导致记账数据丢失的麻烦。

   在移动应用APP开始全面进入扁平化的阶段,一场为触摸优化而进行的视觉和触控交互体验上的竞争已经拉开序幕。一向在产品端反应灵敏的随手记,又一次在众多APP产品的犹豫不觉中,实现了“抢跑”。目前,APP产品端的竞争已经高度白热化,敢于在用户体验提升上自我革命的一小步,也许就是决定性的一大步。■

本文产品
苹果 iPhone5s A1533 16GB 电信3G(深空灰)
屏幕尺寸:4英寸 CPU核心数:双核 操作系统:iOS7 后置摄像头:800万像素 运行内存(RAM):1GB 电池容量:1440mAh 机身存储(ROM):16GB
推荐文章
扯扯车精品文章推荐