网页设计技巧:UI界面设计如何选用图片

Post 3 of 922

UI界面设计如何选用图片?从人体进化角度来看,我们的祖先主要是透过视觉来感知和判断生活,其他四感辅助之。即使出现文字,图像对人类的吸引力依旧很强。并且与文字相比,更能让人类快速轻松地理解和记忆。

图像既然如此重要,在网页设计中同样并不可少。图片能在某程度上决定画面基调,引导视觉流程,降低多段文字信息的枯燥性,提高网页的易读性。

UI界面设计如何选用图片?

一、错误的图片选用方式

 

网页设计技巧:UI界面设计如何选用图片

网页设计技巧

左图:无论从商品视觉、调性、细节都不够统一,给人一种山寨盗版网站的感觉。

右图:看起来比较有质感,感觉像是是严肃官方认证的网站。

所以,在同样页面布局下,统一图片的风格,会让UI页面看起来更有“品质保证”。

二、了解图片占比与来源

构思UI页面布局时,首先要了解两个问题:

1. 图片区域与占比;

2. 图片来源问题。

如果页面图片比较多,用户可进行自定义,APP上线后设计可控性会降低,上线效果会不尽人意。

 

网页设计技巧:UI界面设计如何选用图片

网页设计技巧

淘宝和网易严选在图片品控上有着不同的视觉感受,这是由于淘宝属于”自营+他营“,即使有图片规范,也难以统一品类和调性;相反,网易严选属于“自营”,会相对更容易把控。

三、 图片的选用问题

1. 是否符合产品气质

在网页设计中,界面的所有设计及元素运用都需要为产品服务,所以图片也不例外。不同类型选用不同风格的图片搭配,这是十分基础且重要的事情。

 

网页设计技巧:UI界面设计如何选用图片

网页设计技巧

例如,如果这是美食类APP,头图选用小清新风格的图片显得不够合适,相反选用带有环境食材元素的图片,才会更容易让用户产生共鸣。

2. 是否能清晰表达产品的核心内容?

图片是否主题明确?能否正确无误地传达界面的核心内容?图片会不会被界面其他元素抢去主体视觉,而让用户找不到视觉重点?

 

网页设计技巧:UI界面设计如何选用图片

网页设计技巧

漂亮图片有很多,当如果我们仅仅以“漂亮”为基准,就会显得界面非常凌乱。所以确定图片是否符合界面风格,比图片美与否更重要。如果商品角度不一样,饱和度高低不同等,就会形成产品不一致,用户视觉不适应等问题。

3. 图片是否美观

图片是否能表达美好的生活以及美好品质的向往?光影关系是否自然?图片是否高清有细节?

 

网页设计技巧:UI界面设计如何选用图片

网页设计技巧

想要网站设计美观,图片是必不可少的。如果图片不够美观自然,反而会让网站不受欢迎。所以,网站图片不可随便选择,要足够美观同时还需具备丰富的信息传达力和情感吸引力。

人类都是视觉动物,所以图片的选择上,我们尽可能使用贴切主题且漂亮的图片,这样才会让界面看起来更加美观,让用户更愿意停留并信赖平台。

This article was written by admin

MENU
網頁設計公司