首页

app界面赏析+图标分享 ——— 北京蓝蓝设计 移动端UI设计资源分享(二十六)

前端达人

App界面设计对于设计师而言一直是盛久不衰的话题,尤其是如今越来越多的流量转移到了移动平台,使得更多的UI设计师涌入移动端领域,甚至出现了市场饱和的言论,对于从事移动端的UI设计师来讲,充满压力的同时又面临无限机遇,唯有不断的学习才能滋生出源源不断的设计灵感,站稳脚跟。

摹客想在这方面给各位设计师朋友做点什么,除了提供简单好用的设计工具,我们也整理了非常多的优秀设计案例,希望可以对设计师朋友有借鉴意义。这将会是一个系列的专题,我们以月为单位,整理了国内外设计师的优秀APP界面设计案例,我们是搬运工,更是好设计的传达者,希望你会喜欢。

接下来为大家分享精美的app UI设计案例:


WechatIMG1950.jpegWechatIMG1951.jpegWechatIMG1952.jpegWechatIMG1953.jpegWechatIMG1954.jpegWechatIMG1955.jpegWechatIMG1956.jpegWechatIMG1964.jpegWechatIMG1963.jpegWechatIMG1962.jpegWechatIMG1961.jpegWechatIMG1960.jpegWechatIMG1959.jpegWechatIMG1957.jpegWechatIMG1965.jpegWechatIMG1966.jpegWechatIMG1967.jpeg




--手机appUI设计--

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服



  更多精彩文章:

      手机appUI界面设计赏析(一)

       手机appUI界面设计赏析(二)

       手机appUI界面设计赏析(三)

       手机appUI界面设计赏析(四)

       手机appUI界面设计赏析(五)

       手机appUI界面设计赏析(六)

       手机appUI界面设计赏析(七)

       手机appUI界面设计赏析(八)

       手机appUI界面设计赏析(九)

        手机appUI界面设计赏析(十)

       手机appUI界面设计赏析(十一)

      手机appUI界面设计赏析(十二)

      手机appUI界面设计赏析(十三)

      手机appUI界面设计赏析(十四)

      手机appUI界面设计赏析(十五)

      手机appUI界面设计赏析(十六)

      手机appUI界面设计赏析(十七)

      手机appUI界面设计赏析(十八)

      手机appUI界面设计赏析(十九)

      手机appUI界面设计赏析(二十)

      手机appUI界面设计赏析(二十一)

     手机appUI界面设计赏析(二十二)

     手机appUI界面设计赏析(二十三)

     手机appUI界面设计赏析(二十四)

     手机appUI界面设计赏析(二十五)



网站推广方式有哪些

lanlanwork



2020091913504587550.jpg

网站推广方式有:1、搜索引擎推广;2、电子邮件推广; 3、资源合作推广;4、信息发布推广;5、病毒性营销,即利用用户之间的主动传播,让信息像病毒那样扩散,从而达到推广的目的;6、快捷网址推广;7、网络广告推广;8、综合网站推广。







本文操作环境:Windows7系统,Dell G3电脑。



网站推广的八种基本方式



1、搜索引擎推广



搜索引擎推广是指利用搜索引擎、分类目录等具有在线检索信息功能的网络工具进行网站推广的方法。由于搜索引擎的基本形式可以分为网络蜘蛛型搜索引擎(简称搜索引擎)和基于人工分类目录的搜索引擎(简称分类目录),因此搜索引擎推广的形式也相应地有基于搜索引擎的方法和基于分类目录的方法,前者包括搜索引擎优化、关键词广告、竞价排名、固定排名、基于内容定位的广告等多种形式,而后者则主要是在分类目录合适的类别中进行网站登录。随着搜索引擎形式的进一步发展变化,也出现了其他一些形式的搜索引擎,不过大都是以这两种形式为基础。



搜索引擎推广的方法又可以分为多种不同的形式,常见的有:登录免费分类目录、登录付费分类目录、搜索引擎优化、关键词广告、关键词竞价排名、网页内容定位广告等。



从目前的发展趋势来看,搜索引擎在网络营销中的地位依然重要,并且受到越来越多企业的认可,搜索引擎营销的方式也在不断发展演变,因此应根据环境的变化选择搜索引擎营销的合适方式。



2、电子邮件推广



以电子邮件为主要的网站推广手段,常用的方法包括电子刊物、会员通讯、专业服务商的电子邮件广告等。



基于用户许可的Email营销与滥发邮件(Spam)不同,许可营销比传统的推广方式或未经许可的Email营销具有明显的优势,比如可以减少广告对用户的滋扰、增加潜在客户定位的准确度、增强与客户的关系、提高品牌忠诚度等。根据许可Email营销所应用的用户电子邮件地址资源的所有形式,可以分为内部列表Email营销和外部列表Email营销,或简称内部列表和外部列表。内部列表也就是通常所说的邮件列表,是利用网站的注册用户资料开展Email营销的方式,常见的形式如新闻邮件、会员通讯、电子刊物等。外部列表Email营销则是利用专业服务商的用户电子邮件地址来开展Email营销,也就是电子邮件广告的形式向服务商的用户发送信息。许可Email营销是网络营销方法体系中相对独立的一种,既可以与其他网络营销方法相结合,也可以独立应用。



3、资源合作推广



通过网站交换链接、交换广告、内容合作、用户资源合作等方式,在具有类似目标网站之间实现互相推广的目的,其中最常用的资源合作方式为网站链接策略,利用合作伙伴之间网站访问量资源合作互为推广。



每个企业网站均可以拥有自己的资源,这种资源可以表现为一定的访问量、注册用户信息、有价值的内容和功能、网络广告空间等,利用网站的资源与合作伙伴开展合作,实现资源共享,共同扩大收益的目的。在这些资源合作形式中,交换链接是最简单的一种合作方式,调查表明也是新网站推广的有效方式之一。交换链接或称互惠链接,是具有一定互补优势的网站之间的简单合作形式,即分别在自己的网站上放置对方网站的LOGO或网站名称并设置对方网站的超级链接,使得用户可以从合作网站中发现自己的网站,达到互相推广的目。交换链接的作用主要表现在几个方面:获得访问量、增加用户浏览时的印象、在搜索引擎排名中增加优势、通过合作网站的推荐增加访问者的可信度等。交换链接还有比是否可以取得直接效果更深一层的意义,一般来说,每个网站都倾向于链接价值高的其他网站,因此获得其他网站的链接也就意味着获得了于合作伙伴和一个领域内同类网站的认可。



4、信息发布推广



将有关的网站推广信息发布在其他潜在用户可能访问的网站上,利用用户在这些网站获取信息的机会实现网站推广的目的,适用于这些信息发布的网站包括在线黄页、分类广告、论坛、博客网站、供求信息平台、行业网站等。信息发布是免费网站推广的常用方法之一,尤其在互联网发展早期,网上信息量相对较少时,往往通过信息发布的方式即可取得满意的效果,不过随着网上信息量爆炸式的增长,这种依靠免费信息发布的方式所能发挥的作用日益降低,同时由于更多更加有效的网站推广方法的出现,信息发布在网站推广的常用方法中的重要程度也有明显的下降,因此依靠大量发送免费信息的方式已经没有太大价值,不过一些针对性、专业性的信息仍然可以引起人们极大的关注,尤其当这些信息发布在相关性比较高。



5、病毒性营销



