设计师应该知道的16个UI优化秘诀

标签: PS 教程 & 设计文章 ui设计 UI 用户体验 | 发表时间:2013-07-13 00:30 | 作者:kingtent
出处:http://www.uisdc.com

优异的用户界面可以让用户用得顺心,从而提高转化率(conversion rate),换言之,好的 UI 在使用与销售层面上形成双赢。本文整理了16点优化用户界面的方法,希望对大家有所帮助。

本文原作者加拿大 UI设计师Jakub Linowski

单栏型式优于多栏

单栏型式让你更能掌握自己的内容,从顶部到底部一气呵成,用故事引导读者,最终是要诱引他们「采取行动」(call to action,下称CTA,意指下载或消费等目的);而多栏反而可能导致读者分心。

 

不要劈头销售产品

「略施小惠」给使用者,贩卖的意图不要设计得太明显。小小的优惠或礼物,对未来的销售会带来大大的帮助。

 

统一相似的功能,避免支离破碎的UI

浏览网站时,我们很常看到琳琅满目的元素或特色,但它们的功能毫无二致,而相似的选项太多,只会提高让使用者无所适从。倘若发现自己的网站内有以不同 型式重复相同功能的状况,不妨考虑重新设计UI,把类似功能整合起来。譬如图中「Customer Service(客服)」、「Contact Us(联系我们)」其实是一样的意思,应当保留一个选项就好。

 

使用者见证或提出销售实据

「社会认同」(social proof)是刺激转换率很好的策略,自己再怎么天花乱坠终究只是自吹自擂,请使用者见证或数字实据才有效。

 

主要目的请反覆强调,别只提一次

希望使用者点击的连结或按钮(比如购买或下载),别只出现一次,可以考虑放在单栏网页的顶端与底部,或在多个页面呈现。

 

清楚区别三种功能性(可点击、已点击、纯文字)元素

可点击的元素(连结、按钮)、已点击的元素、纯文字三者彼此应该以颜色、深度或对比等各种设计技巧清楚区隔,让使用者浏览网站畅行无阻。例如左图,蓝色字体是连结,黑色字体是使用者点击的选项,或者是使用者正在浏览的页面。

 

突显推荐方案

如果服务有多种选择,请把最推荐的方案强调出来,如左图就将「product X」特别放大,Y、Z 缩小。

 

善意提醒vs. 突兀确认

如果使用者更改了某个选项,用一行文字提醒他们可以「复原」就好,无需大费周章设计「再次确认」的跳出视窗。因为多数时候使用者的动作都具有意识,后者太突兀,可能让使用者觉得被纠正而产生被冒犯的感觉。

 

清楚阐述目标客群

描绘适合使用你服务或产品的客群,可以连结到更多相似特质的人,同时也让他们感受自己的独特性。

 

肯定,避免犹豫不决

语气应该直接且肯定,优柔寡断是大忌,讯息中如果出现「也许」、「有趣吗?」、「想要吗?」等疑问字眼,在显示自信与强调权威上可能还有进步空间。

 

采用强烈对比

CTA 应该与众不同。运用色调、深度、互补色等方式,将CTA 跟其他网页元素区隔开来。

 

产品的诞生地点

说明你、你的产品或服务来自何处,就像在自我介绍一般,赋予人性化的亲切感受,而且强调产地或许也会带来品质保证的效果。

 

表单问题愈简化愈好

注册表单太杂,使用者往往容易不耐烦而半途放弃,问题尽量少而精简。

 

 别把选项藏起来

下拉式选单虽然不占空间,但却让选项更难被察觉。适合下拉式选单的问题是可预测性的或者人人皆很熟悉的时间(如出生日期)或地理位置,跟产品或服务有关的重要问题选项,最好并列在页面明显的位置上。

 

 连贯顺畅的页面

不要让使用者产生「已经卷完页面」而实际上根本还未看到底部的错觉。制造一种视觉型式或节奏,令使用者得以顺利浏览完整个页面,才不会白费苦工。

 

 不要分散焦点

如果你的网页唯一目的是要触发使用者卷到底部时「采取行动」,那中间安插的任何连结都可能导致他们分心,甚至将他们带离你的网站,因此必须小心谨慎的安排连结数量与位置。

 

原文出处: Jakub Linowski
译文出处: Inside

 
================ 关于优设网================
“优设网 uisdc.com“是一个分享网页设计、无线端设计以及PS教程的干货网站。
【特色推荐】
设计讲座:每月邀请国内互联网公司设计前辈及行业总监在群内及YY语音(YY频道:15335158)分享实战经验。
设计微博:拥有粉丝量40万的人气微博 @优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航: http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

youshege
 

优设哥向您推荐:

非科班如何成为UI设计师?

〖深圳&上海&广州求职〗网页设计师(3人)

设计师应当知道的20大UI设计原则

〖广州&北京求职〗网页设计师(2人)

UIweek 国内首家UI类杂志下载
无觅

相关 [设计师 知道 ui] 推荐:

设计师应当知道的20大UI设计原则

