坏人，

本文环境：

    关注有啊，拍拍的改进，新的淘宝商品展示页上线后，包括之前就想找时间聊聊有啊的商品展示页的信息布局和信息架构。

    关于信息架构的文章，之前千鸟同学也有一些不错的文章。还推荐了IBM的“信息架构的本质”的文章。

    在记录这些脑子中的想法的时候，针对电子商务属性的商品展示，针对系统（网络公司），卖家（信息发布者），买家（信息受众着，交互产生者）这些复杂关系复杂目的的信息，有什么好的信息结构？有什么好的信息架构方式？什么好的维度？特意去翻《小熊》，小熊上也没有清晰的解释案例，只有零星的讲了一个整体概念的页。

以下为思考这些问题的时候，一些碎片，希望对大家一起学习信息架构有帮助。

【举例说明信息架构，产品模块，交互设计，界面设计之间的关系】

骨架，肌肉，筋腱，皮肤，相连，交错最后成为一个整体。

骨架：业务逻辑，用户使用流程，用户关注的关键点，

肌肉：功能模块

筋腱：交互关系

皮肤：页面设计和美化

【商品展示页面的信息架构维度】

1，购买辅助信息

（商品本身信息）（用户关注的）

2，卖家push信息

3，网站系统的信息

         我们单看这些页面，taobao，youa，paipai的三个单独的商品页面，主要的信息分为以上三个方面，这些是组成页面元素的骨骼，是信息架构信息分层的最基础层。换句简单的话来说，我们页面上的所有文字，图片，按钮，链接，要表达的东西都属于这3大块。

 【购买辅助信息维度分解】

A,商品本身的 （价格，所在地，图片等）

B,交易互动的 （库存，已销售，已购买人数，等）

C,网站属性 （消保，先行赔付，假一赔三等）

D，平台本身目的性信息（支付宝，购买流程，支持银行等）

        我们再来看这些信息，从页面形式上来看，他们已经被划分在不同的位置和区域，对比3个网站，已经有了很大的变化，和权重的突出。同时我们也可以看到，在这个细分的维度的页面组织和结构上，3家公司的理解也是不一样的，有基础性的taobao，有推动安全支付的paipai，有技术优势凸显，商业气息弱的youa。请注意，上面罗列这些只是信息，具体的应用就是考验最后的架构能力的时候了。

【商品展示信息架构信息划分流程】

1，结构拆分

2，多方维度拆分

3，流程拆分

4，用户需求习惯拆分

罗列这些多维度的信息元数据，然后做不同的调整和组合，不同的横的维度有不同的划分的标准。

譬如：

结构的拆分，划分到页面的几个使用方，页面的主要功能目的。

多方维度的划分：从买家方面希望看到的元素有哪些？从卖家方面希望看到的元素有哪些？系统平台希望推出突出什么功能？

流程的拆分：页面使用者的流程是怎么样？先浏览什么，再浏览什么，然后看什么，然后再做什么？什么情况下离开？什么情况下下单？

4，用户需求拆分，用户有什么需求，看图的时候有什么需求，在购买的过程中关注哪些信息？这些信息对应的是什么数据？在什么位置展示？和什么数据一起组合展示？

【商品展示页信息架构常见问题】

1，信息架构不是相关信息的“积累”和“累积”。

（不是说把所有的同类信息放在一起，在同一个位置，积累起来，累积起来就是做了信息的架构聚合）

2，信息架构不是做排比，站队伍。

（很常见的站成一排的icon，按钮等）

3，信息架构是符合业务流程，支持和服务核心目的的。

（不要只是设计）

4，信息架构要符合用户心理，平行流畅的。

（web线上的行为是线下行为的映射，去了解你的用户线下的心理吧）

5，信息架构布局要和UI，UE，icon紧密结合在一起，视觉上和谐统一的。

（tab等结构信息的设置，一样是信息架构，譬如看看taobao中间的那一层按钮，点击率基本上是很低）

6，有些信息是需要被重新设计和架构的。

（从网站角度来说，有些信息的架构和布局是要满足网站一些目的的，所以最后调整这个架构）

【最后】

        信息架构不仅仅是导航，不仅仅是搜索，信息架构也不仅仅是框架的设计者要做的，包括web设计师，交互设计师，乃至视觉设计师，都是要去了解这个思路的。从千鸟的信息架构的留言上，有个哥们的留言很有深度，做为本文的结束语吧。

        “谷歌的产品线就是一个大的信息架构。”