病毒性营销方法并非传播病毒,而是利用用户之间的主动传播,让信息像病毒那样扩散,从而达到推广的目的,病毒性营销方法实质上是在为用户提供有价值的免费服务的同时,附加上一定的推广信息,常用的工具包括免费电子书、免费软件、免费FLASH作品、免费贺卡、免费邮箱、免费即时聊天工具等可以为用户获取信息、使用网络服务、娱乐等带来方便的工具和内容。如果应用得当,这种病毒性营销手段往往可以以极低的代价取得非常显著的效果。关于病毒性营销的详细介绍及案例分子请参考本文作者的《网络营销基础与实践》第2版(http://www.wm23.com)一书相关内容,网上营销新观察《120种网站推广实用方法》系列连载文章中也会有适当介绍



6、快捷网址推广



即合理利用网络实名、通用网址以及其他类似的关键词网站快捷访问方式来实现网站推广的方法。快捷网址使用自然语言和网站URL建立其对应关系,这对于习惯于使用中文的用户来说,提供了极大的方便,用户只需输入比英文网址要更加容易记忆的快捷网址就可以访问网站,用自己的母语或者其他简单的词汇为网站“更换”一个更好记忆、更容易体现品牌形象的网址,例如选择企业名称或者商标、主要产品名称等作为中文网址,这样可以大大弥补英文网址不便于宣传的缺陷,因为在网址推广方面有一定的价值。随着企业注册快捷网址数量的增加,这些快捷网址用户数据可也相当于一个搜索引擎,这样,当用户利用某个关键词检索时,即使与某网站注册的中文网址并不一致,同样存在被用户发现的机会。



7、网络广告推广



网络广告是常用的网络营销策略之一,在网络品牌、产品促销、网站推广等方面均有明显作用。网络广告的常见形式包括:BANNER广告、关键词广告、分类广告、赞助式广告、Email广告等。BANNER广告所依托的媒体是网页、关键词广告属于搜索引擎营销的一种形式,Email广告则是许可Email营销的一种,可见网络广告本身并不能独立存在,需要与各种网络工具相结合才能实现信息传递的功能,因此也可以认为,网络广告存在于各种网络营销工具中,只是具体的表现形式不同。将网络广告用户网站推广,具有可选择网络媒体范围广、形式多样、适用性强、投放及时等优点,适合于网站发布初期及运营期的任何阶段。



8、综合网站推广



除了前面介绍的常用网站推广方法之外,还有许多专用性、临时性的网站推广方法,如有奖竞猜、在线优惠卷、有奖调查、针对在线购物网站推广的比较购物和购物搜索引擎等,有些甚至采用建立一个辅助网站进行推广。有些网站推广方法可能别出心裁,有些网站则可能采用有一定强迫性的方式来达到推广的目的,例如修改用户浏览器默认首页设置、自动加入收藏夹,甚至在用户电脑上安装病毒程序等,真正值得推广的是合理的、文明的网站推广方法,应拒绝和反对带有强制性、破坏性的网站推广手段。



文章来源:中文网

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

                                                            微信图片_20210513163802.png

 

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


新站如何提高网站权重

lanlanwork





新站提高网站权重的方法:1、增加高质量外链;2、提高原创文章的质量;3、在权重较高的网站发布外链;4、降低导出链接;5、将首页的权重引导至比较重要的页面。

2020091913504587550.jpg





新网站如果没有权重的话就会很难获得排名,那么新站到底如何提高权重呢?





我们可以从两点来看:增加权重和降低权重的流失。



1.增加新网站权重



a.增加高质量外链



在绿萝算法的打击下高质量外链是很难发的,不过一旦找到高质量的外链那么效果也是十分明显的,优质外链的质量参数中讲解到高质量外链的几个特点,可以作为参考。



b.提高原创文章的质量



一个新的网站前期最好不要去采集大量文章来填充网站内容,新的网站应该有一些有价值并且互联网上少有的内容,搜索引擎喜欢新鲜的东西,喜欢不停的抓取新鲜内容的过程,持续的增加搜索引擎喜欢的内容自然会给你提高权重。



c.社会化媒体



社会化媒体对seo的影响会越来越大,特别是微博。我们可以将网站发布到微博里与粉丝互动,或者引导大家搜索我们的品牌词,或者发布网址链接。



2.降低权重的流失



a.降低导出链接



每个网站都必不可少的有导出链接,我们虽然不能避免,但是尽可能少的降低导出外链的数量。关键时刻可以用nofollow去降低权重的传递。



b.一个网站首页的权重往往是最高的。我们可以把首页的权重适当的引导至比较重要的页面以提高内页的权重。


以上是新站提高网站权重的方法,大家可以适当的使用千万不要使用过度。

文章来源:中文网

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

                                                            微信图片_20210513163802.png

 

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



让价值被发现:如何在 B 端做增长

涛涛

增长设计是时下的热门话题,越来越多的企业开始关注增长设计,成立独立的增长部门。在蚂蚁体验技术部,我们除了做好体验设计的「老本行」外,也在往增长的方向探索。在现有的增长理论指导下,我们结合自身业务,边落地实践,边沉淀总结。以下是我们的一些小心得。


本文会讲述我们是如何利用增长大图梳理产品各个环节,以及如何用定量的用户行为数据漏斗,和定性的痛点比重数据,综合分析,去找到机会点。辅以在 Kitchen 和 语雀 中的增长实践案例说明。在增长一块,我们还处于初步探索阶段,若有不成熟的地方,欢迎大家一起讨论。





为什么要关注增长?

说到增长,过去 10 几年是中国互联网高速增长的阶段,但近 2-3 年来,随着人口、流量、资本的红利衰退,越来越多企业开始关注增长。典型的是,2017 年可口可乐宣布取消 CMO(首席营销官),由 CGO(首席增长官)替代,之后各种增长类职位相继涌出。

(来源:CNNIC 中国互联网网络发展状况统计调查,每年互联网网民用户数)





什么是增长?

增长是建立在用户基础上的,用户产生需求,需求又衍生出产品,产品之上才可能有增长。所以我们理解:产品在创造价值,而增长其实是传递价值,让价值被发现。只有让更多的用户,最大限度地体验产品的核心价值,才可能迅速扩张以及有效地变现。它有几个特点:


1.首先他是关注用户全生命周期,不仅仅是获客、变现。还需要关注怎么激活用户,让用户用起来,留存下来,传播出去

2.另外,增长不是一个单打独斗的独行侠,而是体系化的,以团队共创聚焦的方式来推动增长

3.强调数据和实验:从数据分析中洞察,提出假设,循环实验的过程

(增长过程是价值的传递过程)




什么产品适合做增长?

那什么样的产品适合做增长?我们所做的 To B 产品适不适合做增长?

首先看下 To B 和 To C 的差异:To B 产品,多数是群体决策,决策链路复杂,买的人不一定是用的人,如果是客单价较高的话,基本靠销售关系驱动购买,但像具有 C 类属性的产品,因为是个人消费场景,单一决策购买,就像平时大家在淘宝买东西一样,随心所欲。那运用增长策略去推动转化,能节约很大的获客成本,可见增长更适用于 C类属性的产品。

但经过大半年的实践,并且和其他增长团队交流,我们发现虽然 To B 增长很难,但在 SMB(中小企业)的增长很有机会。SMB 中小企业,有可能是 2-3 人组成的小团队,这类企业的客户和用户通常是同一类人,我们理解这也具有 To C 属性。并且中小企业数量多,实验数据也有保障。

一句话总结:To SMB 中小企业客群的产品可以做增长。

(面向中小企业客群的产品可以做增长)



那具体怎么做呢?结合我们自身经验,给大家分享 1 张增长大图,2 个实践案例。



增长大图

增长大图是基于 AARRR 模型,在用户旅程图的基础上进化得来。为什么不用用户旅程图,而用增长大图呢?用户旅程图主要通过情绪曲线来体现问题的严重性,但在使用上也存在难以量化的问题。

所以在增长大图上,我们选择定量的用户行为数据漏斗来取代情绪值。漏斗其实是对一个流程和路径的分析,目的是定位出问题的关键所在,这样才能对症下药。但定量数据通常只会告诉我们是什么,而定性数据能告诉我们为什么?


所以,我们还建议梳理用户调研中的定性数据,按流程、阶段、产品模块、问题类型等维度归类,通过痛点比重公式,算出每个维度痛点比重的百分比,去综合分析,找到机会点。另外,增长大图还可以记录从业务总目标拆解增长目标的过程,以及实验的策略、方案、指标结果,所以增长大图也是一份连接战略和执行,不断更新的「活文档」。


公式:痛点比重= [每个阶段的问题数 / 问题总数 ] X100%

(分析利器:增长大图)


那怎么用呢?当你确定某个项目可以做增长时,最关键是邀请不同角色的 Key Person,包括 PD、技术、运营共创去搭建增长大图。


从业务总目标出发拆解增长目标,然后将定量和定性数据梳理到大图上,找出机会点,从而确定聚焦领域,开始增长实验。想想就像大家在吃自助餐的过程,基本都是先看一遍有什么,再筛选一下,小份量的取餐尝试,最后再确定几样好吃的,重点吃。

(增长大图共创流程)


小份量的取餐尝试,就等于增长实验的过程。分为 4 个步骤:

从定量和定性数据中分析洞察——不断的提出假设——然后排定优先级,进行实验——验证应用的过程。

(增长实验流程)




接下来,分享两个我们在增长中做的小 Case。


案例一:1 块钱 6 周 Ant Design 设计工具 Kitchen 增长实践

Kitchen 是一款为设计者提升工作效率的 Sketch 工具集。先利用增长大图看下 Kitchen 的现状,我们捞取用户从访问——下载——安装——使用的数据漏斗,可以看出整体漏斗还是很不错的,整体留存率达到 40%。

然后我老板就说:「可以去做拉新增长,给你一块钱成本,去撬动一个地球吧。」其实,我当时就想给他一个白眼,现在一块钱能做什么?但反过来想想,这确实是增长很重要的一点:怎么用最小的成本去撬动最大的价值,找到最大的发力点。

基于当时的 DAU 数据现状,并初步讨论后,我们敲定 6 周 DAU 增长翻倍的目标。围绕这个目标,再进一步拆解为新增和留存,前面有提到留存率不错,所以我们这 6 周的增长聚焦在拉新上。那么拉新最重要是找到低成本的渠道运营。然后,我们脑爆了一些平时设计师会去的和我们可以切入的网站,虽然筛选了一些,但还是有很多,我们不可能全部去铺。在人有限、钱有限、时间有限的情况下,再回归我们的目标,需要找到最合适和低成本的渠道去运营。

(利用增长大图分析 Kitchen 访问到使用的流程)


所以基于 ICE 评分体系以及结合业务,我们做了局部调整,最终以渠道的「影响力」、「转化率」和「可行性」3 个维度进行打分,确定前 4 个打星标的渠道去做实验,这里主要分享下在 Ant Design 渠道上做的小实验。

(所以基于 ICE 评分体系以及结合业务,选定渠道)


在增长之前,我们已经在 Ant Design 首页投下过广告,通过数据发现转化率不足 0.2% ,后来我们分析 Ant Design 各个页面上的数据,从中发现一个有趣的现象,从招聘贴过来的用户竟然比首页过来的用户还多。

对比这两个入口,一个是首页,一个是很内页的文字链,比较偏僻的入口,位置是微不足道,但给 Kitchen 带来的用户却是首页的 10 倍。

我们又对比了他们之间的差别:首页虽然是比较大的位置,浏览量大,但用户普遍是大致浏览,看的欲望不强。而点击招聘页,通常是带着目的进来,所以这部分的用户是高欲望点击的。正所谓,欲望 - 摩擦 = 转化,为了提升转化,要么提升客户的欲望(Desire) ,要么减少摩擦(Friction), 往往消除摩擦要比提升客户欲望更简单。所以让用户有欲望进行来时,我们把摩擦尽量减少,则可以带来更大的转化。

(高欲望、低摩擦带来高转化)


所以我们就提出了一个大胆的假设:如果我们在用户点击欲望更强,关注度更高,浏览量更高的页面,并且和 Kitchen 功能相关的页面上增加引导,这个引流的效果可能会更好。因此开始了我们的实验,首先分析 Ant Design 浏览量最高的前 20 的页面,从中筛选出和 Kitchen 功能相关的页面。

(筛选出高频页面,以及相关功能)


在相关功能页面下,增加一个叫设计师专属的模块。在不同功能的页面下,加入了不同的引导文案,去吸引设计师点击。比如 Table 这个组件,我们加入的引导文案是:安装 Kitchen Sketch 插件 ,两步就可以自动生成 Ant Design 表格组件。(甚至连在文案前加 emoji 、文案后加或不加 emoji ,我们都尝试做了实验 )

Ant Design 的用户有一半是设计师,那么当设计师进入到该页面,并且也想使用 Table 这个组件时,就可以减少用户的摩擦,增加转化。

(在 Ant Design 表格组件页加入引导)


1 个月后我们发现:对比首页,在功能页上的引流效果更好,也说明这次试验是成功的。通过 Ant Design 渠道过来的访问量,总体提升 2460%。并且这个影响是长久性的。

 (渠道优化带来访问量提升)


在同一时间,获得实验成功后,我们继续在不同的渠道尝试了不同的增长实验。6 周后,DAU 整体提升 42%,虽然6周的目标没有达成 100%,但最关键是不断试验的过程。

更详细的案例实践请查看 :https://zhuanlan.zhihu.com/p/68707241

(Kitchen 增长实验总结)




案例二:语雀用户增长实践

语雀,是蚂蚁金服孵化的一款知识协同产品。在蚂蚁、阿里内部,大家都是用语雀来管理自己的办公文档与个人笔记,是十万阿里人都在使用的笔记与文档知识库。当然,语雀不仅在阿里内部使用,对外,语雀也服务外部企业和个人用户,所以没有使用过的同学欢迎大家来试试:

https://link.zhihu.com/?target=https%3A//www.yuque.com/yuque/help


作为文档管理工具,「写」是其中的关键环节。因此,语雀将「注册后写一篇文档」作为用户的激活动作,此次增长实践的目标,就是提升新用户的激活率。

(利用增长大图分析语雀注册激活流程)


同样利用增长大图先梳理新用户注册激活的流程,从数据漏斗中我们可以看到,从注册登录后,到激活的转化率是非常低的,这是我们的一个机会点。


由此我们也去做了一轮用户调研,从调研结果来看,许多用户在注册后其实不知道「语雀能拿来干啥」「能怎么样解决我的问题」。具体反映在用户的操作和困惑上是:一是引导太弱不知道怎么开始写一篇文档,二是概念抽象令人费解,三是整个激活流程冗长容易失去耐心。这里边其实有比较大的提升空间,那我们能不能通过一些实验去提升转化率呢?


首先分析原有方案的问题

(老引导方案)


这是我们老的引导方案,用户注册完成后,默认会进入到他的个人页面,语雀默认为用户创建一个空的默认知识库。


现在回顾这个页面,也难怪用户会说不知道语雀能拿来干什么了。


首先,场景引导弱。每天不同用户带着各自的场景和问题,来到语雀,有希望做办公文档协同的,有希望做读书笔记的,有希望写专栏博客的。面对这形形色色的需求,语雀只提供了一个空的「默认知识库」,余下的便留给用户自行探索,也难怪用户会感觉无从下手。


此外,像「知识库」等概念,对于小白来说,其实非常抽象,难以理解。而且在此页面中还有像「关注了」「关注者」等与创作关系不太大的干扰信息。这些东西,都会阻碍用户激活,需要优化。


针对上述问题,团队同学经过讨论,提出假设:我们是否可以通过场景化引导的方式,来提升整个激活率呢?

(场景化引导)


所谓场景化引导,就是通过语雀产品定位以及用户实际使用情况,提炼出最典型的场景模板,打包出样板间。用户带着场景与问题来到语雀,语雀带着相应的解决方案去迎接用户,如此一来,需求和方案就能很好的匹配上,「语雀能用来干什么」的问题自然迎刃而解。


与此同时,新方案将「知识库」等很难理解的概念通过场景化包装,变成「笔记本」「攻略书」等更具像化的东西,用户不再需要上来就学习这些概念,只需要在使用的过程中慢慢去体会其作用即可。

(第一批场景模板)


以上就是我们最初提炼的六大场景,我们将它放置在新用户注册后进入的第一个页面。此处以学习笔记为例子:新用户完成注册后,如果想用语雀做学习笔记,他可以点击笔记下方的「立即新建」。

(学习笔记新建流程)


此时,会进入学习笔记的创建流程,语雀会默认帮用户填写好表单内容,并在右侧紫色框框内展示一个样板,通过样板见,用户就能大概知道语雀是如何解决他所在场景下的问题。下一步,用户只需要点击新建,就能创建出一个适用于做学习笔记的知识库。

(学习笔记知识库)


瞧,一个学习笔记知识库也就新建好了,这里,用户可以选择自行「新建文档」,或者基于我们为他进行准备的模板文档,开始自己的创作。整个引导过程,始终围绕用户的目标与场景,并将结果前置供用户预览,让他更有体感。


最终,我们的增长实验取得了还不错的效果。相较于旧版,新版用户激活率提升了 52%。


既然实验效果不错,是否能百尺竿头更进一步,放大成功影响呢?这里运用了两个小方法,举一反三和乘胜追击:


· 举一反三:把成功模式运用到产品的其他地方

· 乘胜追击:针对同一个点进行更多实验,看能否进一步提升实验指标


回到刚才的例子,在验证了场景化引导的有效性后,我们也将模板用在用户日常的新建流程里,除新手引导外,用户在自己常规的新建过程中,也可以通过我们总结出来的场景模板去新建知识库或团队,做到举一反三。

(将模板复用到常规新建流程中)


这一设计有利于向存量老用户介绍语雀的用法,也方便他们去探索语雀更多的可能性,在弄明白「语雀怎么样解决我的问题」之余,还能知道「原来语雀也能干这个!」


与此同时,我们在原先六大模板的基础上,借着双 11 和双 12 的东风,提炼出了「电商团队」模板,乘胜追击。

(电商团队模板)


希望借此转化一部分商家流量,让商户也在语雀中管理自己的进销存等内容。

经过一轮举一反三以及乘胜追击,场景化增长实验取得了还不错的效果,除刚刚说的整体激活率提升 52% 以外,自语雀场景化模板上线以来,语雀新建的所有团队中,有 57% 是通过模板创建的;新建的所有知识库中,有 21% 是通过模板创建的。可以说,我们的场景化模板还是比较契合用户实际场景,被用户接受的。增长实验取得了不错的成效。

(模板使用情况)


整个过程,在产品功能上,其实并没有做多少增量,从前语雀能做的,现在也能做;从前语雀不能做的,现在也不太能做。


通过场景化的方式,让产品的价值显性化,通过让显性化后的产品价值被用户发现,促使用户增长。

(场景化,让价值被发现)


场景化,让价值被发现,这是我们在语雀增长实践中学习到的小小经验,分享给大家。



结语

最后总结一下关键点:

  1. 利用增长大图,用定量的用户行为数据漏斗和定性的痛点比重数据,去综合分析,找到机会点,然后从业务总目标出发去层层拆解增长目标,确定增长实验的聚焦领域,现阶段先做什么,后做什么?用最小的成本去撬动最大的价值。但增长大图也只是工具和手段,最关键是与 Key Person 共创聚焦、共同推进,这样才能做到事半功倍。

  2. 增长实践不是一帆风顺、一蹴而就的,最重要的是持之以恒,反复迭代实验的过程。如果实验成功则可以通过乘胜追击和举一反三的方式,继续放大成功影响。如果实验失败则要吸取教训,了解原因,继续下一个试验。


最后想说的是,增长只是一种思维方式,在设计中增长,让产品核心价值被更多人发现和使用,通过设计的方式去最终帮助业务增长,甚至还可以做到对商业有影响。

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源:站酷   作者:Ant_Design

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


利用原子设计体系构建自己的组件库设计语言

涛涛

原子设计理论并不是什么高大上的规则。


随着网页设计的持续发展,我们认识到开发设计系统(design system)的重要性,它最早就是为了让网页设计师更容易理解网页的构成,后来才延伸到UI设计当中。


简单来说,当公司的业务产品逐渐扩大时,我们需要制定一套完整的设计系统,提升设计和开发的协作效率,统一所有设计师的输出物。 开始设计系统的制定时,大部分设计师可能都会先去网上找到大厂现成的设计系统,当拿到他们的成品的时候,会把自己的产品进行拆解和借鉴,这的确能快速解决问题,但是如果不理解其中的组织规则和逻辑,只是借鉴他们现成的设计系统,只能了解个大概,知其然而不知其所以然。因此,原子设计理论的出现就是为了帮助我们去搭建设计系统,这套理论已经逐渐被国外一些大厂应用于创建统一和富有层次的设计系统。



  • 原子是所有事物的基本构成物质。每一个化学元素都具有不同的性质,并且它们一旦被分解就会失去其意义。




  • 分子是由两个或两个以上的原子通过化学键结合在一起的。这些原子的组合具有自己独特的性质,并且相较于原子来说,更具实际意义和可操作



  • 有机体是由分子有机地组合在一起的。这些相对复杂的结构可以从单细胞生物一直到像人类这样难以置信的复杂生物体。



原子设计使我们可以将我们的界面UI细分为原子元素,并通过这些元素组合在一起形成最终的界面。

原子作为整个理论最基础的元素,当我们改变其中的原子时,整个体系都会发生变化。原子的设计概念和sketch中的“符号”有异曲同工之妙,当我们改变其中一个元素时,其他所有包含这个元素的页面都会发生变化,可以保证整个系统的一致性和层次感。原子设计为界面元素提供了应用规则和组织原理,这套方法论对于设计系统建立、团队协作、产品迭代都具有非常重要的指导意义。


蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源:站酷   作者:请叫我海锅锅

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


通过动效助力业务拿结果

鹤鹤



写在前面


什么时候该使用动效,什么时候该保持应有的克制,什么样的动效是好的动效我在之前写过一遍文章,感兴趣都盆友可以了解下,标题《动效/动画在直播类应用中都运用和落地》,本篇文章应该可以算是上篇文章的下半场


接下来要说的这个案例,它可能和我们平常所见的动效体验原则是“背道而驰”的,因为它终究是一个等待运力调度的场景(简单的说就是等待司机接驾的过程)每天成百上千万订单的背后有着一套非常复杂的算法去支撑,这就造成了这个场景它本身不会像动效指导原则那样顺利,平滑,愉悦,但是既然是做设计,核心是去解决问题,所以绕不开这个场景本身。通过数据去解读用户的想法和行为,将设计与业务进行更紧密的结合,从而达到更好的效果


对用户 “等待应答“这个场景的动效改进,以拉美地区最终AB测试数据为结论,使我更加确信动效能做的不仅仅是体验上的提高,在特殊场景下完全可以解决视觉感知层面无法解决的痛点,为业务方拿结果


所有数据对外均作了隐藏处理~



项目背景


滴滴出行在拉美地区飞速发展,单量持续增高的同时,用户对产品本身的期望也越来越大,我们一如既往的重视用户体验。无论严寒酷暑,早晚高峰,我们和我们的用户都不希望等待接驾变成一件漫长、无预期、盲目的行为



数据分析


* 乘客等待时长主要分布在A时段左右,多数乘客会选择在此时间段内取消订单,而消订单的乘客并不会停止叫车服务,而是进行二次发单,重新进入等待队列,这就造成了因个人因素延长了等待应答的总时长


等待应答B分钟左右,是较容易叫车阶段,数据显示用户处于这个时间段内容易被接单


*延长乘客等待预期,调节愿等时长阈值的操作空间,乘客愿等时长的具有较大弹性,如在打车较为容易的时段为 xx 秒,在打车较难时段为 xxx 秒


结论:用户对于排队规则的并不理解,使得用户在最容易叫到车的时间段之前会选择二次发单,取消订单会导致重新排入队列,进行排序


抓手:知悉乘客取消应答集中时间段和容易打车时间段后前提后,在不通过增加物理运力/调整算法的前提下,通过设计的手法去缓解用户的等待感知,从而增加用户的等待应答时长,将用户的等待时长延伸至容易打车时段,从而促成订单的完成,是这次设计的突破口



了解问题,明确挑战


对用户的调研我们发现用户对等待应答动画存在以下感知


通过对用户数据进行分析后得出结论,筛选出核心问题进行优化,让用户对等待应答有一个新的认知,是这次的关键所在。我们希望通过这次设计的优化,乘客能强感知此刻所处运力调动的状态,并最大程度上弱化时间概念降低人脑对时间的敏感程度,减缓用户的焦虑情绪,使其相信这是一个可以等待运力到来的排期



面对的挑战有:


1.增强播单动画感知,让用户明确自己所处状态,从而减少应答前的取消率  P0助力业务

2.通过设计吸引视觉弱化时间概念,降低人脑对时间的敏感,从而增长应答前平均取消时长  P0助力业务

3.符合用户打车预期的前提下,尽可能让动画用起来连贯,顺畅,可预期,让用户感到愉悦,用户体验提高  D1体验提高

4.符合品牌调性的场景动画,让应答场景融入App保持体验上的流畅,统一和性能平衡  D1体验提高

5.涉及到地图开发/端上研发同学的密切配合,高度还原设计文件也将是一个挑战  D2设计诉求



决策方向,设计执行


明确目标之后,就开始了设计的决策方向和关键词


作为一个单量百万级的应用,面对的用户群年龄分布也是非常广泛,因此动画的效果一定要适合大众群体的认知,不应该为了吸引视觉焦点而有个性化存在-> 波纹效果


运力调度本身是一件等待的过程,长时间的等待消耗用户的耐心,应该给予更多的可预见的可期待的暗示 ->路径


俯视视角更适合对周围环境,路况,运力的的观察和掌控,适合打车前对环境的观察,而一旦进入等待场景,用户需要做的只是等待接单,将场景透视化,贴近高空观察事物的视角,更加符合真实世界-> 透视视角


老版本沿用的等待应答场景,可以在地图上进行交互操作,但是无法带来明确的有效信息。新版设计为了增强调度的感知,增强了动画效果。而动画效果在地图上需要一直靠渲染运算生成,任何的地图移动都将加大运算量,耗电发热则会大大增加,因此这里为了保证性能将一个可自由操作的场景,变成了一个固定的场景 -> 蒙层




设计执行


明确了方向和关键词之后,设计的思路其实就已经非常清晰。在框架层考虑清楚信息布局,整体页面交互流程。在表现层吸引用户视觉,加强感知,降低用户对时间敏感度即可

初稿的设计其实非常顺利,整个设计稿从需求分析到第一个DEMO落地大概用时1天左右,而且1稿过完设计内部。在设计之初,leader建议不需要考虑太多落地问题,可以适当天马行空的,不要因为技术的限制而限制自己的想法。在完成设计稿之后我们与技术评审之前就开始与端上开发同学进行逻辑层的分析,发现这个设计稿虽然满足要求,但是在细节位置需要分情况考虑,造成研发成本的大额增加,开启漫 漫 改 图 路 (细节就略过了)~


最终效果以这个动效为基础进行研发,中间涉及到了地图视角的偏移/定位点跟踪/X-panel规则/最佳view调整等复杂逻辑的调整



设计改进的细节


优化进入等待应答页的动效,优化页面布局

设计进场动效不仅仅是为了视觉上有强感知和更好的体验,核心是防止用户多次取消,多次叫单的行为发生


当长时间打不到车时,乘客会选择取消订单让系统重新派单,认为这样有可能会更快有司机接单。而真实情况则很像排队买票,前面的走不完买票流程后面的人则无法前进,所以当乘客选择取消,离开排队队列,只能重新回到对尾,重新排队


下方的等待应答信息卡片包含了等待时长和取消功能,规则是展示3s之后隐藏取消按钮,如果乘客要取消,需要上滑拉起卡片点击取消


通过调整视角和扩大蒙层动画范围,用户的视觉将会集中在屏幕的上方避免地图上的无效信息干扰,视觉持续注意力集中在3-6s左右,从而很好的为隐藏取消做了掩护


当用户的视觉从上方移动到其他位置的时候运力调度已经开始了6s+,无形中给用户时间感知的缓冲时间,使得平均等待时长延长,等待时长阈值向易接单时间段靠拢


后期通过数据分验证现乘客拉起卡片的几率相比之前刚发布时候已大幅下降,也从正面说明乘客已经适应了这种收起的策略



优化页面样式

旧版的等待应答,地图外露供乘客拖动地图观看周围情况。但是用户在等待接驾的情况下,是没有办法看到周围运力这条非常有用的信息,而地图上却外透了街道/店铺的信息,会使这个页面看起来非常沉重却没有很大的意义,且会弱化波纹扩散的感知


新版的等待应答,会在地图上方盖住一个80%透明度的的蒙层,同时会让地图视角整体抬高。让用户感觉到的是更大范围的运力调度,并且随着地图视角的抬高,街道/店铺的名称会得到隐藏,减少无意义信息的透传。通过对地图的缩放,自动减少了街道信息外透,无需通过代码层面的修改,减少了rd的工作量的同时让界面整体看起来更加清爽,拉美在发单前会有定位点的二次确认定位点,也保证用户正确感知到自己在空间上所处位置


旧版本的波纹,速度缓慢并且不够明显,很难给人一种强感知,不像是一个等待运力调度的场景

新版本的波纹,会增强波纹的速度,调整波纹的速率,让用户有一种强感知,此刻正在进行最大范围的进行运力调度的搜索


不再支持用户操作手机地图,查看周围信息。减少波纹因地图位移而产生的实时渲染,减少不必要的耗电行为发生



保证应答前后体验连贯性


在重新设计等待应答这个场景时,我不希望它是一个很重的loading的感觉


不希望像loading的原因在于loading处于数据调取状态,而数据调取一旦完成,会立刻跳转进入下个场景,会让整个体验被割裂,不流畅。而这里通过设计手法的表达我觉得可以做到体验上前后的一致,从而打通设计上的从发单->接单->送驾 这一小闭环


在得到了数据请求后,我们会将View_3D视角返回到正常2D的俯视视角,而车作为最终的载体则会自然而然的出现,同时会根据最佳视角算法自动调整到,人和车同时出现在屏幕正中(距离越远地图View缩放越大,人车始终出现在屏幕当中)


接着,真实的车载路线会以路径生长的方式呈现于用户的手机当中,会根据距离的远近来控制路径生长速度的快慢,同时司机卡片同时加载出来~


等待应答的收尾过程不会像竞品那样直接进行页面跳帧而是一种 合理的 有意义的(2D->3D->2D)完完整整的过程



推动落地,保证还原


完成了设计稿/产品/技术评审过后我们便开始与开发同学进行详细的对接

因为此次设计相对复杂,涉及到了端上和地图上的rd同学,所以非常考验研发的效果还原能力,既要把动效实现原理拆分的非常明确又要保证联调的时候前后一致性



这里就不多赘述,贴个输出图好了 (开发动效逻辑拆分图by zhoulu)

其中有用到lottie输出(感兴趣的可以翻看我之前的文章)-》《动效/动画在直播类应用中都运用和落地》


结论~Rd同学非常OK的完成了最终的效果DEMO,还原度90%+


非常感谢rd (鞠躬)



数据验证


在拉美地区上线,进行了的AB测试,核心评估指标收益显著,整体数据远超当初的预期~



总结


成长方面:这是我来国际化团队的参与的第一个项目,也是设计内部带头发起的一个项目,现在回头来看还有些地方能做到更好,可能那多一点的“更好”能让我在产出的时候更加细致,和研发对接思考的更加的完整,对业务的提升也许会更好


在说点题外的,现在的大环境讲究“全链”,赋予了设计师更多的权利,对于设计来说绝对是利大于弊,这点深有体会,更多的上游思考,更前一步对业务的理解,把业务的场景想的明白,把数据看懂,站在全局的高度看问题,站在产品的角度去设计,设计赋能,通过设计去助力业务去拿结果

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源:站酷   作者:大宝蛋

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


让价值被发现:如何在 B 端做增长

鹤鹤

增长设计是时下的热门话题,越来越多的企业开始关注增长设计,成立独立的增长部门。在蚂蚁体验技术部,我们除了做好体验设计的「老本行」外,也在往增长的方向探索。在现有的增长理论指导下,我们结合自身业务,边落地实践,边沉淀总结。以下是我们的一些小心得。


本文会讲述我们是如何利用增长大图梳理产品各个环节,以及如何用定量的用户行为数据漏斗,和定性的痛点比重数据,综合分析,去找到机会点。辅以在 Kitchen 和 语雀 中的增长实践案例说明。在增长一块,我们还处于初步探索阶段,若有不成熟的地方,欢迎大家一起讨论。





为什么要关注增长?

说到增长,过去 10 几年是中国互联网高速增长的阶段,但近 2-3 年来,随着人口、流量、资本的红利衰退,越来越多企业开始关注增长。典型的是,2017 年可口可乐宣布取消 CMO(首席营销官),由 CGO(首席增长官)替代,之后各种增长类职位相继涌出。

(来源:CNNIC 中国互联网网络发展状况统计调查,每年互联网网民用户数) 





什么是增长?

增长是建立在用户基础上的,用户产生需求,需求又衍生出产品,产品之上才可能有增长。所以我们理解:产品在创造价值,而增长其实是传递价值,让价值被发现。只有让更多的用户,最大限度地体验产品的核心价值,才可能迅速扩张以及有效地变现。它有几个特点:


1.首先他是关注用户全生命周期,不仅仅是获客、变现。还需要关注怎么激活用户,让用户用起来,留存下来,传播出去

2.另外,增长不是一个单打独斗的独行侠,而是体系化的,以团队共创聚焦的方式来推动增长

3.强调数据和实验:从数据分析中洞察,提出假设,循环实验的过程

(增长过程是价值的传递过程) 




什么产品适合做增长?

那什么样的产品适合做增长?我们所做的 To B 产品适不适合做增长?

首先看下 To B 和 To C 的差异:To B 产品,多数是群体决策,决策链路复杂,买的人不一定是用的人,如果是客单价较高的话,基本靠销售关系驱动购买,但像具有 C 类属性的产品,因为是个人消费场景,单一决策购买,就像平时大家在淘宝买东西一样,随心所欲。那运用增长策略去推动转化,能节约很大的获客成本,可见增长更适用于 C类属性的产品。

但经过大半年的实践,并且和其他增长团队交流,我们发现虽然 To B 增长很难,但在 SMB(中小企业)的增长很有机会。SMB 中小企业,有可能是 2-3 人组成的小团队,这类企业的客户和用户通常是同一类人,我们理解这也具有 To C 属性。并且中小企业数量多,实验数据也有保障。

一句话总结:To SMB 中小企业客群的产品可以做增长。

(面向中小企业客群的产品可以做增长) 



那具体怎么做呢?结合我们自身经验,给大家分享 1 张增长大图,2 个实践案例。



增长大图

增长大图是基于 AARRR 模型,在用户旅程图的基础上进化得来。为什么不用用户旅程图,而用增长大图呢?用户旅程图主要通过情绪曲线来体现问题的严重性,但在使用上也存在难以量化的问题。

所以在增长大图上,我们选择定量的用户行为数据漏斗来取代情绪值。漏斗其实是对一个流程和路径的分析,目的是定位出问题的关键所在,这样才能对症下药。但定量数据通常只会告诉我们是什么,而定性数据能告诉我们为什么?


所以,我们还建议梳理用户调研中的定性数据,按流程、阶段、产品模块、问题类型等维度归类,通过痛点比重公式,算出每个维度痛点比重的百分比,去综合分析,找到机会点。另外,增长大图还可以记录从业务总目标拆解增长目标的过程,以及实验的策略、方案、指标结果,所以增长大图也是一份连接战略和执行,不断更新的「活文档」。


公式:痛点比重= [每个阶段的问题数 / 问题总数 ] X100%

(分析利器:增长大图) 


那怎么用呢?当你确定某个项目可以做增长时,最关键是邀请不同角色的 Key Person,包括 PD、技术、运营共创去搭建增长大图。


从业务总目标出发拆解增长目标,然后将定量和定性数据梳理到大图上,找出机会点,从而确定聚焦领域,开始增长实验。想想就像大家在吃自助餐的过程,基本都是先看一遍有什么,再筛选一下,小份量的取餐尝试,最后再确定几样好吃的,重点吃。

(增长大图共创流程) 


小份量的取餐尝试,就等于增长实验的过程。分为 4 个步骤:

从定量和定性数据中分析洞察——不断的提出假设——然后排定优先级,进行实验——验证应用的过程。

(增长实验流程) 




接下来,分享两个我们在增长中做的小 Case。


案例一:1 块钱 6 周 Ant Design 设计工具 Kitchen 增长实践

Kitchen 是一款为设计者提升工作效率的 Sketch 工具集。先利用增长大图看下 Kitchen 的现状,我们捞取用户从访问——下载——安装——使用的数据漏斗,可以看出整体漏斗还是很不错的,整体留存率达到 40%。

然后我老板就说:「可以去做拉新增长,给你一块钱成本,去撬动一个地球吧。」其实,我当时就想给他一个白眼,现在一块钱能做什么?但反过来想想,这确实是增长很重要的一点:怎么用最小的成本去撬动最大的价值,找到最大的发力点。

基于当时的 DAU 数据现状,并初步讨论后,我们敲定 6 周 DAU 增长翻倍的目标。围绕这个目标,再进一步拆解为新增和留存,前面有提到留存率不错,所以我们这 6 周的增长聚焦在拉新上。那么拉新最重要是找到低成本的渠道运营。然后,我们脑爆了一些平时设计师会去的和我们可以切入的网站,虽然筛选了一些,但还是有很多,我们不可能全部去铺。在人有限、钱有限、时间有限的情况下,再回归我们的目标,需要找到最合适和低成本的渠道去运营。

(利用增长大图分析 Kitchen 访问到使用的流程) 


所以基于 ICE 评分体系以及结合业务,我们做了局部调整,最终以渠道的「影响力」、「转化率」和「可行性」3 个维度进行打分,确定前 4 个打星标的渠道去做实验,这里主要分享下在 Ant Design 渠道上做的小实验。

(所以基于 ICE 评分体系以及结合业务,选定渠道) 


在增长之前,我们已经在 Ant Design 首页投下过广告,通过数据发现转化率不足 0.2% ,后来我们分析 Ant Design 各个页面上的数据,从中发现一个有趣的现象,从招聘贴过来的用户竟然比首页过来的用户还多。

对比这两个入口,一个是首页,一个是很内页的文字链,比较偏僻的入口,位置是微不足道,但给 Kitchen 带来的用户却是首页的 10 倍。

我们又对比了他们之间的差别:首页虽然是比较大的位置,浏览量大,但用户普遍是大致浏览,看的欲望不强。而点击招聘页,通常是带着目的进来,所以这部分的用户是高欲望点击的。正所谓,欲望 - 摩擦 = 转化,为了提升转化,要么提升客户的欲望(Desire) ,要么减少摩擦(Friction), 往往消除摩擦要比提升客户欲望更简单。所以让用户有欲望进行来时,我们把摩擦尽量减少,则可以带来更大的转化。

(高欲望、低摩擦带来高转化) 


所以我们就提出了一个大胆的假设:如果我们在用户点击欲望更强,关注度更高,浏览量更高的页面,并且和 Kitchen 功能相关的页面上增加引导,这个引流的效果可能会更好。因此开始了我们的实验,首先分析 Ant Design 浏览量最高的前 20 的页面,从中筛选出和 Kitchen 功能相关的页面。

(筛选出高频页面,以及相关功能) 


在相关功能页面下,增加一个叫设计师专属的模块。在不同功能的页面下,加入了不同的引导文案,去吸引设计师点击。比如 Table 这个组件,我们加入的引导文案是:安装 Kitchen Sketch 插件 ,两步就可以自动生成 Ant Design 表格组件。(甚至连在文案前加 emoji 、文案后加或不加 emoji ,我们都尝试做了实验 )

Ant Design 的用户有一半是设计师,那么当设计师进入到该页面,并且也想使用 Table 这个组件时,就可以减少用户的摩擦,增加转化。

(在 Ant Design 表格组件页加入引导) 


1 个月后我们发现:对比首页,在功能页上的引流效果更好,也说明这次试验是成功的。通过 Ant Design 渠道过来的访问量,总体提升 2460%。并且这个影响是长久性的。

(渠道优化带来访问量提升)


在同一时间,获得实验成功后,我们继续在不同的渠道尝试了不同的增长实验。6 周后,DAU 整体提升 42%,虽然6周的目标没有达成 100%,但最关键是不断试验的过程。

(Kitchen 增长实验总结) 




案例二:语雀用户增长实践

语雀,是蚂蚁金服孵化的一款知识协同产品。在蚂蚁、阿里内部,大家都是用语雀来管理自己的办公文档与个人笔记,是十万阿里人都在使用的笔记与文档知识库。当然,语雀不仅在阿里内部使用,对外,语雀也服务外部企业和个人用户。


作为文档管理工具,「写」是其中的关键环节。因此,语雀将「注册后写一篇文档」作为用户的激活动作,此次增长实践的目标,就是提升新用户的激活率。

(利用增长大图分析语雀注册激活流程) 


同样利用增长大图先梳理新用户注册激活的流程,从数据漏斗中我们可以看到,从注册登录后,到激活的转化率是非常低的,这是我们的一个机会点。


由此我们也去做了一轮用户调研,从调研结果来看,许多用户在注册后其实不知道「语雀能拿来干啥」「能怎么样解决我的问题」。具体反映在用户的操作和困惑上是:一是引导太弱不知道怎么开始写一篇文档,二是概念抽象令人费解,三是整个激活流程冗长容易失去耐心。这里边其实有比较大的提升空间,那我们能不能通过一些实验去提升转化率呢?


首先分析原有方案的问题

(老引导方案) 


这是我们老的引导方案,用户注册完成后,默认会进入到他的个人页面,语雀默认为用户创建一个空的默认知识库。


现在回顾这个页面,也难怪用户会说不知道语雀能拿来干什么了。


首先,场景引导弱。每天不同用户带着各自的场景和问题,来到语雀,有希望做办公文档协同的,有希望做读书笔记的,有希望写专栏博客的。面对这形形色色的需求,语雀只提供了一个空的「默认知识库」,余下的便留给用户自行探索,也难怪用户会感觉无从下手。


此外,像「知识库」等概念,对于小白来说,其实非常抽象,难以理解。而且在此页面中还有像「关注了」「关注者」等与创作关系不太大的干扰信息。这些东西,都会阻碍用户激活,需要优化。


针对上述问题,团队同学经过讨论,提出假设:我们是否可以通过场景化引导的方式,来提升整个激活率呢?

(场景化引导) 


所谓场景化引导,就是通过语雀产品定位以及用户实际使用情况,提炼出最典型的场景模板,打包出样板间。用户带着场景与问题来到语雀,语雀带着相应的解决方案去迎接用户,如此一来,需求和方案就能很好的匹配上,「语雀能用来干什么」的问题自然迎刃而解。


与此同时,新方案将「知识库」等很难理解的概念通过场景化包装,变成「笔记本」「攻略书」等更具像化的东西,用户不再需要上来就学习这些概念,只需要在使用的过程中慢慢去体会其作用即可。

(第一批场景模板) 


以上就是我们最初提炼的六大场景,我们将它放置在新用户注册后进入的第一个页面。此处以学习笔记为例子:新用户完成注册后,如果想用语雀做学习笔记,他可以点击笔记下方的「立即新建」。

(学习笔记新建流程) 


此时,会进入学习笔记的创建流程,语雀会默认帮用户填写好表单内容,并在右侧紫色框框内展示一个样板,通过样板见,用户就能大概知道语雀是如何解决他所在场景下的问题。下一步,用户只需要点击新建,就能创建出一个适用于做学习笔记的知识库。

(学习笔记知识库) 


瞧,一个学习笔记知识库也就新建好了,这里,用户可以选择自行「新建文档」,或者基于我们为他进行准备的模板文档,开始自己的创作。整个引导过程,始终围绕用户的目标与场景,并将结果前置供用户预览,让他更有体感。


最终,我们的增长实验取得了还不错的效果。相较于旧版,新版用户激活率提升了 52%。


既然实验效果不错,是否能百尺竿头更进一步,放大成功影响呢?这里运用了两个小方法,举一反三和乘胜追击:


· 举一反三:把成功模式运用到产品的其他地方

· 乘胜追击:针对同一个点进行更多实验,看能否进一步提升实验指标


回到刚才的例子,在验证了场景化引导的有效性后,我们也将模板用在用户日常的新建流程里,除新手引导外,用户在自己常规的新建过程中,也可以通过我们总结出来的场景模板去新建知识库或团队,做到举一反三。

(将模板复用到常规新建流程中) 


这一设计有利于向存量老用户介绍语雀的用法,也方便他们去探索语雀更多的可能性,在弄明白「语雀怎么样解决我的问题」之余,还能知道「原来语雀也能干这个!」


与此同时,我们在原先六大模板的基础上,借着双 11 和双 12 的东风,提炼出了「电商团队」模板,乘胜追击。

(电商团队模板) 


希望借此转化一部分商家流量,让商户也在语雀中管理自己的进销存等内容。

经过一轮举一反三以及乘胜追击,场景化增长实验取得了还不错的效果,除刚刚说的整体激活率提升 52% 以外,自语雀场景化模板上线以来,语雀新建的所有团队中,有 57% 是通过模板创建的;新建的所有知识库中,有 21% 是通过模板创建的。可以说,我们的场景化模板还是比较契合用户实际场景,被用户接受的。增长实验取得了不错的成效。

(模板使用情况) 


整个过程,在产品功能上,其实并没有做多少增量,从前语雀能做的,现在也能做;从前语雀不能做的,现在也不太能做。


通过场景化的方式,让产品的价值显性化,通过让显性化后的产品价值被用户发现,促使用户增长。

(场景化,让价值被发现) 


场景化,让价值被发现,这是我们在语雀增长实践中学习到的小小经验,分享给大家。



结语

最后总结一下关键点:

  1. 利用增长大图,用定量的用户行为数据漏斗和定性的痛点比重数据,去综合分析,找到机会点,然后从业务总目标出发去层层拆解增长目标,确定增长实验的聚焦领域,现阶段先做什么,后做什么?用最小的成本去撬动最大的价值。但增长大图也只是工具和手段,最关键是与 Key Person 共创聚焦、共同推进,这样才能做到事半功倍。

  2. 增长实践不是一帆风顺、一蹴而就的,最重要的是持之以恒,反复迭代实验的过程。如果实验成功则可以通过乘胜追击和举一反三的方式,继续放大成功影响。如果实验失败则要吸取教训,了解原因,继续下一个试验。


最后想说的是,增长只是一种思维方式,在设计中增长,让产品核心价值被更多人发现和使用,通过设计的方式去最终帮助业务增长,甚至还可以做到对商业有影响。

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源:站酷   作者:Ant_Design

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


6个潮流UI设计套件合集

seo达人



还在寻找好的UI设计套件吗?别急,今天小编给大家带来了6个潮流UI设计套件合集,每一个UI设计图层都经过精心设计,是很有创意,漂亮,精美的首屏设计,兼容photoshop,sketch,figma,xd,感兴趣的朋友快来跟小编看看吧!Macz.com提供下载

1.电商服饰衣帽电器购物应用UI套件

移动应用程序UI套件Shoppir,有组织的薰衣草团体,基于向量的元素,完全可定制,基于向量的元素,包括样式指南,Shoppir Ul套件与Figma、Sketch、让每个屏幕都采用高质量的矢量制作,易于定制。

2.潮流时尚创新版式首屏设计ui套件包

潮流时尚创新版式首屏设计ui套件包是应用在时尚设计,潮流UI设计,首屏设计的套件,每个图层都经过精心设计,是很有创意,漂亮,精美的首屏设计,兼容photoshop,sketch,figma,xd。

3.31屏美食烹饪食谱应用UI设计套件

31屏美食烹饪食谱应用UI设计套件是一款可定制组件所有屏幕都经过精心设计,图层调整,简单的设计,易于搭配,您可以根据需要进行编辑,图层很容易添加、替换或编辑,是非常时尚的一款UI设计套件,兼容的软件为sketch,figma,xd。

4.电子商务app应用UI套件

电子商务app应用UI套件是应用在手机上的Ecommerce商务应用,精心设计组织良好的图层,包含40多个操作系统屏幕,可以根据自己的喜好进行编制,兼容sketch软件,需要的朋友欢迎下载。

5.潮流时尚购物网站高级创意版式模版UI套件

潮流时尚购物网站高级创意版式模版UI套件是创制购物网站,时尚创意,高级创意的UI套件,各图层都已命名,您可以根据自己的需要进行编辑,创制属于风格特色的购物网站!

6.20屏深色高质量音乐应用IOS 14 UI设计模板

20屏深色高质量音乐应用IOS 14 UI设计模板是应用在音乐应用,iOS应用设计的深色模板,使用符号来创建草图文件,您只需单击一下就可以更改所有字体或颜色,轻松设计出漂亮的界面。



文章来源:百度  作者:MAC知识分享土土

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

                                                            微信图片_20210513163802.png

 

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务





揭密可视化专家配色秘笈,你在乎的颜色远远不够

涛涛

在可视化设计中,色板的运用原则上优先保障准确性,考虑在操作指引、交互反馈上起到强化或凸显的作用。其次需兼顾色障碍群体,帮助有色盲色弱的人群也能在数据可视化中获取洞见。本文为你揭秘可视化色板的搭配种类、以及如何使用。


一、颜色映射原理

在数据可视化领域中,数据与颜色的映射是非常重要的一个环节。颜色有三个视觉通道,分别是色调(H)、饱和度(S)、明度(B),不同的视觉通道可以与不同的数据类型建议关联。

色调(H):通常使用颜色中的不同色调来描述不同的分类数据,如水果品类中苹果映射为红色、香蕉映射为黄色、梨映射为绿色,将品类与色调(H)建立了关联。

饱和度(S)/明度(B):颜色通过明暗和饱和度的共同变化来描述有序或数值型的连续数据,比如身高由低到高或由 160cm 到 180 cm 的颜色映射为由浅到深,将连续变化与颜色的明暗饱和变化建立关联。

二、6 大色板类型

AntV 色板以蚂蚁极客蓝为起始主色,根据不同数据类型、使用场景扩展出 6 种可视化色板类型,可完美兼容 Ant Design UI 资产。以下所有色板均通过无障碍测试校验,可放心使用。

1. 分类色板

分类色板用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。

用法示例

如图水果价格走势对比,使用红色代表苹果价格、蓝色代表蓝莓价格、黄色代表香蕉价格。

2. 顺序色板

顺序色板,一般使用同一或邻近色相,通过明度和饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区新增人口数对比、风险等级变化等。

单色顺序色板

单一色相渐变称之为单色顺序色板,人眼可识别的色彩数量 5~7 个,为保证信息的最佳识别度,尽可能的克制使用颜色数量。

邻近色顺序色板

为拉开颜色差异,可用两个或以上个色相,通过明度或饱和度渐变,颜色连续而丰富,可产生更多色彩分级,表达更多的连续数值,常用于热力图中的热度变化,通过邻近色相的差异将聚集部分突显出来

用法示例

2017 年西安居民人均消费支出,通过连续的颜色变化,可以快速感知出居住方面消费占比最大,其次食品烟酒,第三是交替通信

3. 发散色板

对比色渐变色板,一般是两种互补色(也可以是对比色)去展现数据从一个负向值到 0 点再到正向值的连续变化区间,显示相对立的两个值的大小关系,常用于气温的冷热、海拔高低、股票涨跌等

用法示例

全国等温线图,使用发散色板表示正负值的气温变化,暖色系的橙红色容易让人联系到太阳或炽热的感受,用于高温变化,颜色越红温度越高,反之,冷色系的蓝容易让人联想到冰和寒冷的感受,用于低温变化,颜色越深温度越低

4. 叠加色板

叠加色板,为了色尽其用的原则,将两组顺序色板通过图层叠加模式产生一组新的色板,一个颜色代表两种变量数据,常用于观察一个事物两个维度变化的相关性,如胖瘦和高矮两个维度的人数分布中,瘦且高的人群分布

用法示例

双变量映射地图,相对于单变量映射的地图,该地图形式更加新颖,十分适合用来展示两个紧密联系的变量信息。如下图所示,图中展现了美国国民人口居住密度和家庭生产总值的分布关系,纵向由浅到深的紫色映射了人口密度,横向由浅到深的蓝色映射了家庭收入水平,相交的颜色可以总体反映出人口和家庭的分布情况。可以从地图中清晰地看到,人口多且收入高的大多分布在沿海地区,人口数少且收入低的则主要分布在中部地区。

5. 强调色板

对比突出重点或特定数据,将重点关注的数据标以高饱和度的强调色,其他普通数据标以低饱和、低明度的基本色,常用于对比重点关注事物与其他分类事物的差别,如将自家产品与竞品的对比使用

用法示例

如图某工厂历年能源消耗占比趋势对比,分别用五种不同的颜色代表五种能源,其中「天然气」为重点关注的能源类型,使用饱和度高的蓝代表「天然气」,其他能源类型着以低饱和度的分类颜色,以便关注的「天然气」能够快速被观察到,同时其他类型可作为对比参考而不会因颜色过多而产生干扰。

6. 语义色板

色彩在地图可视化中的使用,不仅是数据信息传递的可视化通道,同时也是更深一层的文化故事的载体,用于表达意义或情感。重视用色习惯,遵循相关标准,色彩也不是都能寓意的,相当一部分图表色彩选择和感情因素无关,而是按照某种习惯来设定色彩,即所谓约定俗成,有的甚至形成来规范。如气象预警配色,红绿灯配色,股市的红涨绿跌等。

用法示例

某水产公司 2019 年的月盈利变化,使用红色表示盈利,绿色表示亏损。

三、8 条使用建议

我们发现,在提供官方色板的前提下,仍有用户并不是十分擅长在实际场景中应用色板,以下几条设计指引供使用时参考。

1. 避免使用过多颜色

在实际应用中,经常会出现大量颜色使用的误区,建议高亮重要的数据(不超过 7 个),其他数据默认置灰,通过图例交互进行查看。

2. 保持唯一映射通道

同样的数据,映射通道应当保持唯一性。例如当使用柱子高度来映射数据大小时,就不需要再使用颜色通道去映射数据。

3. 解释你的颜色

当图表中出现不同颜色时,需要向读者解释颜色所代表的含义。

4. 上下文保持颜色一致性

结合当前页面环境,建立视觉连续性,对于统一度量,使用同样的颜色方案,而且在整个页面(通常是仪表盘)使用时,注意保持整体颜色方案的一致性。

5. 不同数据对应不同色板

不同的数据类型建议使用对应的色板,比如分类数据就不建议使用连续色板。

6. 不用彩虹色环表达连续数据

不以色环顺序来表达连续的有序型或数值型数据,因为色环顺序并非人眼自然记忆,且彩虹色变化并非均衡变化,如下图中灰阶的转化,很容易看出彩虹色并不是一个连续逐渐加深的色板,因此彩虹色环并不适合展示连续数据,容易引起误解。

7. 顺序色板选择需均衡

下图右侧“不建议”图中,第 2 、第 3 个颜色很相近,难以区分,第 3 、第 4 个颜色跳跃很大,对于均衡的连续数据表达中,容易引起数据感知的误差,均衡选色可在 PhotoShop 的拾色器中使用 Lab 模式下固定色相不变,调节 L 值进行等距取色。

8. 为视障群体设计

AntV 色板在做无障碍验证时,得出以下几点取色建议 :

分类色板选取需明暗交替:

虽然正常人眼中右侧分类色板通过色相可以区分差异,但在视障人士、甚至全色盲,则主要靠颜色的明暗差异来识别不同的数据类型,因此分类色板需要注意适度的明暗交替

离散色板尽量选取蓝黄对比:

一般场景中,我们常也会使用黄绿配色,黄绿对比中,黄是暖色系,绿是冷色系,同样能给到对比感受,且打破常规的蓝红对比色,给到新颖的色彩感受,但如果你的用户中视障人士占比较多,则尽量避免绿黄配色,如图为两种色板在正常人眼和红绿色盲眼中的对比效果,黄绿配色在红绿色盲眼中就失去了色彩对比,难以区分。

 


蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源:人人都是产品经理   作者:AntDesign

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


结合产品设计实践和产品体验探索好用标准

涛涛

业界关于体验度量的经验

目前关于“体验度量”比较成熟的理论模型当属 Google 的 HEART 模型、ISO 9126 软件质量模型和Davis 的 TAM 技术接受模型。后人在此基础上进行了很多实践,譬如 SAP 的用户体验问卷(UEQ)、Oracle 的客户体验价值公式(CX)等。公司内部各个 BU 也在不断的尝试和探索,譬如新零售技术团队的 TES 模型,技术团队研发效能的 DEVA 模型,国际 UED 语音设计的 HII 模型,阿里云的 QoUE 模型。纵观这些模型和实践,大多是主观数据和客观数据的结合。




我们团队也曾提出过 TECH 、PTECH 模型,但由于模型的操作门槛较高、对埋点数据有不少要求,难以推广到各条业务线。痛定思痛后,我们决定重新回归业务,回归“体验度量”的初心,去繁从简,提高通用性。


企业中后台产品的特点

企业级中后台产品最大的特点是任务性质非常明确;用户使用这类产品通常是为了解决某个确定的问题点,期待用新的解决方式降本增效。




桌面研究也表明:可用性问题是软件行业的普遍问题:在英国,一般商用计算机用户只有30%-40%的有效生产率;软件缺陷中,48%是可用性问题。

正是基于上述原因,我们尝试提出了“两章一分”的标准,分别从设计验收、可用性测试、易用度分数等三个维度对产品体验进行体检和把关。



什么是“两章一分”




设计验收章

“设计验收章”主要有 3 个维度:产品还原度、任务流程跑通率、单页面加载时间。

  • 产品还原度:指技术同学的最终产出与设计稿之间的差异;

汇总人工智能线、技术风险线等 5 个产品近 1 年的可用性测试结果。除功能、性能问题外,高频体验问题主要集中在“帮助引导”、“操作反馈”、“任务流程”、“概念术语”、“功能入口”这 5 个方面。同时,结合之前项目沉淀的设计经验和设计工具,我们最终将“产品还原度”的子维度定为“信息导航”、“帮助引导”、“操作反馈”、“文案名词”;每个子维度用 2-3 句描述来进行评分。




  • 任务流程跑通率:验收确认能跑通的主干任务流程数,在所有主干任务流程数中的占比;举个例子,设计稿中枚举了 10 条主干任务流程,验收发现其中 9 条已跑通,那么任务流程跑通率就是 9/10*100%=90%。

  • 单页面加载时间:接入雨燕性能指标数据的产品看“首次有效渲染时长 fmp”这个指标;未接入的产品直接主观判断,超过 3 秒的视为不合格。


可用性测试章

“可用性测试章”也在验收阶段执行,同样有三个参评维度:最终完成率、人均求助次数和高阻碍页面。




我们没有考虑将可用性测试的常用指标——操作时长作为参评维度,主要原因是企业中后台产品类型多、使用场景复杂程度各自不同:用语雀创建企业空间只需要 5 分钟;用云凤蝶搭建一个后台页面可能需要 60 分钟,用 sofa stack 创建并发布一个应用可能需要 2-3 个小时......难以确定可以作为标准的具体操作时长。


易用度分数

“易用度分数”标准为 5.5 分。(关于“易用度分数”的更多详情,请查阅《企业级中后台产品体验度量探索(上)》)。



“两章一分”的实践

案例实践现状

截至 2020 年 9 月,已有 58 个 产品实践过“两章一分”系列方法,基本覆盖平台设计团队支撑的重点项目及 UV 超过 100 的产品。详细数据如下图:




完整体验“两章一分”的 18 个产品,仅可用性测试就帮助发现 364 个问题,平均每个产品发现 20 个问题;其中,“九州2.0 发布部署”发现问题数多达 53 个。




实操经验提炼

设计验收:共创式验收

企业中后台产品生产阶段中,由于一般没有专门的测试同学,因此设计验收都是由设计师或 PD 单独执行,没有作为必选环节,有时候甚至会因为开发周期紧张而直接略过;既没有方法论,又缺乏仪式感。

“两章一分”的实践中,我们首次践行“共创式验收”,以项目组会议的方式,邀请各个角色共同参与到验收环节中:如果产品没有什么技术门槛,那么各个角色分别独立操作核心流程;如果产品有一定的技术门槛,则由技术同学操作核心流程,同时共享屏幕,其他同学从旁观察。操作完毕后,项目组内共同讨论发现的体验问题,并将问题落地到 Aone 中进行排期管理落地。




可用性测试:引入“技术支持”+圈定最低测试人数+ 线上测试降成本

  • 引入“技术支持”

企业中后台产品通常有一定的技术门槛,以 SOFAstack的测试任务为例:

使用 sofaboot 技术栈,创建 “hello world” 应用,通过“经典版”发布部署模式发布成功。

测试过程中经常会出现一些涉及到底层技术系统的问题,非设计同学能解决,因此我们建议做企业中后台产品的可用性测试时,需要配备至少一名技术支持同学,以备不时之需。

  • 圈定最低测试人数




Jakob Nielsen 在 2000年提出测试 5 人就能发现 85%的可用性问题;结合我们的实际业务场景:有些产品真实客户非常难找;前期“共创式验收”已跑通核心主干流程;因此我们将最低测试人数限制为 3 人。


  • 线上测试降成本

我们开始实操案例时,恰逢疫情期间,于是就引入了线上远程测试的方式;后续实践下来,发现远程测试能在观察、分析阶段显著降低执行成本。


通过钉钉或阿里郎发起视频会议,邀请参加测试和观察的同学入会,请测试用户共享操作屏幕,主持人录屏捕捉用户操作轨迹,PD、技术等项目组成员从旁观察。测试结束后,使用语音转文本工具,快速将音频转成文字。这种模式最大的好处有两点:

  1. 突破了距离和观察人数的限制;从实践来看,现场测试结合远程测试的模式,至少能同时对 2-3 人进行测试,执行成本减半;

  2. 语音转文本后,显著提升了分析效率。




执行阶段的多样化

最开始提出“两章一分”的时候,我们原本希望这套标准能被作为判断产品体验是否好用,能否上线的标准之一;但实际并未推动成功。这里面有很多原因,其中一个非常实际的问题是很多产品需要调用线上数据库才能跑通核心流程,在测试阶段没法跑通;这就导致在测试阶段做可用性测试无法真实还原用户场景。

此外,设计师或 PD 新接手某款产品时,也希望能通过可用性测试的方式来快速了解产品问题。回归到“两章一分”的初心——帮助产品发现体验问题,因此,我们拓展了方法的执行阶段,不再局限于测试或验证阶段,只要场景适合,都可以用。


典型案例:LinkE 研发运维中心一期

产品简介

LinkE 研发运维中心是云通未来 Serverless 战场的重要产品;业务方希望用该产品来整合研发同学日常高频使用的研发、运维、中间件平台,大幅减少平台割裂和跳转,提供沉浸式的产品体验。

目前该产品还处于 0-1 建设的阶段。

实践过程

  • 为了确保产品体验良好,设计师在验收阶段引入“两章一分”,进行共创验收和可用性测试;

  • 共创验收阶段,邀请 PD、技术 等 8 名同学一起参与,最终结果为“通过”;

  • 可用性测试阶段,设计师根研发通用场景,招募 6 名研发同学参与两个可用性测试任务,分别为

    • 任务 1:基于代码变更完成研发自测联调;

    • 任务 2:基于发布完成分支的集成、预发、灰度、生产


结果用户在任务 2 遇到高阻碍页面,导致可用性测试结果为“不通过”,任务 2 的易用度分为仅 4.4 分,显著低于 5.5 分的参考标准;最终发现 30+ 问题点,并推动 PD 思考产品逻辑设置是否合理。




实践效果

  • 经过两次完整实践,LinkE 设计师已能完全独立操作执行“两章一分”;

  • 业务方的参与度 & 认知度提升明显:已开始习惯将“两章一分”设为项目里程碑,并全员参与进来。




实践总结

在实践过程中,我们发现企业中后台产品的典型场景大致可以分为 4 个场景;不同场景面临的设计项目有所偏重;不同设计项目在体验度量方面的切入点也有所不同。譬如:云凤蝶是一个典型的沉浸式画布页面,所有操作几乎都是通过编辑器属性面板来调整,那么如何来评估编辑器的效率呢?通过一系列实践和思考,我们提出可以通过“高频属性查找、配置的步骤数和时间”、“设置相同组件属性的耗时变化”等指标进行衡量。以下是我们根据不同典型场景、设计项目提出的体验度量切入点。





“两章一分”的未来

经过 S1 长达几个月的探索:我们制定了“两章一分”的标准;对 30+ 产品进行了易用度分数的测试,捕捉分数基线;提炼实操方法技巧,并赋能给各位设计师;联合设计师和业务方跑通近 20 个案例。不管是问题发现数量,还是设计师、业务方的主观反馈,都让我们坚定“两章一分”在企业中后台产品体验优化中是一个相对有效的模式。为此,S2 我们打算继续深化。




  • 落标准:在关键业务线将“两章一分”落地到业务生产环节中,不过“两章一分”就不能上线;

  • 分基线:区分不同产品类型和迭代大小,制定不同的易用度分数基线;

  • 升方法:针对跨产品、跨域等难以推动的横向体验项目,我们考虑升级方法,如将可用性测试升级为“用户体验日”,以便更好地推动问题落地;

  • 闭案例:针对 S1 已跑通的业务,我们会在 S2 进行案例闭环测试,以验证优化效果是否真的能在“两章一分”上体现出来;

  • 始运营:我们会挑选一些案例在公司内外发声,找相关业务领域的团队进行交流和探讨;并从案例中总结和提炼设计技巧,帮助业务成长。



总结

我们团队当前支持的企业中后台产品以 0-1 阶段产品为主,PD 通常缺少用户意识和体验优化手段,这就导致了设计稿还原度较差、产品上手门槛较高。针对这一现状,我们尝试性地提出了“两章一分”这个评价标准,从设计验收、可用性测试、易用度分数 3 个维度来评价产品当前的体验现状。


通过 S1 50+ 产品的实操,我们一边不断完善评价标准和实操经验,一边总结体验度量经验;共帮助 18 个产品发现 364 个产品,并在 link 、sofa 等重点产品线中落地到业务生产环节中,在业务方层面收到良好反馈。


在这过程中,我们总结了适合不同场景、不同设计项目的体验度量切入点,验证了这种方式在当前企业中后台产品中确实有效。后续我们将尝试细化标准,闭环案例,对内对外发声等方式,更好地推动体验思维在企业中后台产品生根发芽;同时,也期待能跟对这块感兴趣的同行朋友们多多交流。



蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源:站酷   作者:Ant_Design

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档