无线端设计

你的无线首页能让买家留下来吗?丨网商商学院

2016-06-08 韩小豫 淘宝大学

在设计手机淘宝客户端首页前,我们要明白,无线店铺的首页起的作用比PC首页更大。


从下图可以看出,无线店铺首页起着强大的分流作用,所以无线首页的布局好或是差,就决定了店铺内流量流转是否健康。

仔细分析用户在手机淘宝的购物路径,我们不难发现,用户的购物路径非常简单,一直围绕着“商品详情页----店铺首页----商品详情页----店首页”的轴,这有别于PC端客户的访问行为,因而,我们的美工及运营一定要依据客户的实际走向来完成店铺相应页面的设计。

注意:从用户的访问行为来看,手机店铺的首页与宝贝详情页的装修是非常重要的环节,决定了客户去向以及是否购买。

设计无线店铺首页框架,再去各个模块单独地设计修改。下图是我们设计的无线店铺首页的框架,从整体内容上看,无线首页必须承载八大内容:店招、会员分享、宝贝、分类、活动、形象、优惠券和微淘。

参照上图,我们来看一下无线店铺首页框架中各个模块的主要作用及设计要点:

【店招】这一部分是告知客户店铺营销亮点,比如聚划算活动和店铺活动等。

【标题模块】这部分是告知客户店铺的优势,品牌的理念等。

【焦点图模块】这部分是告知客户店铺主打活动,或者主推宝贝等,也是细化活动分类。

【优惠券模块】可以使用多图模块、左文右图等模块,细化活动分类。

【双列图片模块】这部分可以是活动分类,也可以是产品分类。

【左文右图模块】这部分可以是活动分类,或者店铺相关信息。

【搭配套餐模块】这部分是告知顾客店铺搭配套餐,提高客单价的神器。

【双列宝贝模块】这部分是店铺热卖或者主销的宝贝。

【自定义菜单】这部分引导分类宝贝,有效促进客户分流。

下面我们罗列下各个模块设计要求:

A. 店招设计:如何让店铺高大上

【店招规格】640x200 像素,大小:100KB以内,图片类型:jpg、jpeg、png

【图片内容】1.体现行业地位;2.体现店铺调性;3.凸显活动主题。

举例1:体现行业地位。店铺:三只松鼠旗舰店,如图1-3所示。

图1-3 三只松鼠旗舰店

举例2:体现店铺调性。店铺:茵曼旗舰店,如图1-4所示。

图1-4  茵曼旗舰店

举例3:凸显活动主题。店铺:韩都衣舍旗舰店,如图1-5所示。

图1-5  韩都衣舍旗舰店

B. 焦点图模块的装修要点

焦点图的轮播设定为三轮播:第一轮播设置为店铺活动信息海报;第二轮播设置为单品爆款海报;第三轮设置为配合大促或者活动的单品爆款。手机端焦点图的设置与PC端不同,与PC端相同的是首焦均是店铺主要活动信息,但手机店铺建议以爆款为主。

【焦点图规格】图片尺寸608x304像素,文件大小100KB,格式:jpg、png

【模块内容】最多可以添加4幅banner图片。

模块中的图片内容可以为店铺主推活动,活动主题。聚划算、手机专享、大促活动等。

举例1:聚划算。店铺:茵曼旗舰店,如图1-6所示。

图1-6  茵曼旗舰店

首焦图设计要点要特别注意:

第一轮播:大促信息清晰可见,避免多重信息,避免视觉混乱。

第二轮播:单品爆款为主,排版简洁,突出产品。

第三轮播:大促活动爆款推荐,信息清晰简单明了。

C. 优惠券模块设计

优惠券所用模块:多图模块,左文右图模块,双列图片模块。

【多图模块】图片尺寸:248像素×146像素,图片最多6张,最少3张。

【左文右图模块】图片尺寸:608像素×160像素,不限制个数。

【双列图片模块】图片尺寸:296像素×160像素,不限制个数。

举例1:多图模块。店铺:茵曼旗舰店,如图1-7所示。注:双11活动页。

图1-7  茵曼旗舰店

举例2:左文右图模块。店铺:三只松鼠旗舰店,如图1-8所示。

图1-8  三只松鼠旗舰店

举例3:双列图片模块。店铺:茵曼旗舰店,如图1-9所示。

图1-9  茵曼旗舰店

D. 双列图片模块设计

双列图片,也叫Minibanner。

【模块内容】多用于分类,让客户在首页中可以更快地找到更贴合的宝贝导航,这样分流作用更明显。我们在装修模块的时候,要结合分类代表图,做好店铺产品分类。分类具体的设计包含两种:1.优惠券;2.宝贝分类。

设计Minibanner的要点:

(1)需要清楚地罗列、展示店铺主推商品,文字信息等元素需要体现会场折扣商品,从而快速引导消费者购买。

(2)主要目的是让消费者快速进入承接页,达到分流的效果。

无线首页模块设置的方法一一介绍给大家了,那在做无线首页设计的时候需要注意哪些要点呢?

1.首页布局要结构清晰,设计页面清晰,实现浏览便捷,手机店铺首页是枢纽,结构模块少而精,便于客户快速读取。

2.各模块促销文字、产品卖点简洁清晰,手机受屏幕的限制,面积有限,所以呈现的内容更是有限,信息量过多,会导致消费者无法读取,带来的就是客户跳失。

3.爆款推荐,让到店流量有更大的转化,手机端的客户访问行为决定了流量的精准度,爆款的推荐会让店铺流量集中。

4.首页色彩要统一协调、主次分明、递进,手机屏幕狭小,如果色调杂乱,客户体验会差很多,我们在做设计的时候一定要根据店铺的受众群,让整体风格保持一致。

5.优惠券设计,让到店用户感受大促氛围,提升转化率,优惠券在手机端,相比于PC端更有冲击力,有利于客户转化。

6.建立分类爆款及其他分类专区,尽可能多地曝光店铺商品,在分流的同时,可以让客户看到更多商品,在提升客户体验的同时,加深访问的价值。

我们在做无线首页设计的时候,一定要明确设计思路,先构思框架、再搜集素材。

最后提醒:在进行首页产品布局分类时,建议以宝贝数量与流量大小来决定首页布局和模块功能,这样才能让首页装修更有重点,让我们的客户看到更加有逻辑、更加清晰的无线店铺首页。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,390评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,821评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,632评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,170评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,033评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,098评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,511评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,204评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,479评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,572评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,341评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,213评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,576评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,893评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,171评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,486评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,676评论 2 335

推荐阅读更多精彩内容