- - 优设(UISDC)
清晰度是界面设计中,第一步也是最重要的工作. 要想你设计的界面有效并被人喜欢,首先必须让用户能够识别出它. 比如当用户使用时,能够预料到发生什么,并成功的与它交互. 有的界面设计得不是太清晰,虽然能够满足用户一时的需求,但并非长久之计,而清晰的界面能够吸引用户不断地重复使用. 2.界面是为促进交互而存在的.

设计师应该知道的16个UI优化秘诀

- - 优设(UISDC)
优异的用户界面可以让用户用得顺心,从而提高转化率(conversion rate),换言之,好的 UI 在使用与销售层面上形成双赢. 本文整理了16点优化用户界面的方法,希望对大家有所帮助. 本文原作者加拿大 UI设计师Jakub Linowski. 单栏型式让你更能掌握自己的内容,从顶部到底部一气呵成,用故事引导读者,最终是要诱引他们「采取行动」(call to action,下称CTA,意指下载或消费等目的);而多栏反而可能导致读者分心.

优秀设计师应当知道的20大UI设计原则

- - 雷锋网
清晰度是界面设计中,第一步也是最重要的工作. 要想你设计的界面有效并被人喜欢,首先必须让用户能够识别出它. 比如当用户使用时,能够预料到发生什么,并成功的与它交互. 有的界面设计得不是太清晰,虽然能够满足用户一时的需求,但并非长久之计,而清晰的界面能够吸引用户不断地重复使用. 界面的存在,促进了用户和我们的世界之间的互动.

设计师应该知道的15个UI优化秘诀(续集)

- - 优设(UISDC)
@一人前端 上期那篇 设计师应该知道的16个UI优化秘诀,非常受欢迎,小编看到很多同学都mark了,不知道阅读了没有呢. 可不要存起来就抛之脑后咯,今天续译的文章已经出炉了,赶紧来瞧瞧. 第一篇译文在此: 设计师应该知道的16个UI优化秘诀. 本文原作者加拿大 UI设计师Jakub Linowski.

[转载]优秀设计师应当知道的20大UI设计原则

- - 妖人团P团
原文地址: 优秀设计师应当知道的20大UI设计原则 作者: iveodesign. 清晰度是界面设计中,第一步也是最重要的工作. 要想你设计的界面有效并被人喜欢,首先必须让用户能够识别出它. 比如当用户使用时,能够预料到发生什么,并成功的与它交互. 有的界面设计得不是太清晰,虽然能够满足用户一时的需求,但并非长久之计,而清晰的界面能够吸引用户不断地重复使用.

UI设计师的面试过程

- - ITeye博客
Palantir Technologies是一家提供分析、整合、可视化各种数据的IT型技术公司. 在该公司,前端工程师和后端工程师有同样的面试过程,前端工程师也需要的一定的编程基础. 该公司技术博客Palantir TeckBlog日前发表了一篇博文《The UI Design Interview》,介绍了该公司面试前端设计师的过程及一些心得.

小而酷:看 37signals 如何招聘 UI 设计师

- keso - 爱范儿 · Beats of Bits
37signals ,全世界效率最高的软件公司之一,保持着“小,美,酷”的特征,十多个员工分散在两大洲八个城市,是协同工作的典范. 最近 37signals 想招聘一名 UI 设计师,看看这份信息量十足的“招聘启事”吧,你能获得什么启发. 我们相信,如果一个公司没有伟大的 UI 设计师,它就不可能成为伟大的公司.

设计师的好帮手:UI Stencils 全套工具

- archer - 爱范儿 · Beats of Bits
想要设计出绝佳的应用程序,想要勾勒出迷人的 UI 原型图,想要把转瞬即逝的灵感定格在纸面上,那可千万别错过这套 UI Stencils 工具. UI Stencils 工具分为两大类:UI 元素模板,空白草稿板. 它们既可以单独使用,又可以混搭在一起使用. UI 元素模板分为 iPhone ,iPad,Android ,Windows Phone ,Website 这五个品种.

通往优秀UI设计师之路的20个路标

- - 互联网的那点事
导读:界面设计师Joshua Porter在自己的博客中发表了这篇文章,文章中列举了20条用户界面的设计原则,这些原则是设计师们在设计工作中需要遵循的,它们能够给设计师们提供较好的指导工作. 界面的存在,使得用户和我们的世界互动性加强. 他们可以帮助用户清晰、阐明、启用等显示关系,它不仅让我们做事有效率,还可以管理我们的应用程序并访问相关的服务.

非科班的如何成为 UI 设计师?

- - 图月志
因为我自己是一个 0 美术基础、非计算机、非艺术类科班出身,但从事视觉设计工作的同学,所以很多大学里学着不喜欢的专业,想要转做设计但又不知从何开始的朋友都来问过我类似「我怎么才能成为一个 UI 设计师. 首先请想清楚为什么想转设计,以我的经验,一般在大学里想转设计有这么一些原因:. 设计尤其是视觉设计门槛低,以前我身边会两下 PS 的大学生都能早当家,生活费完全不用愁的,而视觉设计给人感觉跟每个人的生活是相关的,可能会让人错误地以为只要审美品位到一定程度的都能做好设计.