如何设计出“好看”的UI界面(一):排版的六项原则

文/哥白尼

排版是界面设计中最基本的,也最重要的,就像是绘画中的造型设计,要是形体不准,上面的细节装饰再丰富也是徒劳。

好的排版能有效地向用户传递关键信息,同时也能提升产品的用户体验,排版已经变成了设计师越来越重视的一个环节,下面总结了一些排版的知识点,希望可以和大家一起成长。

界面设计的6个关键点:

留白放大比例对齐与平衡父子主次关系穿插与分割人物与界面关系

1.留白

设计最重要的一点是清晰,所以留白的主要目的是突出重要信息,合理的利用空间关系,使重要的信息一目了然,同时可以让界面透气。

留白的多少,是由界面功能的性质决定的。

1.一般基本功能留白的空间,不会太大,以功能清晰为原则。

2.一些特殊功能的留白空间,会根据界面性质,选择多留出空间,用来增加界面特有的气氛。

或是用来突出重点信息,或是为了符合功能的特点

2.放大比例

界面设计中,让人眼前一亮又印象深刻的,一个最简单的方法,就是打破自己的设计习惯,打破常规,放大功能之间的比例,给画面增加视觉冲击力。

下面看一个案例:

示例a:

示例b:

a和b哪个界面更吸引你?是不是一目了然的a?

3.对齐和画面平衡

对齐是界面设计中一个重要的细节,可以无形中提升画面的整体品质,也是对UI、交互设计师是否合格的一个基本判定。

1.对齐是界面中各个功能之间的调整,比如:文字之间的对齐,文字与界面间距的等比对齐,界面与界面之间的细微对齐调整。

2.对齐也是让画面保持平衡的一种手段,避免画面出现视觉上的不对称不舒服,让画面失衡。

3.对齐不只是信息之间的对齐,还包括画面中功能之间相互呼应的“对齐”,比如图中的左上角和右下角的区域间的对应,避免了一头过重而让画面失去平衡。

4.对齐也包括界面中,功能之间倾斜角度的一致性。

整个界面相关功能的倾斜度都是一致的,包括弹窗、文字和背景装饰,会让画面更有动感。

4. 父子主次关系

是指界面中的层级关系,不只是点击操作上的顺序展现,还有视觉上的主次功能先后顺序的展示。

1. 在界面设计中,点击出现的先后顺序的展现,比如切换按钮界面。

2. 视觉上的观看顺序,比如合成功能,技能树。


5.穿插与分割

1.在二次元风格的界面中出现的比较多,也是二次元界面的排版特点,可以让画面更加有活力和动感,也更接近漫画和杂志的排版布局。

2.还可以更好的制造出空间感,让画面层次更加丰富。

6.人物与界面关系

其实,游戏UI界面就是,人物与功能和背景三者之间相互衬托相互穿插的展示。

1.一般以角色为主的界面,都是功能围绕角色进行排版设计,比如选择角色界面、换装界面、抽卡界面等。

2.以功能为主的界面,角色会用来衬托功能进行展示,比如7日登录界面、恭喜获得界面、一些奖励界面和一些活动界面等。

而背景会根据游戏世界观和游戏本身的风格进行设计,用来装饰和衬托整个画面。

但是,不论怎样设计,都要记住游戏界面是为信息服务的,虽然我们可以加装饰,做各种形式的展示,但是信息部分一定要清晰直观,要第一时间传递给玩家。

同时,整个画面要保持视觉上的平衡。

总结

不论什么样的游戏风格,制作过程中这些思考都是必不可少的,只有通过思考制作出来的界面,才是有灵魂的。

0

评论0

站点公告

 

AI创作与绘画大师,国内版chatGPT在线版本免费使用哦

点击打开: https://ai.uiya.cn

   
显示验证码
没有账号?注册  忘记密码?

社交账号快速登录

微信扫一扫关注
如已关注,请回复“登录”二字获取验证码