我们是视觉动物,第一眼看的就是图片,所以在UI设计中,用好图片是很重要的,这让里面的文字不再枯燥,也容易吸引用户。UI设计中用好图片,可以让你的设计快速过稿。


图片占比


在构思UI页面时,需要了解图片占比与来源问题。图片占比多,实际上线效果可能不太好。

下面淘宝和网易界面中,由于平台不同,图片的选择不一样。不是说哪个平台不好,而是当一个平台集纳不同的店铺,不同调性的产品类型,即使有图片规范,也难如统一品类、调性的产品来的统一。

学会用好图片,让设计过稿率提升50%!

那么怎么选择与运用图片呢?

1、符合产品气质

在UI设计中,图片的使用要为产品服务。如果你是厨房类 APP,图片就不能够选择小清新感的图片,带有环境与食材等元素的图片才会更加吸引用户。

学会用好图片,让设计过稿率提升50%!

2、表达产品内容

图片的选择与使用要与产品挂钩,同时也要与产品内容相同。比如下面的葡萄,左边的图片无法显示主体,因为这可能会让用户产生困惑(这个产品是葡萄还是葡萄树),而右边直接给出了葡萄图片的细节,让用户第一时间就知道这个产品的内容。

学会用好图片,让设计过稿率提升50%!

3、图片美观

大家都知道,用户喜欢漂亮美观的图片,所以在图片的选择中,我们都需要选择漂亮有魅力的图片作为产品的主图。但不能跟产品有太大的差别,这会让用户对于产品与平台的印象大大下降。

当明白图片如何选择后,下面分享一些图片过稿小技巧。

1、风格统一

在UI设计中,我们都会使用漂亮图片,作为产品宣传的要点,但除了漂亮之外,还有风格要统一。因为用户的实际使用场景往往是浏览一个完整APP,所以统一风格比美更重要。如果商品角度不一样、饱和度高低不同、抽象与具象等,都会形成产品不统一,用户视觉不适应等问题。

学会用好图片,让设计过稿率提升50%!

2. 符合场景

图片的选择与使用都要符合页面与内容,相信很多的UI设计师在填充图片时,都会使用到很多插件直接自动填充,这可能会让图片的使用场景与UI设计界面不符。如下图是商城陈列页面,右侧的图片给出上线的实际效果,更贴合产品,方便设计决策者给出建议方向。

学会用好图片,让设计过稿率提升50%!

设计就是在做产品视觉表象的表达,需要尽可能使用贴切的,漂亮的图片。让UI设计界面看起来更加美观。