header_v1.7.40

web前端经典教程之突出卖点

60天前发布

原创文章 / 多领域 / 观点
鬼谷魂 原创,如需商业用途或转载请与鬼谷魂联系,谢谢配合。

大型互联网商城在网页中突出产品的技法……!

作为打工者,我们卖的是自己的技能和智慧;作为企业来说,卖的就是自己的产品和服务;为了尽可能的增加销售,总是会在合适的时候突出或者植入一下产品,生怕顾客没看到似的。有的除了把产品的设计打磨的极具质感以外,还会在产品展示中增加一点动效来吸引眼球。今天,我们拿电商的3C产品为例,讲解一下面对不同的设计时突出产品的动画技法吧!文章展示用的是静态jpg图片,具体动画效果请看文章后面的视频……


《正面站队款》

1. 这种适合由远至近层层渐隐出现,最后突出中间的主打产品,这样有没有一点黑涩会大佬出场的霸气呢?这里我还想到了一首跟这个节奏差不多的神曲,那就是Alan walker的那首《fade》。如果是在做影视后期的片头,我会把出场的时间跟音乐卡好点,形成共振的感觉……


《平铺斜放款》

1. 这种适合从左往右或者从右往左依次沿着倾斜角度飞入,这样会不会有一种黑客帝国的文字雨效果呢?这样既可以突出产品,又可以让活动显得隆重而盛大,潜在的告诉顾客,本次活动更优惠哦……!


《透视堆叠款》

1. 这种堆叠的适合从底层一个接一个按照各自的摆放方向飞入,不同款式的产品差不多同时集合在一起,看起来就有一种风云际会似的感觉,当然这是我杜撰的。


《正面交错款》

1. 这种除了像第一种方式那样出现,也可以左右交替淡入出现,效果也是非常不错的。


《三三两两款》

1. 这种三三两两在一起的,可以把两个当成一个略有出场差异的小整体,然后在从左往右或者从右往左依次上升出现,也可以达到突出产品的效果。

基本上通过上面五个企业实战案例的系统学习,你就可以掌握一些布局和css3动画了,可以花二十分钟左右试听一下下面那个高清视频的讲解,这样以后你除了只能在Adobe软件中输出以外,还可以将自己设计的东西放到浏览器、甚至视频播放器中传播啦!



0

    文章信息

    • 文章标签

    没有新消息

    提示文案

    提示文案

    提示失败
    提示成功