1688app改版

阿里巴巴副总裁、中国内贸事业部总经理汪海在对外分享时提出 1688 已经从信息平台时代进入数字化营销平台时代,让 1688 用户在平台内完成营销和销售一体化的整个商业闭环。1688 的使命也升级成「在数字化经济时代,让天下没有难做的生意!」在全新的业务态势下,为了更好的满足用户需求,阿里巴巴(1688)主客升级势在必行。

首页重要性

首页既是业务分流的中心场景,也是平台卖家判断平台打法,买卖家感知平台价值的重要「门面」。从 UED 专业视角来看,首页是定义 APP 内体验范式及视觉风格的核心场景。

如何改?

1. 盘点现象,定义问题

满足业务新的诉求:平台阶段性战略不同,1688 从曾经的信息平台过渡到交易平台,如今向数字营销平台转型,旧的内容框架难以承载业务的新发展。

提升分流质量:从过去的数据效果来看,需重新判断,在 For 特色采购需求和服务大面采购需求之前,如何平衡调优,提升首页的流量转化效能。

体验升级:移动端 APP 天然生长在手机系统上,系统的风格更迭也牵动着 APP 的变化和升级。在 8.0 升级前,1688APP 存在着 5.0、6.0、7.0 多个由不同设计师在不同时间点所设计的场景,到8.0,APP 趋待从框架层、表现层以及品牌等方面进行统一及升级。

改版策略

1. 聚焦用户价值,基于业务打法升级内容框架

APP 升级前与业务对焦,我们收到三点诉求:

用算法的能力去承接首页买家的转化;

搜索是 B 类买家找品、选商的核心工具,需要引导更多用户更高频地使用搜索;

互联网流量红利到瓶颈期,需要进一步做好新用户的承接。

在内容框架制定上,我们聚焦用户价值,舍掉 7.0 时的内容版块个性化,聚焦做商品的个性化,仅保留For大面用户的营销、内容场景,提升算法推荐区的曝光率,以此区域的商品做首页的直接转化。

2. 弱化容器,突出内容,塑造心智

视觉容器升级

做平视觉框架,选择「大间距分隔」,为内容留出干净、简洁的视觉空间。

精简内容栅格,避免形式给用户阅读带来的负担。

提高留白率,提升页面整体的透气性,为内容留出更清爽、轻松的阅读空间。

拉大字体大小的梯度,加重字体颜色梯度,提升文字的清晰度和可读性。

强调版块特性,塑造买家心智感知,达成业务目标

强化搜索:7.0时,曾上线过将搜索做到「主观上觉得显眼」的测试方案,但相较于之前沉浸式搜索,数据几乎没变化。

8.0 阶段,从视觉表现层跳出看:「强化搜索」并不意味把搜索设计得更「显眼」,而是达成「让更多用户更高频地使用搜索」这一目标。如提升搜索底纹词、热搜词精准度和吸引力、增加搜索布点等,都可能助力达成业务目标。

基于用户单手操作时,拇指在屏幕不同区域的点击体验,选择将搜索组件移到更易于点击、视线更聚焦的屏幕位置,上线后数据提升非常明显。

Banner 升级:7.0 的 Banner 画面丰富度高,加之描述字段多,用户阅读有一定成本,较难在 3 秒内掌握全 Banner 的信息。此外,相比于 C 类用户,B 类用户会更偏理性,我们选择以更冷静、克制的「视觉语气」与 B 类商人对话,而非渲染氛围引导点击。(上线后,同样的活动内容,按新、老两版规范设计投放两套 Banner,新版较老版 UV CTR 约高出 48%)

For 新人:以差异化的利益、个性化秒杀、新人攻略做用户的承接。

营销场景心智差异化表达:营销由伙拼爆品、天天特卖两部分组成,我们判断爆品主打心智为「卖得火爆又便宜」,特卖主打心智是「限时限量抢便宜」,选择将两个区块最关键的特质做强化表达。

内容场景(直播)动态化、互动感、实时性传递:抽象出直播间的方形版面+内容叠加形式来设计,大坑位以动图传递给用户直播的动态感,以红包、个性化商品的多维实时轮播气泡传达直播的互动感、实时性。

