【译文】6个界面设计的小改变,使你的app从平凡到惊艳

原文作者:Proto.io

原文地址:https://medium.com/p/88ecb840622b

现在,你的移动端app已经完成了从线框图到高保真原型图的设计,但总觉得好像还缺点什么。或许是它用起来并没有想象中的流畅,又或者是用户体验方面的设计并没有让你感到惊艳。你想让你的app看起来具有魔力,但是现在看起来,更像是你爸突然从你耳后变出了25美分的硬币的小惊喜,而不是大卫·科波菲尔把金字塔变没了的那种震撼。

这时你会怎么做?难道将已做的一切推翻,然后重新从草图开始设计?

又或者使用魔法,做一些设计上的小变动,使app能够得以保留并完善。毕竟,在设计出线框图或者测试版之前,你会非常的关注设计,所以一定有一些好的想法存在于现有的app中——更何况如果将之前辛苦的工作都浪费了,不是很可惜吗?

我们采访了6位设计师,不知在他们看来,哪些细小的设计调整能够对ui界面设计产生最大的影响呢。或许他们的回答能启发你,如何在整个app的设计流程中完成完美的最后一笔,使app能够由优秀变为大受欢迎(甚至是由大受欢迎变为令人惊艳!)

1.同样的内容出现在小设备上,记得去掉多余的部分

当你在一款小的设备上使用app时,很有可能你根本就不愿在阅读上花费大量的时间。不仅仅是因为从较大设备上复制而来的过多内容降低了用户的阅读速度,同时也会使用户体验变差。

Maureen Kerwin是一位在Nokia Networks@nokianetworks)工作的交互设计师。关于如何立刻使某一款app的设计得到提升,Kerwin的建议是——设备转换时,重新审视从大设备中复制而来的内容,同时砍掉不需要的部分。

“注意在所有复制的内容中,那些重复或者太过啰嗦的地方,”Kerwn说,“一个app中总有可以删除或者修正的内容,修正他们能使整个软件更加清楚和简洁。”

在这种情况下,交互设计师的好搭档或许就是编辑或者测试。当你不能决定哪部分需要砍掉(或者简化)时,盯着看几秒,你的视觉目标系统此时起着最重要的作用,他们会告诉你如何去做。

2.获得用户反馈

如果你急切的想知道app中的ui界面设计是不是有效,光是想想是没用的,最直接快捷的方式就是从用户那里获得答案。

Mike De’Shazer(@itsdeshazer)是CodeCloud.me@CodeCloudMe)的联合创始人和CEO,CodeCloud.me是一个教用户如何编程以及制作app的互动平台。了解你的用户,从他们中间获得反馈,是使你的界面设计变得更为有效的最可靠的方法,De'Shazer说。

“不同的产品目标有着不同的ux优化方法,”De'Shazer说,“对于任何一款产品来说,完善界面设计和操作体验的最好方式,就是更充分的理解使用这些产品的人们。”

当你的app无法达到你的预期目标时,找些测试用户使用产品的原型。他们对于完善操作体验的建议,或许是你能得到的最有价值的反馈。

3.使app操作快捷

你的所有现有用户(以及潜在用户)都有着对于更快的运行速度的追求。如果你感觉你的ui界面并不是你想象的那种体验,或许最大的问题并非界面设计,而是app本身的运行速度。

GadgTecs@GadTecs)是一个展示app,数码产品以及科技消息的技术博客,Amna Rizvi是其中的一位app开发者。作为移动app的开发者和观测者,Rizvi认为速度和启动时间是优化界面设计最重要的两个方面。

“对我来说最重要的就是app的启动时间,”Rizvi说,“app应该有一个令人眼前一亮的闪屏,并且加载的速度应该非常非常快。”

毫无疑问,第一印象是非常重要的,Rizvi说。“如果用户打开app,但是需要等待很长的时间才能开始使用,那么他们就会毫不犹豫的关掉app。所以在我看来,无论app体积有多大,都应该能够迅速反应,方便操作。”

最近的更新没有使app的使用更快?如果没有,那快去看看操作流程有没有得到合理的优化。除了需要使登录速度更快,还可以考虑在用户界面中加些动画效果,这样也可以使等待的时间看上去变短。如果这仍旧不能使你的app更有光彩,那么请看下面的建议。

4.用动画装饰你的UI界面

Andrew Riley是Ticketlab@ticketlabUK)——一家在线票务网站的创始人。他同时也是一位数字顾问和前端工程师。

对Riley来说,优化UI界面最快捷的方法就是添加动画。

“如果想要改善网站页面或者app的使用感受,我的第一建议非常简单:就是使用动画。我说的动画并非指那些跳跃的logo或者flash时代的镜头光晕之类的,而是指精妙的动画效果。”Riley说,“其中最简单的形式,就是在一个悬停状态中添加背景的颜色转变,这时只需要提供0.3秒左右的时间,颜色呈线性变化。这样做能直接使你的UI界面区别于网站,而更像是一个app。”

