编辑导语:交互设计的简单好用,在很大程度上会受到用户的喜爱,小红书至简的交互设计,也是如此。那么,小红书的交互设计是如何做到简单的?本文将基于需求、功能和信息架构这三个方面来探讨其交互设计。

小红书ui设计分析报告(小红书的交互设计分析)(1)

说到交互设计极为简单好用的大众产品,我一般只会想到微信和 iOS——不过这是以前了。搁到现在,我还会想到小红书——这是我最近两年经常使用小红书的一个切身感受。

那么,小红书的交互设计,是如何做到简单的?

画人像的时候,一般需要先勾勒整体轮廓和主要的身体部位,然后再去填充细节。做交互设计,也是如此。交互设计的“整体轮廓和主要的身体部位”,其实就是信息架构。关于小红书“何以至简”的分析将基于“信息架构”,暂不涉及信息架构以外的细节。

为了更深入地分析信息架构,还必须去分析它的上游——功能,以及功能的上游——需求。也就是说,本文将基于需求、功能和信息架构这三个方面来分析小红书的交互设计。

小红书ui设计分析报告(小红书的交互设计分析)(2)

01「根需求」分析

关于根需求的分析,本文所用方法是:先分析需求,再分析根需求。类似“由表及里”。因为根需求是本质需求,我们可以一下子就抓到表象(任意一个),但很难一下子就抓到本质。

这就意味着,根需求是需要孜孜探索一番的,所用方法为“大胆假设,小心求证;二次验证”。简单起见,这里就省去相关的探索过程,直接说探索结果。

小红书主要满足至少四类需求:看笔记,发笔记,购物,记录日常。

“看笔记”对应的根需求为:便捷地看到自己感兴趣的且符合自己质量标准的笔记(效率、兴趣、质量)。以我个人为例,感觉这个根需求基本上能得到满足。

之所以说“基本上”,关键点在于“质量”这块,比如一些知识类内容就很难满足自己的“质量”标准,我的选择就是不去看这些知识类内容,更多地去看那些轻松一点的属于简单经验分享的内容(基本能满足自己的“质量”标准)。

“发笔记”对应的根需求为:博主的内容得到比较公平的分发(公平),博主能够成长为一个品牌(成为品牌),博主能够盈利(盈利)。

作为一个以文章为主、视频为辅的博主,我尝试过在小红书上发由文章转化而来的视频和图文——没有期待过“盈利”,对“成为品牌”的诉求也不高——整体感受是,“公平”这块还不错,因为小红书的内容分发是比较去中心化的,去中心化天然地比较“公平”。

“购物”所对应的根需求这块,我只在小红书买过一次东西,很难说出它的特色,所以这块省略。“记录日常”我没有用过,也没有研究过,所以其对应的根需求也暂且不提。

其中,看笔记和发笔记是“主要根需求”的范畴,购物和记录日常是“次要根需求”的范畴。

最后,关于根需求,有个非常关键的点,请大家注意下,那就是“需求”和“根需求”的区别——前者通常可以用一个稀松平常的词或短语来表达,比如“看笔记”,而后者往往需要在这个词或短语前加上几个有深度的(触达或接近本质)形容词或副词,比如“便捷地看到自己感兴趣的且符合自己质量标准的笔记”。

也就是说,“看笔记”只是小红书所满足的“需求”,而“便捷地看到自己感兴趣的且符合自己质量标准的笔记”才是小红书所满足的“根需求”,这一点请务必区分清楚。

02 「功能架构」分析

在产品的五大类功能(核心功能、重大功能、辅助功能、盈利功能、通用功能)中,小红书拥有核心功能、重大功能、盈利功能和通用功能这四类。

属于主要根需求范畴的是看笔记和发笔记,对应的核心功能是“首页”(看笔记)和“新增”(加号,发笔记)。

属于次要根需求范畴的是购物和记录日常,对应的重大功能是“购物”和“记录我的日常”(入口为一个图标,在首页的左上角)。

“首页”(里面的广告)、“购物”都可以盈利,所以这两个功能也是盈利功能。

“我”页面笔记以外的内容基本属于通用功能(个人资料、设置等),“我”页面笔记相关的内容依然属于核心功能。

最后看下“消息”页面。“消息”属于什么功能?通用功能、重大功能还是核心功能?

小红书的“消息”,粗略分为两类。

