Date 2026-07-02 21:08:28
在上一期中，我们了解了界面排版的前四个原则。今天，我们将分享上一期的后三个原则。
欢迎关注作者的微信公众号：「菜心设计铺」
让我们回顾一下大纲：
一、亲密原则
二、比较原则
三、平衡原则
四、相似的原则
五、简洁原则
六、封闭原则
七、情感原则
回顾前四条原则，请在这里戳:新设计师的界面排版原则(上)
今天，让我们从第五条开始。
5.1 数字简洁
许多学生有一个坏习惯，不喜欢看层的位置和大小，特别是位置，如果你的软件不选择像素自动对齐，这样的坏问题会导致位置值经常出现小数点或奇数，使整个界面元素间距，位置不够标准，如下图所示：
如果你的文件图层有很多像左图这样繁琐的值，那就抓紧时间规范你的绘图习惯吧！
5.2 规则简洁
如果你有平面设计的经验，你会很清楚，平面设计的字体类型不应该太多，对齐方法不应该太多...因为过于繁琐的规则会让你的设计变得复杂甚至臃肿。
界面设计师也是如此。如果能用规则解决问题，尽量不要用两个，如下图所示:
一条规则可以用于列表信息的上下边距（绿色和蓝色的高度）。如果你必须设置不同的距离，它会增加设计甚至开发的复杂性，造成不必要的资源浪费。
再举个例子
看上图，上一期已经讲过了。由于亲密原则，我们知道上下间距(绿色高度)必须大于内容间距(紫色高度)。但是为了规则的简洁，内容区的所有间隔(紫色高度)都可以使用相同的规则，上下间距(绿色高度)也可以相同。这样，我们只用了两个规则来解决问题，不失美感。(当然，如果内容区内容需要明显区分，也可以使用不同的间距)
5.3 样式简洁
今年流行的趋势是“无线分隔”。去掉分隔线是一种简单的风格，如下图所示：
QQ概念稿和今日头条的评论页面采用了这种简单的分离风格。这种排版方法使整个页面看起来轻盈、干净、大气，内容更加突出，甚至增加了用户的欣赏时间。
再比如下图
我们可以很容易地看到左边的图片是一个相对较旧的版本风格，一个简单的输入框由多少元素组成？有背景图、透明蒙版、白色矩形框和画面。右边的图片是目前流行的简单风格，一条线解决了输入框的功能问题，气氛美观。
封闭原则是什么？
让我们先看看图片：
虽然上图已经用间距分开了两部分，但还是不够清楚。这时，我们可以用封闭的原则来区分两者，如下图所示:
用线框封闭两部分的内容后，更容易区分两者。
在我们的移动终端界面排版中，最常用的封闭表现形式是“卡”，用于区分各部分的独立信息，如下图所示：
还有
由于间隔和颜色的原因，我们更倾向于垂直阅读上面的列表。此时，我们也可以使用封闭原则来封闭内容（每隔一条信息使用深色背景），如下图所示
这样，我们不仅可以倾向于横向阅读，还可以更好地区分每一个独立的信息内容。
如何评价设计草案的质量？我认为首先需要判断情感是否正确，因为情感是早期阶段的方向和基调。如果这种基调是错误的，无论你及时设计得多么漂亮，这都是徒劳的。
例如，如果我想做一个空数据页面，我需要传达一种失望和悲伤的情绪，如果你给我以下图片：
即使你的角色有多生动，颜色有多舒服，最终的分数也失败了，就像我们在学校的中文作文一样，一旦你离开了主题，什么也不说，坏评论！
如何传达引起用户共鸣的情感？答案当然是换位思考，从用户的角度思考他们想要什么！
比例如，用户在网上购物，加载动画是一个小弟弟跑着送快递，如下图所示：
我认为用户不能不喜欢它！
另一个例子是，当你在健身app上锻炼了很长时间后，软件突然给了你这样的反馈，如下图所示：
你有成就感吗？甚至想发个朋友圈炫耀！
当然，界面的色调、品牌感、配色等都是影响情感的因素，也是我们开始前需要考虑的内容。只有考虑到这些因素，你才能确保你的设计方向正确，情感传递准确。
作为一名设计师，我们的基本职责是解决工作中的问题。在实际工作中，我们经常遇到设计原则与其他因素或两个设计原则之间的冲突。此时，我们需要合理处理冲突，使工作顺利进行。
遵循原则是一件好事，但如果规则限制死亡不是一件好事，特殊场景需要特殊处理，不要过度陷入规则，让自己失去创新能力，设计原则不是一成不变的，在我们前进的路上，你也可以总结更多，积累更多，最终沉淀自己的设计原则！
欢迎关注作者微信微信官方账号:「菜心设计铺」
【优设网 原创文章 投稿邮箱：yuan@uisdc.com】
================优设网==============.com“它是中国最受欢迎的网页设计师学习平台，专注于分享网页设计、无线终端设计和PS教程。设计师需要阅读的100本书：历史上最完整的设计师图书导航：http://hao.uisdc.com/book/.设计微博:拥有180万粉丝的人气微博@优秀网页设计 ，欢迎关注获取网页设计资源，下载顶级设计材料。设计导航：推荐世界顶级设计网站，设计师必须导航：http://hao.uisdc.com