首页 > 建站资源 > 网站运营 > 让UI设计显得更简约的小技巧分享

让UI设计显得更简约的小技巧分享

时间:2013-04-10    作者:龙泰   来源:极客公园

谈简约设计的书籍有很多,互联网界也一直在有提倡简约设计的声音。有人说,看国内的各大门户的设计,通通都是文字和功能的粗暴堆砌,难道中国人真的不擅长设计简约吗。

产品长什么样是跟产品的受众有关的。我们看国内电视购物,从来都是以“有多少功能”的方向来推销产品的。或许我们的目标受众就是喜欢大而全的东西,并不是设计师和产品经理的错。为了迎合大环境的产品需求,我们不得不用各种可有可无的功能点来吸引用户。

臃肿易烦腻,简陋生欲望

产品功能多并不是好事,臃肿的功能会让产品本身的定位和识别度变得稀疏,同时带来的是在视觉和心理上的压力。也会让产品显得没有深度,感觉像是一下子就略过了前戏进入高潮了。初期的版本,只要保证那些能让产品的概念成立的关键功能点和特性就行了。

不过,如果产品太过简陋,仅仅局限于有限的使用场景的话,用户的使用频度就会很低,很容易被遗忘。这也是大多数旅行网站和 App 的痛处。

每次在斟酌功能点时,大概都会有这样的困扰。

能让产品“看起来简约”的简单技巧

我并不认为国外的 App 在功能上会比国内的要少。在实现同样的功能的情况下,国内的 App 设计并没有有意识地让界面看起来更简约。

产品设计的简约,最直观的感受就是 UI 设计了。在这里分享一些我认为可以让 App “看起来”更简约的几个重要的技巧

抑扬

美团网-抑扬

抑扬,就是对内容进行有抑有扬的对比处理,通过对比的手法能够让信息量在视觉上“显得”比实际上少。

错落有致、有强有弱的信息布局,让用户更容易地第一眼就把握了整体结构,从而快速找到自己想要的信息。就如同报纸的头条、各种大小标题一样。这些变化让人们的阅读更顺畅。想象一下如果报纸的内容全是大小一样的字体,恐怕没人会有阅读的欲望吧。

从运营的角度来看,通过对内容的强弱处理,还可以达到对用户的焦点进行引导的作用。比如有些网站故意把分享的按钮做的比其他按钮要大,位置更显眼,就是有意识地想让用户多进行分享,让内容更好地被传播。

抑扬可以是界面元素的大小、颜色、字体等等,能起到以下作用:

  • 让界面看起来更简约;
  • 对用户行为进行引导;
  • 帮助用户快速发现对他最重要的信息;
  • 强弱对比,减少阅读的压力感。

留白

亚马逊-留白

UI 设计中重要的要素之一就是留白的运用。文字、按钮等元素周围的留白越大,越能提升存在感。(这其实也是上面说的“对比”的一种变形)

留白不意味着页面的信息容量降低。

智能手机上下滚动是很舒适的,并没有必要为了让所有内容在一个页面内全展现出来而让字号变小。这样做反而会让信息更加难以阅读。

用户的视觉需要得到“喘息”。

信息容量大的界面,对用户来说是一种阅读负担。在设计这些交互界面时,要注意留白的运用。留白能让界面富有层次感,让用户的视觉得到“喘息”。

icon 也要尽量简单

简单的 icon

设计师通常都是在大屏幕下设计,而实际上有些细节在大屏幕上的表现和实际在手机上的表现会有意想不到的差异。

有些 icon 放大来看是很精美的,但放到手机上看时总会觉得哪里有些不妥,感觉细节多了挤成一坨,适得其反。这时候可以试试把icon进行极端的简化,再和原来的设计作对比,并进行细微的调整,会有意想不到的效果。

每个人对简单的理解可能会不一样,但这样几次来回对 icon 反复打磨,对简单化的努力就可以看出效果来了。

更多

《写给大家看的设计书》中提到的四个设计的原则:

  • 对比
  • 对齐
  • 重复
  • 亲密性

这几个原则可以用来作为任何一个平面设计的评判。在 UI 设计中也是很受用的。

题外话,第一部分的“抑扬”,其实还和 IA 设计相关,这里就不展开来细说了,先从这几个简单的小技巧开始,让产品的UI设计变得更简单吧。

相关推荐
创造卓越用户体验的五个要点
13个国内知名互联网公司的产品设计团队博客网址
网站登陆框设计如何根据用户需求做不同的表现形式
20大UI设计原则 设计师必备宝典
APP应用设计教程:设计元素的应用条件
企鹅进化论 细数那些年我们一起用过的QQ
用户界面设计教程:UI设计六要素分享
60个以小见大的互联网产品设计细节汇总
今日最佳设计:人像即按钮 社交应用新趋势
好看好用?UI设计师不可不学的易用性原则
分享设计:Froont打造网站设计界的Github
2014年八个最棒UI设计灵感:你最中意哪个?
天天喊着学UI 你知道安卓和iOS的区别吗?
连按钮都设计不好 你还指望用户点击?
分享为SOUNDWAVE设计WATCH应用的五个技巧
再见METRO!WINDOWS 10通用应用设计趋势分析
以微信网易为例:新闻型产品列表设计分析
超实用干货!视觉设计师的五项技能修炼方法
百度官方出品!2015-2016交互体验趋势
界面设计:从减少点击次数到降低使用负荷
被小米青睐的“UI 中国”,还想围绕界面交互设计师做点什
好的移动应用设计,就该这样
透过小咖秀看产品设计
苹果也躺枪!5个严重影响用户体验的设计问题
如何在界面设计中色诱用户
想要App做得美,这些UI/UX设计趋势你要知道啊
前网易PM总监:移动APP登录、注册等设计经验
想学微信的界面设计?来看看WeUI的暴力美学吧!
APP制作教程:转化率翻10倍!如何设计好产品注册/登录流程?
花7天看了上千个交互动效神作 我总结出5个技巧
为什么国外的App 乃至互联网产品通常都很简陋?
极简设计:移动端设计新趋势化繁为简
22个UI UX细节很棒的APP界面设计 UI设计必备
APP界面设计:30分钟掌握这8种页面布局 UI设计必学
界面简化:Apple、Facebook和Airbnb都在遵循的设计
UI设计教程:6个步骤让你快速完成切图 UI设计师必备

精彩推荐

热门教程