能让UI设计显得更简约的一些小技巧

扫一扫
官方手机版

扫一扫
AI创作程序

扫一扫
木子公众号

扫一扫
AI公众号

互联网界一直在有提倡简约设计的声音，可简约设计有什么小技巧？

作者：龙泰 一个学日语的产品经理。爱猫，爱吐槽。现在在做智能手机的Rom。

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

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

臃肿易烦腻，简陋生欲望

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

不过，如果产品太过简陋，仅仅局限于有限的使用场景的话，用户的使用频度就会很低，很容易被遗忘。这也是大多数旅行网站和 App 的痛处。
每次在斟酌功能点时，大概都会有这样的困扰。

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

我并不认为国外的 App 在功能上会比国内的要少。在实现同样的功能的情况下，国内的 App 设计并没有有意识地让界面看起来更简约。
产品设计的简约，最直观的感受就是 UI 设计了。在这里分享一些我认为可以让 App “看起来”更简约的几个重要的技巧

抑扬

抑扬，就是对内容进行有抑有扬的对比处理，通过对比的手法能够让信息量在视觉上“显得”比实际上少。
错落有致、有强有弱的信息布局，让用户更容易地第一眼就把握了整体结构，从而快速找到自己想要的信息。就如同报纸的头条、各种大小标题一样。这些变化让人们的阅读更顺畅。想象一下如果报纸的内容全是大小一样的字体，恐怕没人会有阅读的欲望吧。
从运营的角度来看，通过对内容的强弱处理，还可以达到对用户的焦点进行引导的作用。比如有些网站故意把分享的按钮做的比其他按钮要大，位置更显眼，就是有意识地想让用户多进行分享，让内容更好地被传播。

抑扬可以是界面元素的大小、颜色、字体等等，能起到以下作用：
让界面看起来更简约;
对用户行为进行引导；
帮助用户快速发现对他最重要的信息；
强弱对比，减少阅读的压力感。

留白

亚马逊-留白

UI 设计中重要的要素之一就是留白的运用。文字、按钮等元素周围的留白越大，越能提升存在感。（这其实也是上面说的“对比”的一种变形）
留白不意味着页面的信息容量降低。
智能手机上下滚动是很舒适的，并没有必要为了让所有内容在一个页面内全展现出来而让字号变小。这样做反而会让信息更加难以阅读。
用户的视觉需要得到“喘息”。
信息容量大的界面，对用户来说是一种阅读负担。在设计这些交互界面时，要注意留白的运用。留白能让界面富有层次感，让用户的视觉得到“喘息”。

icon 也要尽量简单

简单的 icon
设计师通常都是在大屏幕下设计，而实际上有些细节在大屏幕上的表现和实际在手机上的表现会有意想不到的差异。
有些 icon 放大来看是很精美的，但放到手机上看时总会觉得哪里有些不妥，感觉细节多了挤成一坨，适得其反。这时候可以试试把icon进行极端的简化，再和原来的设计作对比，并进行细微的调整，会有意想不到的效果。
每个人对简单的理解可能会不一样，但这样几次来回对 icon 反复打磨，对简单化的努力就可以看出效果来了。

更多

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

1. 对比
2. 对齐
3. 重复
4. 亲密性

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

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

原文地址：http://www.geekpark.net/read/view/176352

================关于木子设计网================
“木子设计网uisdc.com”是一个分享网页设计、无线端设计以及PS教程的干货网站。

特色推荐：
设计讲座：定期邀请国内互联网公司的设计前辈及行业总监在群内及YY语音（YY频道：15335158）分享实战经验。
设计微博：我们拥有粉丝量25万的人气微博@优秀网页设计 ，欢迎大家关注及时获取设计资源。
设计导航：史上最赞最全面的设计师网址导航：https://www.muzisucai.com/
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗？
添加 优秀网页设计 微信号：【muzisucai_com】优设哥的全拼
您还可以扫描下方二维码快速添加：