交互设计中的信息架构策略与方案【高阶产品交互篇】.docxVIP

交互设计中的信息架构策略与方案 摘要：在产品交互视觉中，信息架构作为最底层的支撑逻辑，是许多B端设计师都要掌握的。当我们对信息架构有足够的认知时，在设计页面时才能有合理的思考方向，做出正确的设计。骨架搭得好，用户体验才能够有本质的提升。本文分享了相关信息架构知识，希望对有需要的你有所帮助。 信息架构这篇是本人在现阶段觉得较难学习与阐述的知识点，网上关于信息架构的知识内容也是参差不齐。在学习与探究的过程中查阅了很多资料，反复修改多次，尽量用直白的语言结合实例来阐述信息架构。目录如下： 大家可以根据上述目录来进行选择性阅读，当然全文阅读也是极好的～ 一、信息架构基本认知 1. 前言 这篇文章的起源，来源于最近看到的话题“B端设计师会被组件库取代吗？”。从表面上看，在组件库越来越完善的时代，很多页面设计依靠组件库就能够快速搭建。 那么在这种情况下，B端设计师存在的意义和价值到底体现在哪里呢？其实B端设计的重点并不在页面的视觉上，视觉只是作为设计师最终输出成果的一小部分。个人认为B端设计师工作重心体现在做「正确的设计」，比如以下几个方面： 这个设计能否完成对应的商业目标和产品目标； 我们的信息呈现是否合理以及能否解决当前需求； 用户能否在页面上快速找到想要的信息。 而想要弄清楚并解决上述这些问题，在众多的话题阐述之下，我发现其论述本质上都逃离不了「信息架构」这个概念。因此我认为设计师都需要对这个概念有充分的认知，这能够帮助我们做出正确且出色的设计。 2. 信息架构概念 关于信息架构的概念，在百科上面的定义大部分都比较晦涩难懂，比如维基百科和百度百科的解释： 相信大部分人都很难明白其中描述的意思。在这里换种思路，将信息架构拆分为信息与架构去理解。 信息指的是内容的载体，常见的文字、图像等都是信息；架构的含义则形容对应的组织和结构。那么信息架构就是将信息通过一定的形式组织起来，然后呈现出来。其本质就是研究信息的表达与传递。 通俗点讲，信息架构就是让用户可以更容易的理解我们的产品，让用户在使用我们的产品时可以更顺利、更自然。因此信息架构没有一个具体的呈现形式，它更多的是体现在产品设计的各方面。具体主要表现为组织系统、标签系统、导航系统和搜索系统。 二、为什么需要信息架构 为什么需要信息架构？我们都知道B端产品设计的核心是「降本提效」，在设计这一侧的可以将其理解为降低认知成本，提升使用效率。 降低认知成本需要我们更好的表达信息，让用户能看明白我们的产品能够做什么，如何用；提升使用效率需要提升信息的传递效率，让用户能够很容易的找到需要的功能； 而信息架构从本质上来讲也正是研究信息的表达和传递。因此我们需要通过它来帮助我们更好的完成B端产品设计。如果没有信息架构来作底层支撑，那么我们在页面上看到的可能就只有功能的堆叠，让产品陷入难以上手或者不知道怎么用的尴尬境地。 一个强大信息架构是产品质量的保证，是作为设计支撑点的骨架，它会减少可用性问题，提升整体导航性，创造对用户友好的体验。比如举一个工具层面的例子： PS的工具栏堆叠在界面各个部分，而Figma的工具栏则集中在右侧且只出现当前需要的功能。很明显Figma在信息架构中的信息组织部分做得更为友好，PS则会显得逊色一些。这也是我们在学习PS的时候会显得比较吃力的原因之一。 可以说良好的信息架构是高效用户体验的基础。视觉元素，功能，交互和导航都是在信息架构的基础上构建的。因此想要做出体验好且合理的页面设计，我们就需要参与到信息架构这个过程中来，和产品一起完成对应架构的梳理。而不是只完成从原型到页面这个部分。 三、怎样设计合理的信息架构 如果想要搭建一个好的建筑，我们需要知道其建造的目的，是按照什么样的结构搭建，内部有哪些系统，以及最后呈现的模样。 那么信息架构也同理，我们首先需要知道信息是为了什么目标服务，然后我们通过怎样的结构来组织这些信息，以及过程中会用到的信息元素，最后如何呈现它们。这都是我们在搭建信息架构中需要进行的必要步骤。 如果某些环节没有做好或者没有了解透彻，那么在输出信息架构时往往会出现方向或者策略上的问题。接下来我们看看这些步骤是如何具体呈现的。 1. 信息获取：先理解业务，再谈架构 B端行业对于业务理解的要求是比较高的，只有在理解业务的基础上，将业务需求转化为对应的设计目标，我们才能够输出合理的信息架构方案。 个人认为理解业务的基础，就是能够用一句话讲清楚当前设计的产品。这句话可以描述为：谁在什么地方想要完成什么目标。比如「用户想要不出门就能够吃到东西」，这就是外卖软件提供的产品服务。 虽然看上去这句话很简单，但其中包括了三个要素：用户、场景和目标。因此我们在分析和梳理业务的过程中首先要弄清楚的就是这三个要素。 （1）用户：分清购买者与使用者 用户永远是排在第一位的，也是我们首先