这个小的设计改变最好的地方在于不会花费太长的时间,但可以收到良好的效果,Riley说。“动画能够以灵活的方式被应用于几乎所有的状态转变,从而能够用设计真正的影响生活。尽管这种由CSS编写的功能出现的时间还不久,在很多app中尚未得到合理的利用,但是它只需要多花费很少的时间,就可以在各类项目中使用。”

One Click Here@Oneclickhere1)的CTO Gert Hattingh也同意这样的观点。他说,在One Clicl Here,设计师和开发人员会在多种平台上测试ui界面,确保动效流畅且表现精确。

“在配合快速的环境中工作,能使你在开发阶段就开始测试ui。我们更偏向通过采用动效转换来指导用户进行下一步操作,”Hattingh说。“当给按钮添加动效后,不仅可以帮助用户了解接下来需要进行哪些操作,还可以提升整体的操作体验。”

动效能够吸引用户的视线,通过具体的交互操作指导他们使用产品,还可以给你的ui界面增添非常缺乏的吸引力,但是切记不要做得太过——正如我们下一位分享者提醒我们的,有时候少即是多(less is more)。

5.简化,简化,简化(重要的事情说三遍)

没有用户希望被视觉上过于强调的不和谐“噪声”所打扰,无论是颜色太过自由夸张的使用,还是视觉质感的过度滥用(即使你是拟物化的忠实信徒,你还是会不由自主地在设计中过度的使用阴影和光影)。

Amrita Talwar是一位在Android以及iOS app中都有着丰富经验的开发者,这其中包括PoolMyRide(@poolmyride),一款帮助用户寻找拼车伙伴的跨平台app。依据Talwar的经验,使ui设计从优秀变为大受欢迎的关键就是始终保证它是简单的:

“设计一款app就像是编写一首没有歌词的歌曲——它理应能被全世界的人所理解。要使设计出的app界面美观且用户友好,我会遵从以下几点:

——考虑使用material design的扁平化icon,并且确保你的ui界面会根据不同的设备缩放尺寸。

——减少点击、手势或其他用户需要进行的交互操作的次数。无论你想让用户进行什么操作,都应该尽可能的减少点击的次数。

——保持ui界面的简洁。作为一个设计师,有时真的控制不住自己在ui界面中添加许多不必要的元素,但是一定要优先选择用户真正需要的。有时候最好的方式就是只保留最重要的功能,而放弃掉那些”有它会更好“的元素,否则你的整个设计很容易变成一个网络垃圾。”

改进后的设计应该能够减少用户的使用困惑。你的界面设计应该帮助他们使用app——而不是阻碍他们的操作。

6.跳脱出惯有的设计思维

有时候,无聊设计的罪魁祸首是缺少新的点子。这种情况对于身处一个行业多年的人是很常见的,尤其是多年还处于同一研究方向的人更是如此。你有没有注意到,不知从何时起你的许多ui界面开始相似——一样的闪屏,一样的动画,相似的按钮、Icon和字体?

或许是时候放下你最近的工作,去看看别人的app来冲击你的固定设计思路了。推荐从今年最佳app的前十名榜单开始看起,这些app来自于众多富有潜力的公司,吸收当下最具革命创新的ui设计理念。仔细观察这些app设计的不同之处,思考自己能从中获得哪些经验。

对于一个刚入行业的新人,也不要总是局限于移动端app的设计,最好能够涉猎广泛。比如玩电视游戏可以学习如何有意思的讲故事去艺术博物馆参观可以激发很多精彩的想法。哪怕仅仅是在业余时间和你的孩子(或是侄子、侄女)玩耍,也能够对ui设计有着更加深入的思考。

不想从椅子上离开?只需要好好读读这篇文章,看看其他设计师在陷入创意低谷时如何获得好点子的。有时,灵感就存在于最不可能的地方。

以上这些来自6位成熟设计师的圣经指南,有没有使你获得灵感,从而使你的ui界面从平庸变为美的产物?在推特上告诉@Protoio吧!

微博:@sure天亮 ⬅️日常蛋逼为主

转载请联系本人

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 196,200评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,526评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 143,321评论 0 325
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,601评论 1 267
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,446评论 5 358
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,345评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,753评论 3 387
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,405评论 0 255
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,712评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,743评论 2 314
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,529评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,369评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,770评论 3 300
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,026评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,301评论 1 251
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,732评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,927评论 2 336

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,142评论 25 707
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 11,952评论 4 60
  • 从去年开始,断断续续在喜马拉雅听《西游记》。听到50多回了。 好几次被孙悟空感动。 有时候会想想猪八戒这个存在。会...
    menghu阅读 257评论 0 0
  • 一从梅粉褪残妆 涂抹新红上海棠 开到荼靡花事了 丝丝夭棘出莓墙
    虚拟世界的小丸子阅读 152评论 0 0
  • 引语:这篇文章主要以信息为载体,通过图片和相关文章来构建一个具有宏观视野的认知框架。我们希望你在阅读后,能够对中国...
    不忘思考阅读 290评论 0 0