淘宝头条的内容化设计项目总结

主要通过三个步骤：从内容定位分析出内容的特点，再从内容的特点中提取出内容的风格，最后把这种风格运用在产品中。

步骤一：内容定位→内容特点

淘宝头条的内容是“消费生活资讯媒体”。从消费资讯、生活资讯、媒体三个角度出发，归纳出淘宝头条的内容特点：

消费资讯：新潮、导购、丰富、时尚、先锋、穿搭、商品、消费信息、新鲜、穿搭……

生活资讯：丰富、娱乐、涨知识、休闲……

资讯媒体：可信赖、权威、客观、平台、主流、个性化 ……

步骤二：内容特点→内容风格

抽取了这么多的关键词，通过这些词可以发现：淘宝头条包涵了购物类app和资讯类app的一些共同特征。

其实，每个app都可以给它一个特定的物化的物品或是场景。淘宝就像是一个大的集市，商品玲琅满目、种类繁多，需要我们在里面认真地挑选，淘到我们想要的东西;天猫像是一家商场，所有的东西都陈列在柜台里面，让人有逛街的感觉;闲鱼是一个二手市场，可以变卖自己不用的东西，也可以买自己想买的东西;知乎是一个知识经验分享平台;打开网易像是在读社会新闻报;澎湃像时政报......以此类推，如果给淘宝头条定义一种现实中的场景或是物化的物品，那应该是什么呢?

以上分析出的内容特点关键词，其实很多都不是淘宝头条特有的，我们有必要把淘宝头条独有的一些内容特质进一步抽取出来。所以，通过淘宝头条与购物类的app与资讯类的app对比，可以抽取出来一些淘宝头条独有的内容特点：

它区别于单纯购物型的产品，它呈现的消费信息，生活资讯，用户可以在看资讯的过程中买买买。它区别于其它传统资讯类的产品，它呈现的内容是时尚，新潮，先锋的。通过以上对淘宝头条内容特点的分析，就可以找到淘宝头条物化的物品或场景：我们给它定位为生活消费杂志。

在众多的杂志视觉风格中，选定了日系的购物类杂志为淘宝头条的内容风格：图文结合，信息排布清晰的感觉，符合我们对淘宝头条消费生活杂志的定位，到这里其实也就确立了淘宝头条的视觉风格。

步骤三：内容风格→产品视觉

风格确立后，我们就要在产品中营造这种感觉，将风格还原在产品视觉中。既怎样打造淘宝头条这个生活消费内容类的杂志?通过以下三点：品牌、样式、排版渗透整个风格。

1、品牌：

这个步骤是品牌的提炼过程。从产品的定位，可以提炼出来品牌的关键词;由品牌关键词可以抽练出品牌符号;最后将品牌符号运用在产品中。

淘宝头条的品牌价值是：“时尚生活消费类的资讯平台”从这个定位中我们可以提炼出：时尚，生活消费，资讯媒体这三个关键点，然后在视觉层面上从视觉、心境、物化三个维度对关键词进行拆解，可以得出一些视觉特点或者物化的视觉形象。

从拆解出来的众多的关键词中，我们选取了两个最体现淘宝头条特征以及意义的词语：引领、聚焦。“引领”的意义为引领时尚，引领最新最权威的资讯;“聚焦”的意义为专注生活消费领域的资讯。意在突出内容上的新潮、丰富、时尚;意在让用户有感知，当用户想到生活消费类的资讯，就会来看淘宝头条。

然后由品牌关键词可以抽练出品牌符号：引领——物化的形象是旗帜，两面旗帜重叠形成字母“T”。“淘宝头条”的首字母“淘宝”“头条”也是T，最终确立这个旗帜的形象作为logo。聚焦——物化的符号为相机的对角框，这个符号多处运用在产品界面中。选用了黄色搭配的色调，对比强烈，体现时尚感。以下为品牌元素在产品中的应用：

2、样式和版面

在头条的主list页中，会根据不同的内容设计出不同的承载样式，最终形成一个完整统一的内容流。现有样式9种，后续还会根据业务需求不断添加样式，一条信息流里面承载这么多的样式，要在设计上做一些统一化的处理。如左文右图的图片，与三图的图片大小保持一致，在信息流中就不回出现阶梯的视觉错落感;如话题、视频、专题虽然是三种不同的内容，但在设计中为了整个list流的统一，将三种样式的基本元素保持统一，再用一些细节或是内容专有的元素进行区分。

案例：

设计主list：为了打造上面提到的那种日系杂志的风格，在设计中突出了以下几点：

黑白对比：信息流中的任何内容都尽量保持黑白，让内容本身带来更多的颜色，使内容更突出;

标题加粗：更大更粗的标题文字，在干净的白背景上标题内容显得更加突出;

营造一种紧凑的热闹感：紧凑、整齐。在feeds的间距，字号，图片大小，相似信息等，运用格式塔方法论使其保持一致性，让整个信息流看上起完整，顺畅。读者在阅读的过程中既能区分不同的内容，但也不会有被打断的不适感;

左文右图，目的是为了突出标题。滑动时，大部分用户右手操作，滑动过程中手挡住的是图片，不会遮挡标题，不影响阅读主要文字信息;

（编辑：网站开发网_安阳站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!