电商网站商品模型之商品详情页设计方案

如下设计方案参考淘宝和华为商城

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下的所有详情图片。

完整的设计方案

时间: 2024-10-12 18:06:55

电商网站商品模型之商品详情页设计方案的相关文章

电商网站中添加商品到购物车功能模块2017.12.8

前言: 电商网站中添加商品到购物车功能模块实现: 根据前一篇博客的介绍,我们看到淘宝网站为了保证购物车数据的同步,直接是强制用户必须登录才可以将商品加入购物车.而京东网站是用户在未登录的状态下也可以将商品加入到购物车,此时这个是保存在了cookie中,然后用户登录后,根据商品的id判断商品是否存在,将两个购物车的商品合并,形成最终的购物车商品. 本篇文章分两个模块,分别看下这两个功能是如何实现的: 1.必须在用户登录的前提下,才可以将商品加入到购物车列表 我们今天先看下淘宝网站的状态下的添加商品

39、生鲜电商平台-redis缓存在商品中的设计与架构

说明:Java开源生鲜电商平台-redis缓存在商品中的设计与架构. 1. 各种计数,商品维度计数和用户维度计数 说起电商,肯定离不开商品,而附带商品有各种计数(喜欢数,评论数,鉴定数,浏览数,etc),Redis的命令都是原子性的,你可以轻松地利用INCR,DECR等命令来计数. 商品维度计数(喜欢数,评论数,鉴定数,浏览数,etc)  采用Redis 的类型: Hash. 如果你对redis数据类型不太熟悉,可以参考 http://redis.io/topics/data-types-int

全流程开发 GO实战电商网站高并发秒杀系统

获取资源点击这里:全流程开发 GO实战电商网站高并发秒杀系统 第1章 课程介绍[学前须知] 本章对这门课程进行说明,包括:秒杀系统涉及模块的介绍,秒杀核心的知识点的介绍,课程的学习规划等. 1-1 课程介绍试看 第2章 需求整理&系统设计 [明确需求] 本章对秒杀系统整体需求进行梳理,明确系统具体需求,讲解系统原型设计工具的使用,并结合秒杀系统进行整体架构设计. 2-1 需求分析 2-2 系统架构设计 2-3 [总结&扩展]需求整理&系统设计 2-4 [勤于思考,夯实学习成果]阶段

(转)电商网站50W-100W高并发,秒杀功能是怎么实现的?

电商网站50W-100W高并发,秒杀功能是怎么实现的? 在淘宝.天猫.京东等国内大型电商平台“造节”的带领下,国内各电商平台纷纷跟进,双十一.双十二.618等电商专属节日也吸引了大量的用户参与.节前生意惨淡.访客寥寥,节日当天流量增长却异常迅猛,这对于广大程序猿同学和运维人员来说,无疑是巨大的考验. 秒杀系统的流量虽然很高,但是实际有效流量比较小:利用系统的层次结构,在每个阶段提前校验,拦截无效流量,可以减少大量无效流量涌入数据库,从而保障业务系统的正常运行: 第一步:利用浏览器缓存和CDN加速

(转)大型网站架构系列:电商网站架构案例(1)

大型网站架构是一个系列文档,欢迎大家关注.本次分享主题:电商网站架构案例.从电商网站的需求,到单机架构,逐步演变为常用的,可供参考的分布式架构的原型.除具备功能需求外,还具备一定的高性能,高可用,可伸缩,可扩展等非功能质量需求(架构目标). 根据实际需要,进行改造,扩展,支持千万PV,是没问题的. 本次分享大纲 电商案例的原因 电商网站需求 网站初级架构 系统容量估算 网站架构分析 网站架构优化 架构总结 电商网站案例,一共有三篇本篇主要说明网站的需求,网站初始架构,系统容量估算方法. 一.电商

大型网站架构系列:电商网站架构案例分析

上节课我们小组对淘宝网进行了简要的架构分析,这周我在课余时间对这类大型电商网站的某些具体架构技术进行了梳理和概括,并对一些架构方法进行更深层次的介绍,并且结合软件工程进行典型电商的需求分析. 一.典型电商案例 电商网站:比如阿里巴巴,京东商城,国美在线,汽车之家等.大型门户一般是新闻类信息,可以使用CDN,静态化等方式优化,一些交互性比较多的网站,可能会引入更多的NOSQL,分布式缓存,使用高性能的通信框架等.电商网站具备以上两类的特点,比如产品详情可以采用CDN,静态化,交互性高的需要采用NO

大型网站架构系列:电商网站架构案例(1)

大型网站架构是一个系列文档,欢迎大家关注.本次分享主题:电商网站架构案例.从电商网站的需求,到单机架构,逐步演变为常用的,可供参考的分布式架构的原型.除具备功能需求外,还具备一定的高性能,高可用,可伸缩,可扩展等非功能质量需求(架构目标). 根据实际需要,进行改造,扩展,支持千万PV,是没问题的. 本次分享大纲 电商案例的原因 电商网站需求 网站初级架构 系统容量估算 网站架构分析 网站架构优化 架构总结 电商网站案例,一共有三篇本篇主要说明网站的需求,网站初始架构,系统容量估算方法. 一.电商

如何一步一步用DDD设计一个电商网站(六)—— 给购物车加点料,集成售价上下文

阅读目录 前言 如何在一个项目中实现多个上下文的业务 售价上下文与购买上下文的集成 结语 一.前言 前几篇已经实现了一个最简单的购买过程,这次开始往这个过程中增加一些东西.比如促销.会员价等,在我们的第一篇文章(如何一步一步用DDD设计一个电商网站(一)—— 先理解核心概念)中规划的上下文映射图可以看到,这些都属于一个独立的上下文(售价上下文). 二.如何在一个项目中实现多个上下文的业务 一般情况下,为了更好的分而治之,把不同的上下文作为单独的service,然后通过rpc框架(如WCF)来对其

大型网站架构系列:电商网站架构案例

大型网站架构是一个系列文档,欢迎大家关注.本次分享主题:电商网站架构案例.从电商网站的需求,到单机架构,逐步演变为常用的,可供参考的分布式架构的原型.除具备功能需求外,还具备一定的高性能,高可用,可伸缩,可扩展等非功能质量需求(架构目标). 根据实际需要,进行改造,扩展,支持千万PV,是没问题的. 本次分享大纲 电商案例的原因 电商网站需求 网站初级架构 系统容量估算 网站架构分析 网站架构优化 架构总结 电商网站案例,一共有三篇本篇主要说明网站的需求,网站初始架构,系统容量估算方法. 一.电商