详情页-加亿点点细节

用户头像
长沙/网页设计师/4年前/3938浏览
详情页-加亿点点细节
用户头像
曾海春

浅谈详情页的一点点细节,有细节和没有细节的作品,品质感是完全不同。


一个好的详情页设计,在细节上一看就能看出是否是一位成熟的设计师做的。一个买家的购买决策一般来说只有15S,停留时间非常重要,所以在排版和画面表达上最好一眼能让消费者秒懂,让消费者在最短的时间内了解信息内容,在牍面中也占具着重要的位置,买点内容不同,排版方式也不同,那么,如何在我们的详情中加一点点细节就能使画画更加美观,更加秒读呢?接下来给大家讲解几个案例的修改。




不管在任何设计排版当中,想让顾客快速阅读有用的信息,那最简单的方法就是使用大小对比,让文字之间产生差异化来把重点信息突出,因为用户的习惯一般先阅读比较醒目的文字,所以这样排版阅读逻辑清晰醒目且美观。


在下面案例当中,先将对顾客有帮助的信息罗列出来,“防晒时间”才是最重要的,而”SPF50+++“”PA+++”做为一个妹子,其实不知道防晒效果如何,只是猜测大概是一个防晒等级,所以着重把防晒时间、防晒力度突出。


在对比设计的处理上,使用深色背景作为我们产品,其他品牌浅色,这样一深一浅,对比十分明显,顾客也更直观看到我们产品的优势。








在颜色选择上,配色上不能看起来比较脏,同时颜色最好跟详情的基调一致。



以下案例是一款身体乳,产品外观是粉色的,所以在背景选择的浅粉色,标题比较醒目,同时也增加了一些投影,显得整体画面更加丰富饱满。而修改前使用的是很深的灰色背景,显得画面特别素特别脏,不够丰富。







有时候画面太苍白,显得没有设计感,那么我们可以找一些色调比较简洁的光影来做为背景。



以下案例是一个是白色背景,一个是有色背景,明显能够感觉到右边丰富一些。当然下面的图文排版也是一项加分项,导致我们看着右侧舒服一些。因为左侧成分图片太小了,所以显得太小气了。







光影是模拟画面中的真实性,能让顾客感觉到空间层次感,如果光影没有处理好,则看起来会很假,不够真实,从而降低用户信任感。


在制作中我们可以根据产品的光源方向,制定投影,但一定要根据产品实际情况做,下图左侧我们可以看出影子是没有厚度,太窄了,而且影子颜色也特别脏,而下图右侧这张图是修改之后的效果影子真实性比较强,空间感十足。






---------------------喜欢就点个赞吧!---------------------

162
举报
|
118
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
一个人拿着优惠券准备支付购物电商矢量插画
运动风人物插画
卡通女孩与网页表格3D渲染
三位美女围着网页看信息矢量插画
一个男生和两个女生站在网页前面打招呼矢量
浏览电脑网页的元素
网页图标
banner
网页背景
B19【星空诗意&网页幽灵按钮】公司产品服务简介汇报
 网页背景
四个人物分别在上网贴纸合集
卡通风格网页页面3D渲染
商务网页
卡通风格网页页面3D渲染
男生和女生站在网页面前矢量扁平插画
互联网,互联网插画,商务,数据,项目,合作,网页插画,插画,大数据,智能,商业,网页,网页设计,插画设计,互联,未来,沟通,渐变,蓝色插画,商铺,覆盖,管理,项目管理,效率,提升,高效,关系,拓展,
网页设计——纸杯蛋糕
网页电商背景矢量插画
男生坐在网页面前办公矢量插画
新年快乐送福网页矢量图banner
三个青年正在装修网页矢量插画
卡通风格网页页面3D渲染
网页页面矢量插画
互联网,互联网插画,商务,数据,项目,合作,精准,投放,网页插画,插画,大数据,智能,商业,网页,网页设计,插画设计,互联,未来,交流,沟通,渐变
你可能喜欢
相关收藏夹
大家都在看
登录注册