设计师必修课:界面设计的3个小细节,实用干货

95 阅读4分钟

下就简单举几个界面设计里面的几个小细节,康康你的设计是平平无奇还是精致优秀的。(最近在负责海外版项目,直接拿过来当用例了,所以有的例子会是英文排版哈)

==================================================================================

01 控件、交互也在随机应变的迭代

还记得刚开始互联网做UI设计的时候,很多控件、交互的形式都和现在差很多,当时也没有觉得不好用不妥,只是任何事物都在迭代,当更好的方式出现的时候,之前的就不再香了。

这是一个真人认证的页面,当用户上传认证头像之后有一个需要等待上传的加载过程,在实地试验以后我们发现这个加载过程的时间在3-5s(自动核实照片与本人相符度)。

按照老式的设计应该是:上传-加载页-结果页这样的流程顺序,后来演变为:上传-中央加载toast-结果页,到现在更流行的:上传-隐蔽toast-结果页。

设计师之间的差距往往就在这些细节

设计师之间的差距往往就在这些细节

一流设计网(yiliusheji.com)提示现在大多数优秀的app设计都使用了最新的设计(小红书、抖音视频上传加载),为的是在加载的那几秒用户还可以轻松的浏览别的页面,不会造成体验中断,哪怕只有3s。

===================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================

02 排版的细节可以到多细

对于界面排版的标准很多铁汁都知道遵照格式塔原则,但是格式塔能教给我们的标准是很有限的,仅仅做到只是及格,还有更多细节需要我们去补缺,这里随便举一个比较常规的“我的”页面,看看有多少细节我们可以注意。

设计师之间的差距往往就在这些细节

设计师之间的差距往往就在这些细节

头部背景:如果过重,不但抢首页的风采,也压掉了底下签到(运营粘性功能)的视重,但裸白又过素没有气氛(一个相亲社交app),所以右图是叠了3层的效果(白色底板+低透明度头像模糊+低透明度品牌色渐变)

签到区域:如果过重,会将页面完全割裂,反而弄巧成拙,但要把握它是第一个视重,所以用了轻拟物图标增强识别度+渐变按钮+低透明度渐变背景控制整体平衡

列表区域:如果严格按照整体栅格左右20,其实我们反而会觉得列表太靠边距,留白过度,并不是最舒适的视觉体验。因此遇到这种情况我们需要灵活应用,在栅格系统基础下将列表的起头图标和分割线的间距分开来设计(图标内收8左右的边距)。

==============================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================

03 创新情感化是被小看的必杀

我们都知道界面设计里有很多可大可小的细节,什么意思呢?就是一个缺省图,你既可以设计成左侧,也可以设计成右侧,全看项目排期和自己的设计能力。

设计师之间的差距往往就在这些细节

设计师之间的差距往往就在这些细节

除了缺省图以外,还有很多可以通过高质量的感情化设计给用户留下更深的品牌印象的地方。

设计师之间的差距往往就在这些细节

设计师之间的差距往往就在这些细节

这些可大可小的地方是最直观体现设计师创造力和手活的地方,别忘了看你作品集的面试官也是一个大众用户,如果普通的用户对你的设计都没有辨识度,没有留下很深刻的印象,那么面试官更不会有,毕竟是人都是视觉动物。

以上只是几个小细节就可以看出ui设计做到极致,远远不是只给原型、交互稿上个色这么简单,产品、交互没搭配好的控件效果你要设计好,品牌设计的排版细节你要完美get,创新的情感化设计你要依据产品目标定制。

==================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================