第一类是赞和收藏、新增关注、评论和@,以九宫格的形式(单行)展示在最上方;第二类为陌生人消息、客服消息等,以列表的形式展示在下方。以我个人的使用经验来看,消息多集中在第一类。

而第一类(赞、收藏、评论等)是“笔记”衍生出来的,它们也几乎是 UGC 产品的标配,所以可以把小红书的“消息”基本认定为核心功能(“笔记”)的子功能,大类上仍然属于核心功能。

小红书ui设计分析报告(小红书的交互设计分析)(3)

为什么这么纠结于每个功能到底是五大类功能中的哪一类?因为当用信息架构落地功能架构时,需要清楚地知道每一类功能的性质,如此才能科学严谨地将各类功能落地,最终做出简单好用的信息架构。

03 「信息架构」分析

我们将从两个维度来分析,一是信息架构本身,二是信息架构对功能架构的落地。

1. 信息架构本身

信息架构的主要价值是掌控感(于用户而言)和健康迭代(于产品而言)。实现这俩价值的要点,可以总结成三个数字——432——不要超过 4 个一级页面;不要超过 3 种内容样式;不为 2 成需求,去打扰 8 成用户。

小红书ui设计分析报告(小红书的交互设计分析)(4)

很明显,小红书对简单有很深的偏爱:共有 4 个一级页面;最重要的首页只有 1 种内容样式,“购物”页面有 3 种内容样式,“消息”页有 2 种内容样式(2 种还很相似),“我”页面有大概 2 种内容样式;可以称得上 2 成需求的有“记录我的日常”和“购物”,一个在首页的左上角(一个图标入口),一个是第二个一级页面(占大概 25% 的空间),它们都不会对 8 成用户造成太多打扰。

小红书的信息架构完全符合“432”原则,能给用户带来很好的掌控感,非常好,这是它保持简单的重要秘诀之一。

2. 信息架构对功能架构的落地

结合小红书来看,信息架构对功能架构的落地,主要指如何在现有的 4 个一级页面上安置小红书的四类功能。这其中涉及两个核心原则——和重要程度保持一致,和使用频率保持一致——前者主要影响到每类功能所占空间的大小,后者主要影响每类功能的排序。

根据上面的分析,小红书的核心功能(笔记)和重大功能(购物)同时也是盈利功能,所以去下重,这个问题就成了:如何在现有的 4 个一级页面上落地小红书的三类功能(核心功能、重大功能、通用功能)。

先来看“和重要程度保持一致”,我给到的参考建议是:核心功能占用接近 50% 的空间(两个一级页面),重大功能占用接近 40% 的空间(大概一个半一级页面),通用功能占用大概 12.5% 的空间(半个一级页面)。

来对照下小红书,它的核心功能是“首页”、“消息”里的大部分功能和“我”里面的一大半功能,加起来接近两个半一级页面。它的重大功能是“购物”和“记录我的日常”,共占一个多一点一级页面。它的通用功能是“我”页面笔记以外的大部分功能,共占大概半个一级页面。

再来看“和使用频率保持一致”,我给到的参考建议是:核心功能排在第一,通用功能排在最后,重大功能和辅助功能排在中间。小红书的信息架构完全符合这些参考建议。

总的来看,小红书里信息架构对功能架构的落地,既基本符合“和重要程度保持一致”,又完全符合“和使用频率保持一致”,这是它保持简单的另一个重要秘诀。

结语

交互设计的简单,直接得益于其根基“信息架构”的简单。信息架构的简单,很大程度上得益于其上游“功能架构”的简单有序——试想下,如果功能架构是纷乱复杂的,比如各种不同性质的功能杂糅堆积在一起(如一些音乐类 App 的首页),那么承载功能的信息架构就无法保持简单。而功能架构的简单有序,也离不开其上游“根需求”的简单有序,因为功能是由需求直接转化而来的。

小红书正是在根需求、功能架构上做到了简单有序,同时信息架构本身也很简单,信息架构对功能架构的落地也很科学严谨,所以它的交互设计才能够做到极为简单好用。

最后,用朱熹的一句古诗来和大家共勉。

问渠那得清如许,为有源头活水来。

#专栏作家#

李潇,SnowDesignStudio,人人都是产品经理专栏作家。《用户体验四维度》作者,产品设计师,专注于用户体验研究与设计。

本文原创发布于人人都是产品经理,未经许可,禁止转载

题图来自 Unsplash,基于 CC0 协议

,