请选择 进入手机版|继续访问电脑版
返回列表 发新帖

[O2O场景系列简介] 微页面简介

[复制链接]
发表于 2016-12-28 13:29:35 |显示全部楼层 | 阅读模式
微页面简介
【O2O场景系列】





微页面功能主要用于制作手机端的展示页面。一个商户的微官网中的所有展示页面都可以用微页面制作出来。
流程如下:
首页:确定SITEMAP——完成首页设计稿——切割好图片,用作图片素材完成微页面——所有组件一一绑好链接——保存成为首页;
内容页:做好内容页的设计——准备好图片、文字素材——制成微页面——将微页面链接绑到相应的地方

我们先看两个案例,微信扫描二维码,去感受一下动态的微官网吧。


微官网-案例.png

其实他们都是用这样的组件拼成的:


微官网分解2.png
微官网分解1.png



一、组件


设计师在设计官网时,就应该考虑到每个板块应该会用什么组件去做。

1)幻灯片组件——自动滚动,左右撑满无留白
滚动展示相同尺寸的图片(最多5张),每张图都可链接到其他页面。仅支持JPG、JPEG、PNG、GIF格式,推荐宽度640px,高度不限。
微官网-幻灯片.png




2)Banner组件——左右撑满无留白
一张左右撑满的图片,可链接到其他页面。仅支持JPG、JPEG、PNG、GIF格式,推荐宽度640px,高度不限。

微官网-Banner.png



3)图片组件——每行1~4张均可,左右有留白
由1~4张相同尺寸的图片拼成1行,每张图都可链接到其他页面。仅支持JPG、JPEG、PNG、GIF格式,推荐宽度640px,高度不限。

微官网-图片.png



4)首部导航组件
需要上传png格式的商户LOGO。可以用作微官网的通头,点击可以快捷到达其他页面,也可以搜索其他页面。


微官网-通头导航.png



5)富文本组件
富文本是一段图文。多用在文字比较多的内容页,支持秀米编辑器编辑好的图文。

微官网-富文本.png



6)商品组件
提前在eshop中创建好商品后,可以在插入商品组件(不需要额外做图)直接调取商品的展示图、品名和价格。有1大、2小、1大2小三种排版,点击可以直接进入商品购买页。


微官网-商品.png



7)文章列表组件
多用于内容页的列表页。有大图、小图2中样式。

微官网-列表.png


8)辅助空白组件
所有组件都没有上下留白,要添加空白就要添加“辅助空白组件”

微官网-辅助空白.png




二、页面信息

页面标题、底色、分享规则这些小地方很容易被忽略掉,提前设计好每个页面页面信息,有助于更加快速地完成微官网制作。

1)网页标题

网页标题.png



2)页面底色

微页面的一部分组件会有留白,这留白的颜色就是页面底色。页面底色可以在后台自定义。

微官网-页面底色.png



3)分享三件套

如图。
微官网-分享三件套.png

4)加密浏览

点击进入页面后,输入正确额的4位数字密码才能够查看内容。

微官网-加密浏览.png



回复

使用道具 举报

发表回复

您需要登录后才可以回帖 商户登录

快速回复 返回顶部 返回列表