美文网首页
设计总结之企业钱包

设计总结之企业钱包

作者: Talin | 来源:发表于2016-12-11 15:30 被阅读118次
    企业钱包效果图

    企业钱包这个项目是我进入纷享销客来接手的第一个完整的项目,从今年5月项目启动到10月份5.4版本的上线,中间历时5个月,其中2个月设计调研及落实,2个月的设计跟进工作。在这期间遇到的问题总总,也收获多多,最后在这里做一个设计总结,作为一个阶段性的展望。

    (项目进度)

    设计与产品

        设计如果不能了解产品是很难做出符合产品预期的设计稿的,这之间的关系打个比方,就像医生看病一样,看到病人打喷嚏就一股脑的开治感冒的药,但实际也有可能是因为换季引起的鼻炎。在设计之初,我将产品的关键字都列举了出来,统一、高效、轻松、愉快是纷享销客整个集团的设计输出之基础,企业钱包是属于这里面小小的一个分支,所以首先是要遵循这样一个设计理念再进行发挥的,其次就是我单独从企业钱包剥离出来的关键词,也就是沉稳、互动、趣味及品牌感知。当然,作为一个企业级的钱包,里面一般都存放着万级以上的资金时,安全性必然是整个企业钱包中最最重要的设计核心点,也只有在安全性的基础上,我提取的所有这些设计关键词才能更好得到发挥。接下来,我就针对安全这个核心词再次进行了一次小小的头脑风暴。

    (关键字提取)

         网络上搜索关键字“安全”的图片,大多出来的都是锁、保险柜这些,这些具象的物品在我们真实生活中代表着安全的象征,保险柜里的钱,锁住的宝藏等等,但是结合我们产品真正的运用场景,企业钱包作为纷享销客里面一个应用,除了希望企业将钱放心的放置到我们这个平台中,同时也是希望这些企业用户能够通过企业钱包更好的在我们纷享的生态系统里面进行消费,例如为提升员工专业技能在培训助手里面购买相匹配的培训课程,为激励员工准点签到而为考勤红包充值等等,所以单纯的用锁或者保险柜这样的概念就会局限而且也过重。有意思的是我在搜索图片的时候看到了监控摄像头的概念,其实这也是一个安全性很好的代表,试想一下,除了监控隐私性的烦恼,但确实也带来了安全保障,这样现实生活类的场景提现其实在我们企业钱包中也有相应的表述,就是我们钱包款项的资金明细,钱从哪里来到了哪里去,每一笔款项都清清楚楚,这也是增强安全属性的一种思路。

        当然这个和设计扯远了,收回来的话锁和保险柜这样的安全概念不适合我们的产品述求了,这时候又拉出了盾牌,像我们神盾特工局、美国队长和复仇者联盟的盾牌系列,回想一下漫威系列这种盾牌的应用,多在正派人物,且起着保护美国人民的重任,是不是就给人一种值得信赖的感觉?除了这个影视作品,我们市面上很多杀毒软件的主要视觉标识也是盾牌类的应用,无非也是起的一个安全保护的作用,但同时和锁保险柜比起来,够轻,而且局限性相比起来影响会小很多。所以在企业钱包的图形辅助设计中,我大量的运用了盾牌的设计表意,就是希望在图形上给人一种,“喔,企业钱包还是很安全的!”视觉暗示。像转入转出、安全认证,甚至是企业余额这种支付手段的图标,我依旧应用的是盾牌的视觉

    安全感-图形 安全感之资金明细

        所以设计师对于产品意图的思考是非常重要的,这就是为什么一直倡导让设计师也尽可能的提前介入到产品的前期,并且参加的产品需求的宣讲,因为对于产品的理解更透彻,是更有利于设计师开展工作的。

    设计与交互

        视觉设计师作为产品和交互的最下游,拿到交互原型图时是非常忌讳直接生搬硬套的,设计师是需要了解到产品的意图、设计风格的延续和平台性的差异性,并带着这些思考来看交互再开始设计。例如我们银行卡管理页面的视觉与交互原型存在很大的差别,交互稿的布局为列表样式,而视觉最终呈现稿是卡片的样式,主要原因是考虑到一行列表承载的信息量有限,同时这样左右都有信息和操作按钮的布局特别容易受到到平台差异的影响,所以最终就采用了卡片式布局,尽量将操作按钮单拎出来且一行只显示一条重要信息,这样既清晰捕捉到关键信息点,同时布局也不会因为平台差异而受到很大的影响。

    交互与设计 平台差异导致的屏幕宽度的变化

        所以设计师在看交互设计稿的时候要多思考这样是否合理,不要形成惯性思维把细节也一带而过,交互只是对各个功能点提出合理化的建议,但真正落实到细微的布局和位置时,是需要设计师这边在UI层面来体现的。

    设计之下

        在我们生活中,颜色所表达的情绪暗示里,蓝色是代表着信任、冷静、睿智,所以很多工具类应用的主色调都是蓝色,例如AppStore和知乎,而在企业钱包的设计用色上,之前我们讲到过,安全性是企业钱包最重要的核心点,所以在色彩中是采用蓝色渐变作为主色调。请注意,这里是蓝色渐变而并不是纯蓝色,这么做的原因是为了在设计上增加界面的品质感及细腻度,但如果又采用色差过于明显的蓝色,这样的结果与我们扁平的设计风格述求也是相悖的,所以采用了这种微妙渐变的蓝色作为企业钱包的主色调。

    主色调的选择

        在之前我在提取企业钱包关键字的时候,提到了互动及趣味性,在这里我举一个考勤红包的例子,首先考勤红包里面的钱是来自于企业钱包,设计的初衷是为了激励员工按时打卡签到而给的鼓励金,这个在设计上,首先色调是沿用了红包的红色背景主色调+金色文字的搭配,给人一种喜悦的感觉,其次在图形上,设计的是一个手抓住了红包的动态场景,加上动态变化的金额,这样的设计应该是能够让用户达到愉悦的心理预期。  

    考勤红包的互动趣味

        当然趣味性的设计也肯定少不了运营页面所营造的氛围,这是我为企业钱包的现阶段的2个最主要的场景所做的落地页,形象的图形化设计所传达的内容,绝对是要比纯文字的介绍更让用户能够接受的。还有我们运营banner的设计,也是通过趣味性的图形表达,让用户了解我们的企业钱包,并且也愿意去接受。

    运营落地页 运营banner页

        企业钱包的设计不仅仅只是在移动端,在web端也是有的,W端的企业钱包和M端的整体设计风格保持了统一,同时也遵循了web端的设计规范,这样让用户在不同平台下使用企业钱包的时候,不会有太大的跳脱感。

    web及app端的企业钱包

    结语

        在企业钱包中,我们通过设计的运用让产品更符合用户的预期,所以,设计在产品给用户的最终呈现中,起着很重要的作用,设计绝对不是死撸图撸死图的。当然最最重要的也是和整个团队的紧密沟通和密切合作分不开的,项目中每轮环节的顺畅进行都保证了我们产品能够最终上线,并呈现给用户。

    相关文章

      网友评论

          本文标题:设计总结之企业钱包

          本文链接:https://www.haomeiwen.com/subject/rtahdttx.html