移动端界面的版式设计原理.pptx

移动端界面中的版式设计原理
Layout Design
我总觉得
页面不太好看
但是我
又说不出来
你觉得这好看？
你的审美
要加强啊
我不懂设计，
但是我就是觉得
不协调
说不出
哪里好
也说不出
哪里不好
其实设计本身就是一门理性的学科，审美因人而异，只有言之有理的设计才能够说服别人。当设计师拿到产品的原型开始做设计时，如果只是单纯的按照原型进行而不考虑任何规则，那么很多时候就会产生一些不协调的结果。设计完之后产品不满意，自己也不满意。
在UI设计中其实也存在大量的版式设计原理，如果产品和设计都能对版式设计有一定的了解，那么设计师拿到原型的时候，评审设计输出稿的时候大家都能更好地理解对方的设计。以下我总结了几种常见的版式设计原理，是工作当中做出良好视觉效果的前提。
01
信息的排布
HOW TO MAKE A BERUTIFUL UI>?
对任何信息进行排布的设计的四大原则
对齐
重复
亲密
对比
对齐除了能建立一种清晰精巧的外观，还能方便开发的实现。基于从左上至右下的阅读习惯，移动端界面中内容的排布通常使用左对齐和居中对齐，表单填写的输入项用右对齐。
设计和做其他事情一样，也要有轻重缓急之分，不要让用户去找重点/需要注意的地方，应该让用户流畅地接收到我们想要传达的重要的信息。
重复和对比是一套组合拳，让设计中的视觉元素在整个设计中
重复出现既能增加条理性也可以加强统一性，降低用户认知的难度。
那么在需要突出重点的时候就可以使用对比的手法，例如图片大小的
不同或者颜色的不同表示强调，让用户直观地感受到最重要的信息。
在排布复杂信息的时候，如果没有规则地排布那么文本的可读性就会降低。组织信息可以根据亲密性的原则，把彼此相关的信息靠近，归组在一起。
如果多个项相互之间存在很近的亲密性，它们就会成为一个视觉单元，而不是多个孤立的元素。这有助于减少混乱，为读者提供清晰的结构。