png|掌握这些技巧,你的界面更加出彩

编辑导读:人是视觉动物,相比于文字,人们更容易被图片吸引。而如何在界面设计中运用好图片,给用户更好的视觉体验,本文作者有自己的想法,一起来看看吧。
png|掌握这些技巧,你的界面更加出彩
文章插图
在UI设计中,配图的好坏将直接影响着界面的品质及用户的视觉体验。纵观如今高质量的界面设计,具有设计感的配图不仅是吸引用户的重要元素,能比原本平淡无奇的文字界面更让人产生点击欲望,还能体现出设计师的品味、以及相关方面的专业性。
png|掌握这些技巧,你的界面更加出彩
文章插图
在这个快节奏的时代,相比文字,图像的传达效率会更快、更高、更有助于用户轻松理解及记忆。配图用的好,往往能起到决定画面基调、流程引导、视觉平衡等关键作用,所以,在同等样式的布局下,因图片的使用及处理方式的不同,界面的品质也会存在较大的差异。本篇文章将介绍一些在UI设计中配图的基础知识,帮助大家在图片列表、背景处理、图文混排、头图等相关界面设计无从下手时提供灵感,在选择图片、后续处理时如何做到有规律可循带来一些思路。
一、了解UI设计中的图片1. 为什么要重视图片在文字出现之前,人们都是靠看到的图像来理解信息内容,即便后来文字能表达出很丰富的内容,图示也不可少,试想一下,当别人拿着密密麻麻的数据给你看时,能看的头皮发麻,你更希望有一张清晰的图表,但并不能说明别人的数据不清晰。所以,图像相比文字能更具说服力、更容易传达信息,使读者产生共鸣、震撼内心,让人看了一目了然,能直观的与人产生互动。
png|掌握这些技巧,你的界面更加出彩
文章插图
当说到UI设计中的图片非常重要时,并不是说文字就一定比图片弱,好的文字也能带给我们无限的遐想,只能说在更大的概率上图片和文字哪个更吸引人,所以我更倾向于观赏图片,然后感受到带来的美好。但是,如果非要问我选择哪一个时,我只能说“只有小孩子才做选择题,我(设计师)全都要”,图片可以表达出丰富的内容,再用文字言简意赅,是一个非常完美的组合。
png|掌握这些技巧,你的界面更加出彩
文章插图
2. 常用的图片格式图片有多种格式,如JPG、GIF、PNG、TIFF、RAW、BMP、WEBP…等,在UI设计中,最常用的无非JPG、GIF、PNG三种。
JPG:目前为止使用最多的图片格式,兼容各大操作系统浏览器及编辑软件,非常方便被打开和处理,但不能显示透明底,压缩后会失去一部分原始信息。
PNG:如需编辑,PNG应该算是所有图片格式中的最佳选择,支持无损压缩及透明底,但针对需要高保真的复杂图片,压缩后的文件较大,且有少数的浏览器不支持。
GIF:动效图片,支持透明底及无损压缩,通常由视频格式的内容转换而来,但对色彩有非常严格的要求,数量最多不超过256种,相比前面两种,GIF格式的文件更大。
png|掌握这些技巧,你的界面更加出彩
文章插图
二、图片的使用及处理方法1. 图片的使用比例在移动端UI设计中,我归纳了最常用的几个图片比例,分别是1:1、3:2、4:3、16:9四种,这些比例都是源于最早的胶片摄影及现代相机的传感器演变而来。当我们不知如何选择比例时,首先需清楚的了解界面图片的应用场景、来源用户以及图片比例背后的缘由,否则将很难把控,下面将针对这几个比例作具体分析。
1)1:1 比例
因为相机结构的原因,早期最传统的120胶片画幅就是正方形(6*6cm),即1:1的比例,此比例更容易的将构图规整,使其最大程度的突出照片主体。

推荐阅读