在设计时,我们会注意界面的排版、文字的对比、图标图片的美观,但是图片比例却很容易被大家忽略。一些设计师会通过测量参考优秀APP的尺寸来设定,一些设计师直接凭感觉取个数值即可,并无规范可言。其实图片在设计时需要遵循一定的比例,这样会更符合产品定位以及方便后期维护,通过整理我总结了五种UI中常见的图片比例。
3 : 2这个尺寸其实源于135胶卷的比例,采用它并不是因为黄金比例的缘故,而是由相机的像场大小决定的。
在早期徕卡镜头的成像圈大约为44mm,而胶卷的宽是24mm,因此如果在44mm的圆上截取一块宽为24mm的长方形,那么边长正好为36mm,也就是3 : 2的比例,同时由于徕卡相机的用户群巨大,因此其他相机厂商也逐渐将尺寸统一为3 : 2。
4 : 3
4 : 3是随着小型相机(例如微单)的出现而诞生的。在追求小型化低成本镜头上,大家遇到最大的问题就是像场不够用了,同时由于当时传感器技术有限,无法把CCD的长度做到很长,因此人们需要尽可能的在小体积上实现更高像素,怎么办?最好的办法就是把比例做的更方,大家知道,所有几何图形中,对角线距离相同,图形越接近圆形,图片占比面积也就越大。
1 : 1
1 : 1是传统的120胶片画幅,也叫中画幅,因为相机结构和其他一些原因,导致了胶片是方形的,一般为6×6厘米,利用该比例可以将构图归整得简单,突出主被摄体的存在感。
16 : 9
16 : 9根据人体工程学的研究,发现人两只眼睛的视野范围是16 : 9的长方形,所以电视、显示器行业都根据该比例来设计产品,iPhone5是首款屏幕比例为16 : 9的手机。
3 : 1
3 : 1是聊天气泡框中图片适配的阈值比例,也就是当你发送的图片大于3 : 1时,其缩略图的展示范围仍然是3 : 1的展示范围,多余部分进行隐藏,从而让图片更有识别性。
画重点
大家在设计时需要记住,图片比例在使用时最好有所规律,不要随意的设置尺寸,同时一个APP中图片的比例不易过多,最好不要超过3种,类似功能的图片采用同一比例。
另外在确定采用哪种图片比例时,先确定产品类型和产品目的。比如你的项目是电商类产品、主要目的是为了卖货,那么我们就选择1 : 1的比例可以突出商品主体;或者你是做视频类的APP,那么你的产品展示列表就可以采用16 :9 的比例。总之在选择时需要做到符合产品定位、考虑维护成本,做到有理有据。
更多内容,请关注我们公众号:不丧指南
0条评论