帮你打造极简风APP UI 实用设计技巧.pdf
文本预览下载声明
帮你打造极简风A PP U I 的实用设计技巧
随着用户对UI的喜好开始偏向简约 ,设计师有必要将 个UI简化剥离至基本状态 ,因为保留关键元
素才是成功的钥匙。从某种意义上说 ,极简主义的设计是形式和功能的完美结合。它最大的优势在
于形式上的清晰直观——简洁的线条 ,大量的留白 ,优雅简约的图形元素 ,赋予 个设计以简约干
净的感受。即使是最庞杂的内容 ,在这样的设计之下都显得直观而干练 ,当然 ,如果设计的足够高
效的话。
极简风的A PP设计通常要具备几个特征 :简洁 ,清晰 ,一致 ,并且可用。你的A PP的交互体系应当
通过清晰的视觉传达方式帮用户定位并解决问题。要做 好这一点 ,并不容易 ,因此 ,一个集优雅极
简的设计和优秀的易用性于一身的应用 ,一定会给人留下深刻的印象。要做到这一点 ,你可以从下
面几点着手 :
简单的配色方案
考虑到太多的色彩可能会给用户以负面影响 ,所以尽量简化配色方案 ,提升用户体验。有许多预设
的配色规范和配色方案可供参考 ,可以以此为基础创建新的解决方案 ,并且这种思路尤其适合初
学者 :
单色配色 :单色配色方案通常是由特定色彩的不同深浅、不同色调所构成。通过调 这一色彩的饱
和度、明暗来生成协调的配色方案。
类似色配色 :色轮上彼此相邻的色彩是类似色 ,它们能在色彩上营造出协调而连续的感觉。虽然这
种配色不是那么好把控的 ,但是有诀窍 ,就是注意选取有感染力的色调作为核心 ,这样可以最大化
利用 个方案。一套类似色的配色方案通常是在色轮的同一区域内选取色彩搭配而成。
模糊效果
模糊效果出现在极简化UI设计中是一件非常符合逻辑的事情 ,因为它先天就能够强化UI的层次感。
多层次的UI结构中 ,模糊效果使得用户能更容易分辨前后层级的差异和前后关系。而模糊效果同时
也赋予了UI设计师探索不同菜单和布局设计的可能性。
雅虎天气A PP 中 ,每个不同的城市都会有一张漂亮精致的照片 ,只需一个点击你就能看到看到关于
这个地点的更详细的关键信息。相比于用一个全新的界面来遮盖漂亮的背景 ,雅 虎的设计师让背景
模糊虚化 ,以保留UI的使用场景 ,不会让用户有跳出界面的感觉 ,而模糊的背景和前景的内容又构
成了良好的对比度。这样的交互更加直观微 妙 ,主界面和详细信息之间的联系又足够紧密 ,逻辑
清晰。
一个A PP ,一种字体
几种不同的字体在一个A PP中混用 ,会让你的A PP显得散漫而马虎。减少屏幕上字体类型的数量 ,
可以强化排版的效果。当你设计A PP的时候 ,尽量试图通过控制同一字体的字重、样式、尺寸和色
彩来营造不同的布局体验 ,而非换不同的字体。
当你在为你的A PP选择字体的时候 ,选择平台的默认字体可能是最安全稳妥的选择 :
苹果公司目前在全平台上使用的是San Francisco字体 ,iO S 9 上将这种字体标记为 SF- UI
。
Ro bot o 和 Not o 则是Google A ndro id 和 Chro me 上的默认字体。
聚焦数据
你应当使用大字体和醒目的色彩来让特定的数据成为视觉的焦点。普通的数据和内容使用中性的黑
白灰来展现 ,而关键的数据则使用强对比的色彩 ,起到行为召唤的作用 ,这样可以让用户的注意力
更加集中。
明亮的色调+中性的色调是最容易搭配的方案 ,同时也是视觉上最引人注意的方案。
被放大的字体和更加显眼的色彩无疑在 个界面中更加具有视觉吸引力 ,无需更多的提示 ,用户就
知道眼睛应该看哪里。
通过空间分隔元素 ,而非线条
设计师常常会用线条来分割区块 ,表明界限 ,划分屏幕功能区域。但是当界面元素多起来之后 ,这
些边界、衬线、分隔线会让 个界面拥挤不堪。
精简分割线会给你一个干净、现代且功能突出的界面。想要分割、区分不同的元素 ,方法有很多 ,
比如使用色块 ,控制间距 ,添加色彩和内容 ,等等等等。谷 歌日历就是一个相当好的例子 ,适度的
阴影 ,明快而易于聚焦的色块 ,充满呼吸感的间距 ,让不同的区块、内容都清晰的分隔在屏幕上不
同的地方。
图标 :线条和填充
图标是UI设计中的重要元素 ,也是视觉传达的主要手段之一。图标应当是简约的 ,作为视觉元素它
应当能让用户立即、快速的分辨出来。iO S 之后的iO S系统就开始走上简约的设计路线了 ,其中图
标大多使用了线条和填充式的设计 :
iO S 的时钟图标的两种样式
看看界面底部的Tab菜单栏 ,它作为应用内导航使用的时候 ,通常是常驻于底部 ,所以当用户进入
某
显示全部