产品页面是你的顾客在购买之前看到的最后一件事。
或者,如果事情没有按计划进行,他们离开前看到的最后一件事。
让我们从六个不同的细分市场细分六个商店,每个商店都有令人惊叹的产品页面。我们会把他们的产品页面——都是用Shopify制作的——放在显微镜下,看看他们在做什么,你可以在你的商店里复制。
标准产品页面
无论你为Shopify商店使用什么设计模板,产品页面后端看起来都是这样的:
这或多或少就是产品页面打开的方式:左边是图片;描述和添加到购物车右侧按钮;可选的东西,比如社交按钮,数量选择器等等。
当这样的页面被推送时,它们或多或少会类似于这个:
这没什么不好的。所有的必需品都在那里。多个图像,颜色选项,当然还有添加到购物车按钮。
但是让我们来看看一些巧妙的商店是如何把标准的产品页面变成令人瞠目结舌的产品页面的。
Allbirds
销售鞋子的Allbirds创建了我们上面看到的产品页面。你知道的,就是长相正常的那个。
但Allbirds的产品页面只有在你不向下滚动的情况下才正常。一旦你深入进去,你会发现一些最好的产品页面。
这里有很多值得奉承的地方。首先,Allbirds遵循“形式服从功能”的古老格言。也就是说,它们有一个产品描述,在提供的空间里,在特色图片旁边,不破坏布局的对称性。
但是这里并不缺少信息!因为当你点击“了解更多”时,你会被重定向到产品页面较低的锚点。
在这里,你会发现一个巨大的,丰富多彩的部分专门用于细节,而不是干净地放在上面:
没有规定说产品描述必须局限在购物车按钮上方的小角落里。把这些细节往下移动给了Allbirds两全其美:大量的细节和图像突出了产品,和直观的布局。(这种布局也保证了添加到购物车钮扣固定在折页上方。这就是它的归属。)
Allbirds的产品页面上还有一件很棒的事情,那就是他们不经意间插入了一些厚颜无耻的视频:
当你点击那个“图片”时,你会看到一个视频,而不是另一个产品图片。这段视频很简单,只有几秒钟。这里没有艾美奖提名。但是这些触摸可以彻底改变你的产品页面。
关于Allbirds的产品页面,还有一些事情需要指出。
想让你的产品页面令人难忘吗?一个奇怪动物的高清图像怎么样?
然后是一系列的好处,从舒适、方便到环保,每一个都有自己漂亮的图标:
产品页面上的社交媒体插件?是啊,为什么不呢?
查看更多:Allbirds产品页面示例
哼哼
下一个是北欧家具品牌哼哼。哼哼采用了一些巧妙的策略,将产品页面变成一种完全属于自己的体验。
好了,这是基本的产品页面——是上面的部分。如果有人已经决定购买,他们可以直接下订单。
在附加细节上,哼哼有自己的省钱之道。他们利用折叠功能,而不是链接到产品页面的其他部分。这个…
变成了这样:
这种布局使您不必向下滚动以获取任何重要信息。当然,如果你做向下滚动,事情变得非常有趣。
这是你最先看到的两个图像:一个是视频,另一个是仙人掌。
我不记得曾经在沙发上看到过仙人掌。也就是说,自从我看到这个沙发仙人掌后,我就没有忘记它。太酷了。一方面是一个昂贵的沙发——一个拥有你所期望的高端斯堪的纳维亚设计的沙发——另一方面是一个小仙人掌。这种怪异成功地创造了一个令人难忘的奇异场景。
然后是视频。再说一次,这不是电影节级别的摄像。但这是动态图像,人们喜欢动态图像。这段26秒的视频从多个角度展示了这款沙发,并说明了它的制作是多么容易。
在那之后,更多的图片——大而漂亮的图片——加上一些文字,给购物者提供他们可能遗漏的任何细节。
查看更多:Hem产品页面示例
纯粹的周期
自行车制造商Pure Cycles在他们的产品页面中加入了许多漂亮的元素。
让我们把注意力集中在四个微妙但聪明的触点上。
1.这颗小心脏
这颗心可以让你在愿望清单上增加一些东西。这是一个不错的做法,原因有几个:首先,它让未来的购买变得更容易,这总是一件好事。其次,它诱使人们提供他们的联系方式,使Pure Cycles能够通过电子邮件和折扣代码加速未来的购买。
2.这个Messenger选项
这对购物者来说非常方便。这可能也不会影响Pure Cycles在Facebook上的努力,即让购物者在产品页面上与社交媒体平台互动。
3.更多的内容!
Pure Cycles给你一个提示,在这个产品页面的折叠下面有额外的内容。以防有人误以为这个页面的开始和结束都是简单的购买。
4.可爱的视频
最后是嵌入在产品照片中的视频。
点击那个,你会看到这个。两个漂亮的人开着他们的纯自行车享受生活的50秒没有错。
Pure Cycles产品页面的其余部分可以预见是美丽的。Pure Cycles加载了客户评论、照片、社交媒体插头和运输细节——这些东西绝对不适合放在旁边添加到购物车按钮。
对于那些渴望了解具体细节的人来说,Pure Cycles为你提供了以下内容:
查看更多:Pure Cycles产品页面示例
关于产品页面视频的简短介绍
如果你看过Pure Cycles的视频,你可能会想,我怎么才能创造出这样的东西
毫无疑问,这段视频相当漂亮。这种事不会凭空出现的。
但视频并非不可能!
不相信我?假设一家小商店开始卖运动衫。运动衫是一种绝对可以在产品页面上使用视频的商品,所以商店应该制作一个!
当然,这段视频不会得到任何起立鼓掌。如果你不想买一件这样的运动衫,那也情有可原。但是不要对制作视频的想法翻白眼!这不仅仅是大品牌的专利。进入门槛已经降低到一杯浓咖啡和一部iPhone。
好了,我们去下一家店。
硕士&动态
Master & Dynamic销售高端音频配件。产品页面的顶部相对正常…
但当你环顾四周时,一切都变得非常优雅。
下面是Master & Dynamic产品页面——一个准功能时间轴:
这是非常聪明的:使用实际产品的设计来推动布局。当然,耳机线特别完美。但即使你卖的是指尖陀螺、瑜伽垫或其他东西,围绕产品构建产品页面也能给你提供一个连贯的工作结构。
在底部,在你看过一系列迷人的照片之后,你会得到技术规格。
查看更多:Master & Dynamic产品页面示例
周日供应
澳大利亚一家销售沙滩伞的商店Sunday Supply的产品页面做得很大。真的很大。
他们忽略了标准的“产品在左边,细节在右边”的布局,取而代之的是大量的图片。
甚至礼品卡产品页面都有一个巨大的图像:
你不用走很远就能找到添加到购物车按钮,它位于这张照片的正下方。(Sunday Supply的纽扣上写着“添加到包里”,因为,你知道,这是海滩主题的。)
然后你会看到一些产品细节,这些细节是用一种不可抗拒的迷人声音写的,赋予了这把伞人性化的品质,比如“在阳光下度过漫长日子的情人和一个伟大的伴侣”。
其他细节,如“可折叠至1.2M X 0.2M X 0.2M”或“~7.0KG重量”可以在页面下方找到,所以这就是所有的内容。但为什么不从有趣的事情开始呢?
就像任何出售沙滩装备的商店都会明智地做的那样,Sunday Supply也会在野外展示其产品。当你可以用海洋作为背景时,为什么不呢?
查看更多:Sunday Supply产品页面示例
工作室的
Studio Neat的设备存储和充电单元的产品页面和他们销售的时髦物品一样优雅。
页面的基础结构是标准的,但执行异常。描述文字的两句话让你想象物品在你的地方会是什么样子——“在你的床头柜上或在你的桌子上……”——像圆形图像一样的触摸给它一些流行感。
在这下面,我们遇到了一个视频,是干净和抛光,但不需要好莱坞的专业知识。
然后,产品页面变成了一个视觉导览,如果你购买了这个坞站,你可以期待它的功能。与此同时,还有一些休闲文本的口音(“所以无论你怎么滚动,你都会有一个位置为你的设备”)。
最后,产品页面上有一些这款手机在家里和办公室周围的照片。
Studio Neat的产品页面设计各不相同,但都很棒。例如,这里有一些产品页面上的触摸屏引脚的照片。这节解剖学课既翔实又引人注目。
与此同时,这支钢笔的特写镜头真的让你想和它玩一玩。
查看更多:Studio Neat产品页面示例
关于产品页面的结论
这些产品页面都有一些共同之处。让我们去找他们吧。
有很多空间——利用它
这些产品页面不浪费像素,也不回避让购物者滚动一点。产品版面出现在杂志和报纸上,因为版面很宝贵。但在网上,你不必在额外的图片和额外的详细信息之间做出选择。全部用上。
视频和巨幅图片
我们已经谈到了视频。你应该做视频!当然,别忘了照片。这些书页上有精美的图画。如果你是一个托运人,这意味着你不应该只使用供应商的照片。订购你的产品,并采取你自己的。你不需要卖自行车或高科技音响设备来让你的产品照片栩栩如生。
在页面顶部仍然可以进行转换
这些令人瞠目结舌的产品页面将有助于转化那些对购买犹豫不决的人。这就是为什么我们看到照片、视频和精美的布局。但是不要忘记那些已经把信用卡拿出来的人!如果有人准备购买,就像这些商店所做的那样,使购买商品不需要滚动或搜索。
想了解更多?
这里有一些其他的文章,将帮助你确定你的产品页面!