电商网站商品模型之商品详情页设计方案
时间： 14:34:28
&&&& 阅读：103
&&&& 评论：
&&&& 收藏：0
标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&如下设计方案参考淘宝和华为商城
SKU SPU的关系
SPU = Standard Product Unit （标准产品单位）SPU是商品信息聚合的最小单位，是一组可复用、易检索的标准化信息的集合，该集合描述了一个产品的特性。例如iphone4就是一个SPU,与套餐、存储容量、颜色无关。
SKU=stock keeping unit(库存量单位)SKU即库存进出计量的单位， 可以是以件、盒、托盘等为单位。SKU是物理上不可分割的最小存货单元。在使用时要根据不同业态，不同管理模式来处理。例如32G白色iphone4就是一个SKU。
一个SPU包含一组SKU，我们通常把一组具有通用信息的商品抽象成一个SPU，这样更加有利于数据的复用。
比如淘宝就是把规格参数和商品详情放在SPU中，这样同一个SPU下的多个SKU就可以复用这些信息。而把影响价格的属性选项(颜色、套餐、存储容量等等)放到SKU中。
&注意：数据库设计时，SKU的id可以用自增长的七位数字表示，在数据库初始化时设置SKU的id的起始值为1000001，然后递增增长。
&在电商网站的商品详情页的头部，我们经常可以通过点击不同的选项(颜色、套餐、尺寸等等)从而改变商品的价格
对应的数据库设计方案如下图：轮播图的设计参考华为商城
属性为什么要放到分类下面呢？如果把衣服和手机都看做一个分类的话，它们都有颜色属性，但是它们所有的具体颜色有不太相同，比如衣服的颜色种类会比较丰富而手机的颜色可能就黑白蓝等简单的几种颜色。这样做确实是增加了数据库的冗余，但是对在后台添加SKU带来了查询上的方便，提高了用户体验。
后台界面设计方案：
第一步：添加一个分类
第二步：给分类添加所属属性
第三步：给属性设置一系列选项
第四步：添加一个SPU并设置SPU下的一组轮播图片
第五步：添加一个SKU，添加SKU的时候根据选择的不同SPU自动列出对应的属性和属性选项供勾选(只能单选)，并且列出SPU下的一组轮播图片供SKU挑选
前台界面数据读取方案：
第一步：当跳转到某个SKU详情页面的时候，根据当前的SKU查出当前SKU所在SPU组下面的所有SKU的属性及属性选项分组展示，默认勾选当前SKU对应的属性选项值。
第二步：当用户选择不同的属性选项时根据选择状态计算出对应的SKU，然后改变商品名称、显示价格、及轮播图图片。
规格选项是和SPU对应的，规格是一组相同SPU的商品的描述信息。
设计方案：&
后台界面设计方案：
第一步：添加一个分类
第二步：给分类添加规格组
第三步：给规格组添加规格
第四步：给规格添加规格参数
第五步：添加SPU时，列出SPU对应分类下的所有规格组、规格、规格参数供勾选(可多选)
前台界面数据读取方案：
第一步：当跳转到某个SKU详情页面的时候，根据当前的SKU查出当前SKU所在SPU下的所有规格参数，按规格组、规格合并显示。
&商品详情设计
商品详情实际上是文字信息加一系列的图片(从详情图片表中取)。我们把商品详情放在SPU中。
设计方案如下：
后台界面设计方案：
第一步：SPU编辑界面上传详情图片
前台界面数据读取方案：
第一步：当跳转到某个SKU详情页面的时候，根据当前的SKU查出当前SKU所在SPU下的所有详情图片。
&完整的设计方案
&标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&原文：http://www.cnblogs.com/eggTwo/p/6404805.html
教程昨日排行
&&国之画&&&& &&&&&&
&& &&&&&&&&&&&&&&
鲁ICP备号-4
打开技术之扣，分享程序人生！电商App如何让用户直接打开商品详情页
俗话说“酒香不怕巷子深”，但再香的酒没人知道，也是浪费。做电商，产品再好没人用，也是徒劳无功，所以就需要各种手段来提高APP的活跃度和下载量。
首先从运营的角度来说，通常的手段有：
1.初期的种子用户寻找
在产品的冷初期阶段需要种子用户，这一批用户维护的好后期会成为核心用户，是口碑最好的宣传者。
2.场景化的活动运营
除了节假日必备的活动，还要准备日常的活动，提高用户粘性，活跃用户。可以通过签到、登录、积分等。
3．精细化内容的推送
精准的内容推送到正确的用户上，才能起到活跃的效果。了解用户，并且推送不同的内容在正确的时间段，对增加APP活跃度有很大效果。
作为运营来说，上面提到的只是常规的手段，还有很多方法就不在这一一细说了。
但是作为程序员，开发者，如何在技术上助力电商平台的运营，引进更多的用户呢。
其实，问题也就是怎么实现点击分享商品的链接就能直接打开App？
上述问题看似一个简单的需求，但是实际上却涉及到前端、后台、客户端的配合实施。
最简单的大家可能都知道，不管是iOS还是Android，都可以通过scheme去打开一个电商应用，所以，这是最直接有效的方式。但是这种方式有很大局限性，大多时候显的都不是那么直接。
随着系统的升级，Android有了App Links深度链接技术，iOS也出现了Universal Link通用链接技术，但是实现这些也是需要耗费巨大资源的以及很多复杂的配置步骤，到最后结果也可能不是那么尽如人意，所以建议使用MobLink来满足自己的需求。
MobLink作为一款实现网页无缝跳转App的个性化扩展工具，它主要做到了下面几件事情：
从Web端打开的页面，可直达App指定页面，一键唤醒App；首次安装App，即可恢复对应场景。场景还原可以帮助开发者提升App活跃度，降低用户在Web端跳转至App过程中的流失率，新用户在首次打开App时，呈现正是用户想看的内容页面，大大提高用户转化率。
数据统计分析
Mob数据后台提供实时反馈的App启动数、应用新增数、页面分享浏览数，开发者可以随时了解用户分享行为和应用拉新情况。
Web多点跳转App
在Web页面上，MobLink支持多点直接跳转至App，提高不同内容的分享效率，用户点击Web页面任意内容，均可直达App相应页面，实现无缝对接。
最关键的是MobLink集成简单，免费且有强大专业技术团队的后期维护。
那么对于电商App来说，如果实现了以上技术和场景，就做到App商品自我分发后的回流，加强了用户体验，还能够将App中的商品在渠道进行任意分发，实现APP用户的快速增长。
责任编辑：
声明：本文由入驻搜狐号的作者撰写，除搜狐官方账号外，观点仅代表作者本人，不代表搜狐立场。
今日搜狐热点电子商务网站设计分析五：商品列表页设计
互联网 & 12-20 11:30:05 & 作者：佚名 &
电子商务中的商品列表页也被称为商品聚合页，是为了能为消费者提供更完善的商品种类选择。这一类页面的最大特点就是信息量大、图片多，所以布局是否清晰合理，以及如何尽可能的压缩内容是商品列表页设计的重点部分。
目前，国内电商网站的商品列表页常见表现形式有三种，分别是行列排列、瀑布流和特别款突出。这三种形式各有特点，设计师应该根据商品特色选择最适合的表现手法。
如果商品的种类数量多且繁杂，规规整整的行列排列方式更利于用户找到浏览规律；瀑布流的形式更多的在流行时尚领域的电商中使用；特别款突出的方式可以为一些节日活动的宣传促销而准备。在下面的案例中也会一一提及。
延伸阅读：电子商务网站设计分析系列之一：首页导航电子商务网站设计分析系列之二：首屏设计电子商务网站设计分析三：登陆注册页设计电子商务网站设计分析之四：面包屑导航
1.展示基本信息
正因为商品列表页相较于其他页面会显得有些拥挤，因此设计师更应该抱着在限制的区域范围内展现最有用的信息的心态来设计网页。正在浏览商品列表页的用户也许对商品的细节描述并不是很在意，此时的浏览模式更偏于走马观花，因此，简单扼要的图片、商品名称，以及价格说明就已经能够满足用户在该页中的需求了。
顺丰优选的整个商品列表页面看起来很简明，但展示的商品信息却并没有弱于其他电商网站，用户真正希望得到的资讯都得到了完整的体现。
2.鼠标悬停时产生交互效果
很多网站都会忽略鼠标悬停时应该产生的交互效果，其中也不乏一些知名电商。虽然只是一个很小的效果，但它存在的意义却远不仅如此，甚至承载了一份网站与用户之间的互动和反馈。
天猫的商品列表页在给予用户即时反馈这方面做得很到位。当鼠标悬停在商品范围时，显眼的红色线框就马上将该商品与其他商品区分开来，而线框的红色与网站主色调相同，这样也让整体表现得不突兀。
3.出现适量的附加信息
刚才提到了商品列表页应该尽量做到简单简洁，但在此基础上适量的增加一些对用户挑选商品有帮助的附加信息可以起到锦上添花的作用。
聚美优品的在列表页采用了特别款突出的表现形式，并且向用户展示了商品的多视角图片，让用户无需进入到详情页就看到商品全貌，间接降低了商品详情页的跳出率。
美丽说是一个偏向时尚年轻化的网站，因此设计师使用了这类人群都能接受的瀑布流展现方法。美丽说的商品列表页的特点在于增加了其他用户的评论模块，这也是人们在网上购物时很注重的部分。
4.始终带给用户指引
可能很多电商网站都认为，当用户在商品列表页面停留就意味着即将找到自己需要的商品；而现实却告诉我们，用户很可能在不断翻页的过程中会不知不觉的改变了之前的目标商品，因此，网站应该始终为用户提供指引，带给他们明确的方向感。
YOHO的商品列表页有利有弊。侧边导航始终存在于页面上，为用户的页面跳转提供了很大程度的便利；但不足之处是侧边导航呈静态，如果能实现动态，可以随着用户鼠标的滚动而始终保持在屏幕之中就更好了。
5.设置相关推荐，促成更多消费
用一种商品推动另一种商品的销售，这是电子商务网站中的惯用营销手法，但这样的方式如果运用的太过生硬用户一定不领情，网站应该试着用柔和的方式传达相同的意思，设计师也许也能为此出一份力。
淘宝对此的做法是将推荐信息融入到列表页的每一个商品中。&找同款&和&找相似&的字样也不会让用户觉得有太浓重的商业味。
&6.扫清页面死角
页面中的每一个区域都有它的价值和意义，可能只是用户视觉的感知程度不同而已，只要做好布局，页面死角可以变得不存在。
商品列表页的死角多见于页面侧边和底部，而京东将这两片区域使用为其他产品的推广途径，比如销量排行和商品精选等。
7.用特色商品激发购物欲
如果你觉得特色主推性质的商品只能放在网站首页你就错了，首页首屏的确是整个网站最佳的宣传黄金位置，但所得到的效果却不一定是最理想的，根据商品的类型安排布局才能达到事半功倍的效果。
如易迅网案例所示，手机产品的相关推荐就放在手机商品的列表页头部，让真正有购买需求的用户都能看到。
8.吸引人的商品活动尽量置后
中国有句谚语，&好戏总在后头&，这句话也同样适用于电商商品列表页的设计中。把相对吸引人或是目的性强的商品活动放在偏后一点的位置，有利于整个网站的运营。
一号店将有针对性的&热卖推荐&和&与您浏览记录相关的商品&放在页面最后，让原本可能打算结束浏览的用户重新发现新的感兴趣的内容。
9.减少操作步骤
在商品列表页中，力所能及的步骤减少只有从商品加入购物车开始着手。但在此之前的大前提是商品信息展现的足够全面和完整，要在小区域内表达出所有内容也的确是一件比较困难的事。
在商品列表页上直接显示&加入购物车&按钮并不少见，但能同时显示购买数量的就不多了，DHC官网实现了这一操作，让用户能够直接选择商品数量和种类。
10.从众效应
从众心理是网上购物人群的普遍状态，因此，买过该商品的顾客对此做出的评价对于用户来说很有说服力，商家可以利用这一点在网页的设计上做出一些小改变。
乐蜂网在商品列表页增加了用户很看重的评论和购买人数模块，这样能让用户更直观的看到商品的人气指数。
AnyForWeb认为，商品列表页是用户真正进入网上购物状态的第一环节，因此，舒适的用户体验变得尤为重要，设计师应该根据商品或行业的不同商业诉求作为首要考虑因素。
大家感兴趣的内容
12345678910
最近更新的内容您的位置：
电商APP运营：商品详情页的转化率要怎么提高？
导读：文章是作者总结的一些对于商品详情页转化率提升的看法，与大家分享，希望对大家有所帮助。
一般我们说的商品详情页通常会包含下面这几点基本信息：
商品内容介绍
商品价格信息
这三点是商品详情页中必不可少的信息点，但是对于用户来说，这些信息并不能完全勾起他们的购物欲，除非这个商品本身的自带属性就击中了这个用户，比如：用户A就是很想买这样子的可爱袜子。不然的话这个商品的包装就略显清淡了一些。
想要提高商品详情页的转化率，你还必须做到以下几点：
1.构建用户的信任感
在这个假货横行的时代，用户的危机感更重了，他们不再傻白甜的拿到快递就开心的跳舞，他们会深思熟虑，谨慎下单，会去网上扒各种真假对比。这些的源头都是因为他们对电商平台的不信任所导致的，所以在商品详情页中展示出这个商品的来源变的极其重要，就是所谓的“品质保证”。
比如网易考拉，它在商品详情页的底部会用一整屏的内容来凸显他们对用户的承诺：正品保障，假一赔十。非常的简单粗暴，但又让人信服。
而且在商品详情页的上方也能看到这个商品的发货源“xxx保税仓”
而在洋码头等电商平台，则以卖家直播采购的形式来主打正品概念，完全透明化的采购流程让用户更放心。
亦或在商品详情页中直接加入官方的授权书，也是有力的证明。
其实这些种种都是为了让用户有安全感，有了安全感，用户就会在你的平台上很放心的买东西，会变得信赖你，回购率也会相应提高。
2.突出价格优势
想要提高商品详情页的转化率，体现出价格的优势也是极其重要的一点，这有时候可以起到决定性的作用。
直接：活动促销
通常使用的方法就是打折促销的方式来体现价格优势，与原价做对比，鲜明的价格差非常诱人。如果再加上时间的限制，会更加刺激用户去购买，给用户一种现在不买就要亏的错觉。像这样的活动比如：限时折扣、会员专享价、聚划算等等。
间接：组合购买更优惠
这属于是一种间接的降价策略，像这样的活动比如：套装购买更优惠、专场满减、满99选4件等等。这是一个非常好的手段，既可以刺激用户购买商品A，又可以潜在的拉动其他商品的销量。
3.商品信息的优化
展示图优化
商品的展示图一般分为商品主图和详情图两种，但首先要做到的还是要好看才行，对于图片清晰度、色彩感的筛选是第一步。
商品主图一般主要展示该商品的整体和细节样式。比较大牌的美妆护肤类产品可以使用白底背景，这样会显的商品更为正规官方，简洁大方。而居家、食品、文具、服装这样类型的商品则较为适合用场景图的方式来展示，看起来会更贴近生活，给人亲切感。
商品详情图则一般是为了展示商品的功效、用法、材质等细节介绍，可以用细节图片+文字穿插的方式来全方面的介绍商品，不建议太大段的文字描述，那样看起来会很累，会让用户无法理解重点。
需要提到的一点是，当商品使用后有明显变化时，一定要附上前后对比图，视觉的强烈冲击是一个很能击中用户的点。比如：卸妆水、素颜霜、口红、眼影、腮红等等。
品牌的优化
对于一个商品来说，品牌的介绍可以增加它的专业度和知名度，更加完善它的信息。
除此之外，还可以加入一些博主、媒体、杂志、网站等平台对商品的推荐，更加能提升它的口碑。
对于现在的商品详情页，评价模块可以说是起着主导性的作用，很多用户一点进商品还没看商品的详细介绍就直接打开了评价模块，仿佛关于商品的一切信息都可以从这里得到。很多时候，用户会靠着“大家都说好一定就是好”的观念来购物，这时候把好的评价置顶就显的很重要，这样至少让用户的第一印象就是好的。
包装物流服务
在商品详情页中展示包装与物流服务，可以体现平台的专业度和诚意感。具体的话，可以放一些展示商品被仔细包装的图片和保证运输过程不受损、下单后几小时内发货、物流速度快的话术。
在商品详情页中可以加上推荐搭配一起使用的商品，这样可以提高用户的购买数量，以此来提高成交的客单价。比如：去黑头产品搭配收毛孔化妆水。
在详情页的最后可以加入几个相关推荐的商品，把这个详情页流失的用户转到另一个商品中去。
4.让商品详情页富有特色
加入视频、动图、试用报告
多方面展示商品的特点，展现形式更为生动，可以让用户更加了解商品。
给客人一些小惊喜，比如：随单小礼物、买就送XXXX、可以代写贺卡等等。
5.商品详情页那些要规避的踩雷点
图片太清晰
当图片越清楚，就意味着它的容量也就越大，作为手机端用户来说，图片的加载速度会变得很慢，这时候就会非常容易就流失用户。
详情页的排版一定要有主次性，上下贯通，不能一股脑的把信息全都丢在里面却又不整理它，这样用户看的也会云里雾里，不知道商品的特点到底在哪里。
相关推荐不易过多
在详情页中相关推荐商品只是一个附属品，所以不易过多，一般3-5个就足够了，不然容易喧宾夺主。
以上，就是我所总结的一些对于商品详情页转化率提升的看法，欢迎大家来一起讨论，发表建议。
作者：好大一朵油菜花，堆糖电商运营编辑，1年电商运营经验。
(转载请保留)
您刚刚看过
互联网的一些事，已超50万小伙伴关注！