UI设计新手不可错过的7条实用法则.pdfVIP

UI 设计新手不可错过的7 条实用法则 本文编译自 Medium，作者是一位UX （User Experience, 用户体验）设计师，他通过自己学习 UI 设计的过程，总结出7 条实用的法则，为UI 设计新手提供了宝贵的经验。 序言首先，明确一点，这篇文章并不是为所有人准备的，而是有特定的目标读者： 想要在开发产品时设计出好看UI 的开发者。 想要让自己作品集更出彩的UX 设计师，或者是想要做出更精美的UI 和UX 的设计师。 如果你是学艺术的学生或者已经是 UI 设计师了，你可能觉得这篇文章很无聊，而且观点都是错的。没关系，你的批评没 错，把这个网页关了，去忙别的事吧。 那么从这篇文章中到底能学到什么呢？我曾是一名不懂 UI 的 UX 设计师。我非常热爱 UX 设计，但是后来我发现，做出 精美的界面是多么的必要: 我以前的作品集看起来一团糟，显得我的作品和思考过程很差劲。 我做UX 咨询的客户更喜欢有能力呈现作品的人，而不是只会画一堆方块和箭头的人。 我能为一些早期的创业公司工作吗？还是一边儿呆着吧。 我当然也有借口： 我没有美术基础，我主修工程专业，所以我做出难看的东西也无可厚非。 最终，我还是学了 app 设计，不断地分析案例，厚着脸皮临摹成功的作品。假设我在 1 个 UI 项目上花 10 个小时的时 间，其中只有 1 个小时是有效的，其它 9 个小时都是在失败中不断地学习，玩命的在 Google、Pinterest 或者 Dribble 上找 值得借鉴的东西。 下面这些“法则”都是我从失败中总结出来的。所以，我需要提醒新人：我现在擅长 UI，主要得益于我经常分析，并不是突 然开悟，理解了什么是美，什么是平衡。 这篇文章不讲理论，只谈应用。我不会讲什么黄金分割、色彩理论，只有实站中总结出的经验和教训。就好像，柔道源于 日本几个世纪以来的尚武精神和哲学理念。上柔道课时，不仅能学到打斗，还会学到很多关于能量、气息与和谐之类的东西。 而以色列格斗术（Krav Maga）则完全不同。 这种格斗术是纳粹压迫下犹太人发明的。其中根本没有“艺术”，在以色列格斗术的课堂上，你学到就是怎样用一根笔或者本 书袭击别人的眼睛。 这篇文章就是产品设计领域的以色列格斗术。 以下是我要讲的法则： 光线来自天空 黑白优先 增加空白空间 学会在图片上呈现文字 做好强调和淡化 只用合适的字体 像艺术家一样偷师 我们来一起看看这些法则。 法则一：光线来自天空 阴影能够告诉人脑我们到底在看什么样的UI 元素。 这可能是学习 UI 设计时，最容易忽略却又极为重要的一点了: 光线来自天空。光线总是从天空（上方）来的，从下面照 上来的光看起来会非常诡异。 当光线从天上照下来的时候，物品的上端会偏亮，而下方会出现阴影。上半部分颜色浅一些，而下半部分深一些。 从下面打一束光到人脸上是不是看起来很渗人？UI 设计也是同理。我们的屏幕是平的，但是我们可以通过一些艺术手法让 它看起来是 3D 的，在每个元素的下方加一些阴影。 就拿这个按钮举例，这是一个相对“扁平化”(flat) 的按钮，但依然可以看出一些光线变化的细节: 没有按下去的按钮底部边缘更暗，因为没有光线照到那里。 没有按下去的按钮上半部分比下半部分稍微亮一些。这是在模仿一个略有弧度的表面（见侧视图）。 没有按下去的按钮下方有一些细微的阴影，在放大图中看得更清楚。 按下去的按钮整体颜色都更暗了，但下半部分的颜色依然比上面深。这是因为按钮在屏幕的平面上，光线不 容易照到。也有人说，在现实中，按下去的按钮颜色更深，因为手遮挡住了光线。 这么一个简单的按钮就有 4 种不同的光线变化。实际上，我们可以把这种原则运用到各处。 IOS 6 有点过时了，但还是学习光线不错的案例。这张图是 iOS 6“勿扰模式”和“通知”的设置，看看上面有多少种不同的光 线变化。 控制面板的上边缘有一小块阴影。 “开启”滑动槽上部也有阴影。 “开启”滑动槽的下半部分，反射了一些光线。 按钮是突出的，上边缘较亮，因为是与光源垂直的，接收了大量光线，折射到你的眼睛中。 因为