先普及一个概念,CMS。CMS是"Content Management System"的缩写,意为"内容管理系统"。
一、什么是电商的CMS
对绝大多数用户来说,早在当年非主流的时代,我们就已经接触这方面的系统了,最典型的代表就是QQ空间。QQ空间里面,你可以购买黄钻,对自己的空间进行装修,其实就是利用CMS系统对网页的界面进行管理。
而在电商的领域里面,最初级的CMS管理就是对首页进行一个内容显示模块的管理。上图就是从兑吧后台上截图一些它能提供的样式。
1.1为什么有这样的系统
因为兑吧是一个积分商城API模块的专业解决方案提供方,许多APP不需要自己开发一个积分商城,而是直接对接了他们提供的服务,比如说:饿了么、新浪新闻、蜻蜓FM.....
统一解决方案里面的元素就是这么多,但为了不让用户感知出来他们接的是第三方的服务,那么肯定要在UI上做一系列的调整让人觉得自己APP的积分商城模块与别人是有所区别的,所以CMS模块应运而生。
二、CMS是怎么实现内容管理的
2.1开发层面
在CMS最底层的层级,是一个个独特的样式。比如一个前端能看见的方框、圆形等等。组件则是通过这些最基础的前端样式组成的:图片轮播、商品列表、优惠券.......当我们有了组件以后,我们通过把这个组件配上我们专门的数据(内容),设置好显示的位置,多个组件就能组成一个页面。
也就是说,从开发实现的角度来说,我们是由小的环节逐步拼接变成一个大的环节,而对于用户操作层面则是相反。
2.2操作层面
为什么要这么设计操作步骤?因为用户一般考虑问题会从大局进行考虑,也就是表象。那么表象的第一点就是首页的皮肤(UI),光是有皮肤那可不行,还要有具体的内容,所以就会有楼层配置(内容+位置),那么楼层里面是什么东西,跳转以后是什么,因此还需要页面内容配置,以这三个步骤进行划分,小白用户也能简单上手,不会因为系统太复杂而被吓跑。
2.3常见基础组件
三、CMS后台设计
3.1设计思路
这里只需要只提2点:
(1)后台设计简单,则前端页面能自定义的地方就没有这么多;后台设计复杂,则前端自定义化更高。
(2)所见即所得。后台要有一个区域可以模拟前端显示的效果,否则用户不知道自己的布局排版到底好不好看。
3.2简单版
这里拿兑吧的CMS进行举例子,第一个就是选主题色,选界面风格。这里的界面皮肤对于后台实现来说就是一个html文件,当我要增加一个皮肤,那么我需要上传一个html文件,并且上传一个缩略图。下图看到的皮肤图片其实就是一个缩略图。
所谓首页楼层配置,就是将一些用户有可能常用的组件固化下来,就像我在上文提到的那些。兑吧作为一个积分商城服务提供商 ,那么它提供的全套服务不一定所有用户在接的时候都会用到。而如果是一个自建商城,有可能是通过A/Btest,数据分析等手段发现这些功能并不受欢迎,于是对界面重新布局优化。
页面内容配置在这里来说就比较繁琐了。从下图可以看见兑吧的后台是分三个操作模块的。也就是说我选了一个组件以后,组件信息向左折叠收起,然后出现编辑组件内容的区域,和编辑组件详情的区域。这一点的交互设计值得我们产品经理进行借鉴。
这一块从逻辑上来说也比较复杂,因为不同的组件对应的内容是不一样的,不同的内容所要进行的编辑模式应该也是不一样的,这里需要根据具体商城的业务需求进行设计,就不展开分析了。
3.3复杂版
提到电商后台内容管理模块的复杂设计,不得不提的就是有赞的服务。
自定义的程度简直丧心病狂,这里不得不佩服有赞团队在电商领域开发的实力。
有赞一键配置全局的广告,而广告即可以内模块跳转又可以进行外部链接,简直就是一个缩小版的APP广告系统模块了。还可以进行页面的自定义,自定义的内容就像上图截图那样,种类十分多。
但最厉害的还是有赞的魔方。所谓魔方:在规定的布局类根据像素位置进行页面布局,每一个像素块放置的图片和跳转的地方都是不一样的。
当然了,有赞这种复杂的功能一般也只有大型的电商团队才会使用,如果是小型团队,或者电商不是主营业务的,根本不会使用这么复杂的功能。
Reference
1.图片来源:兑吧后台、有赞后台
浅忆
一个年轻的产品经理。立足微信生态圈,熟悉公众号平台、开放平台,探索小程序相关业务领域ing.....
转载联系,学习交流请加微信:Albert__luo(两个_)