在不同app的各种界面中,经常会用到不同比例的图片。图片能极大程度地吸引用户的目光,延长用户在页面的停留时间。常用的图片比例有很多,那么我们应该如何选择呢?这就需要设计者尽可能地利用好不同比例图片的优点,充分发挥各自的优势。下面我将介绍一下在选择图片比例时需要注意的几个小点:
常用的图片比例
目前常用的图片比例有1:1、2:3、4:3、16:9,为什么不同类型的app中需要用到不同的图片比例?其实它们有各自的使用场景。
图片比例1:1——突出主体
1:1的图片比例因为其规整性,能最大程度地突出主体。并且在遇到一些非1:1的图片时,图片裁剪适配也更容易,能最大限度地保留主体信息,比如头像、logo。
不少app为了避免展示图的拉伸变形基本都采用1:1比例,常用于产品的展示、特写等,在电商类app中经常出现。
图片比例2:3——黄金比例
图片比例2:3,约等于0.666,非常接近艺术作品中的黄金比例。而照相机中全画幅尺寸就是2:3,这个比例人眼看上去会比较舒服。该比例在app中多用于横图展示,比如横幅图、商品列表等。
图片比例4:3——裁剪损失小
4:3的图片比例一般用于以图片为主或者用户群体年轻化的产品中。当app以UGC内容为主,此时图片的创作者主要是平台用户,而用户上传的图片来源多是直接使用手机拍摄。目前主流手机拍摄的照片尺寸一般都是4:3,所以这种情况下设置图片比例为4:3能尽可能适配用户上传的图片比例,减少图片裁切带来的画面损失。
图片比例16:9——视觉宽广
16:9比例是非常经典的视频尺寸比例,能够给人一种视野宽广的感觉,所以多用于视频类app的banner和播放窗口。
如果你正需要在视觉稿中展示不同图片比例去适配不同app界面,可以试一下简单好用的改图神器图片编辑器,支持一键选择不同的比例或者自定义裁剪。
图片比例统一
当确定好比例后,需要尽可能地将图片比例规范化,同一页面模块的图片比例要尽量保持一致。这样可以在视觉上更加协调统一,提升app整体的观感。例如在信息流为主的app中,左标题右图排列的图片与并排3张图的图片比例一致,左边标题正好占据两张图片的宽度,这样排版就显得美观不少。
图片主题选择
图片需要与产品本身相关,不仅格调要统一,而且产品属性也要统一。如果选取的图片偏离主题,即使图片再好也达不到预期效果。要尽量贴近用户实际需求,选择合适主题的图片。
图片清晰度选择
图片选择时要注意图片清晰度,高质量的图片能够有快速提升整体的视觉效果。分辨率过低导致“一丑遮百美”,再精致美观的图片素材都无济于事。这时可以去一些无版权的图片素材网站,比如:搜图神器、pexels、unspalsh等选一些精美图片,或者使用无损放大将模糊素材进行放大裁切。
总结
- 图片比例选择要因地制宜,根据不同类型类型的app选择合适的图片比例;
- 同一模块的图片比例尽可能保持统一;
- 选择与app页面内容契合的图片主题;
- 尽量选择高分辨率、高质量的图片素材保证整体视觉效果。