3. 升级品牌,贯穿APP场景

为什么要做APP应用内的品牌设计?

品牌设计是将内容层(平台价值)与接收层(用户)做柔性链接的一环,譬如在 APP 场景中,由于有商品、商家、商机等「干货」,即使不特意做品牌设计,用户也能与平台保持刚性、稳定的连接。而反过来看,品牌做得很好,但平台没有「干货」,用户也不会单奔着品牌设计来平台。我们认为,做 APP 应用内的品牌设计,核心价值在于助力用户认知到平台特性,感知平台价值。从设计专业视角来看,APP 应用内的品牌设计,有利于定义并统一 APP 内体验范式及视觉风格,保障用户的体验。

怎么做?

每位设计师所处的业务环境不一样,解决问题策略和方式也千差万别,在 APP 应用内的品牌设计中,个人选择是通过厘清内容层(平台)多层次诉求及 For 用户的价值点,认知、感知接收层(用户)特质及内容倾向,基于内容层底料+接收层用户特质确定设计底层范式,塑造用户感知。

1. 图形范式

在阿里巴巴商业操作系统中,1688 聚焦做 B 类业务,直接服务对象是 B 类买卖家,业务细分出档口尖货、淘工厂、企业采购、淘货源、微商代发、工业品超级店、跨境专供等,这些都是具有一定 B 类特质及体量感的场景,故在 APP 业务门洞及常规图标的表达上,基于扁平 vs 写实、轻盈 vs 厚重、活泼 vs 稳重的维度,图形选定轻拟物、弱对比的设计范式,塑造 B 类场景 For 买家的沉稳、份量感。

此外,异常/空白场景也是平台与用户互动,塑造用户感知品牌的机会。在空态情感化插图部分的绘制上,力求塑形出有份量、易读、有意味的场景以示对应空态,并佐以轻微动效,增强空态的互动感。(在收藏夹、我的供应商等工具型场景,基于空态信息的价值考虑,将空态与工具新手引导相结合,并未做常规的插图。)

2. 色彩范式

标准色

随着业务的发展,我们基于新的业务态势,丰富了 1688 品牌色,以橙红色作营销、利益属性的表达,以商务蓝作服务、数字化属性的表达,以金色作权益属性的表达。

辅助色

在实际产品设计中,品牌色并不足以表达各类业务场景中的多层次的内容。因此,基于 VI 品牌色,裂变出不同重量、层次更丰富的品牌辅助色。

场景用色规则

基于买家角色及场景特征定义用色规则。

1688色域及选色示意

以 HSB 模式划定出偏沉稳的 1688 色域,在日常 banner 及业务场景中可灵活取用。

3. 动效范式及应用

动效是设计的重要手段,良好的动效表达能增强信息表达强度,清晰信息层级关系,提升用户体验的舒适度。做动效之前,将 APP 信息结构平整到三层,保障内容在页面简洁明畅地呈现。

在实际落地中,动效实现非常依赖技术资源,故动效设计之前,应考虑一个前提:动效设计增益内容表达,价值可论证,效果可衡量;同时,考虑接收层用户的商人特质,我们期望动效表达给用户以稳定感,并且在设计表达上能兼顾效率。

在动效呈现部分,主要以缓入、缓出、缓动结合曲线来调节,总的来说,内容入场时节奏稍慢,速度缓,分层加载,交代清信息在 Z 轴上的层次关系,内容出场时节奏快,速度快,内容层级不用再做分层消失。

APP 内典型场景的动效案例及演示:

4. 业务品牌的价值传递

此外,除以上在图形、色彩、动效等基础维度收口外,我们也需要将业务品牌放声给买卖家,以达成业务品牌的价值传递。在 1688 向数字营销平台转型的阶段,业务提出了「源头厂货通天下」的口号,我们通过设计手段,利用 APP 开机启动页及下拉刷新的空间,将「货通天下」的概念强化表达。

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

推荐阅读更多精彩内容