如何做出更出彩的电商详情页设计中图标展示模块(附灵感杰作)

电商详情页设计中,图标这一屏多数会展示在首屏kv之下,因为它具有着快速让消费者了解产品特点,以及过度的作用,所以理所应当图标这一屏我们也不能应付。今天就着重说一下详情页中图标展示模块,如何做更出彩?

     
图标展示,就是指产品的卖点通过图标的形式去展示,下面我们以展示形式的不同进行分类。
          

1. 文字与图标结合形式 

这也是最常见的一种表现形式,因为也是相对来说最简单的一种手法,把产品的卖点,通过对应的图标展示出来:

图片

图片

如何做出更出彩的电商详情页设计中图标展示模块(附灵感杰作)

 

在上图基础之上加点光影效果,会使得这个模块视觉感受更加丰富:

 

图片
          
图片
          
图片
          

做设计最重要的是发散思维,多思考,先大胆的想,再考虑细节。

 

2. 产品结合图标形式

制作产品详情页的目的是有两个:让用户更快速的了解产品和促进购买,所以很多时候为了让用户更直观的了解产品,往往会将产品与图标相结合,在一定程度上也能增加互动与关联性。
          
这种表现形式,画面感很丰富,也很有代入感。
          
下面看看几个类似的案例:
图片
          
图片
           
图片
          
图片
          
图片
          

如上图案例所示,产品与图标文字相结合,

使得冷冰冰的文字图标变得有温度、真实。

 

3. 图标拟物化表现形式

不同类目的产品都有不同的特性与卖点,我们不妨可以将产品的局部或者某个角度展现成为图标,这样图标与文字的互动会更好。
          
下面看看几个类似的案例:
图片
          
图片
          
图片
          
图片
          
图片
          
图片

 

4. 优化图标底色表现形式

如果产品不能提取能为我们所用在图标上的点,那么我们可以去优化图标的底色,来让我们图标变得有温度,有层次,同时具有质感。
          
通过几个案例一起来感受下:
图片
          
图片
          
图片
          
图片
          
图片

 

总结

在做表现性很强的详情页时,尽量要做到面面俱到,往往细节才是决定一个作品高度的重要标尺。

表现手法与技巧千变万化,以上只是我在平时收集的一些灵感杰作,在此抛砖引玉,欢迎大家一起讨论。

 

作者:幺妹儿

叶子设计 >> https://www.yeziui.cn/tutorials/icon/1317.html

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注