Axure RP 9互联网产品原型设计 课件全套 第1--12章 了解互联网产品原型设计---设计制App原型.pptx

Axure RP 9互联网产品原型设计（慕课版） 了解互联网产品原型设计 什么是原型设计 产品原型是用线条、图形描绘出的产品框架；原型设计是综合考虑产品目标、功能需求场景、用户体验等因素，对产品的各板块、界面和元素进行合理排序和布局的过程。 对互联网行业来说，原型设计就是将页面模块、各种元素进行排版和布局，获得一个页面的草图效果。为了使效果更加具体、形象和生动，还可以加入一些交互性的元素，模拟页面的交互效果。 原型设计的参与者 一个项目的设计开发通常需要多个人员的共同努力。很多人认为产品原型设计是整个项目的早期过程， 只需要产品经理参与即可。但实际上产品经理只是了解产品特性、用户和市场需求，对于页面设计和用户体验设计则通常只是停留在初级水平。而设计师独立进行创作，会使得产品经理和设计师反复商讨、反复修改。 原型设计的参与者 为了避免产品设计开发过程中反复修改的情况发生， 在开始进行原型设计时，产品经理应邀请用户界面（UI） 设计师和用户体验（UE）设计师一起参与产品原型的设计制作。这样才可以设计出既符合产品经理预期又具有良好用户体验且页面精美的产品原型。产品原型UI设计师产品经理UE设计师 如何体现原型设计 纸质 设计师可以使用笔直接在纸上描绘产品原型，设计大致的产品效果。这种方式通常是在产品经理进行原型构思的阶段使用。通过这种方式可以将原型产品的框架基本确定，然后通过专业的软件将原型更形象、更直观地转移到电子文档中，以便后续的研讨、设计、开发和备案。 如何体现原型设计 Word 和Visio 用户也可以使用Word进行原型设计。在Word文档中建立一块画布，使用文本框、图片、控件等制作一个原型设计方案，Word软件启动界面如下图所示。使用Visio设计原型比使用Word更方便。可以快速进行原型设计，Visio软件启动界面如下图所示。 如何体现原型设计 Word 和Visio 由于软件的局限性，通常只使用Word或Visio绘制原型的线框图。相比手绘原型，线框图更加清晰和整洁，适用正式场合的PPT形式的宣讲的场景。线框图还可以是功能页面结构的视觉呈现形式，能传达页面的布局结构及定义功能元素，并能将产品需求以线框结构的方式展示出来，让产品需求以更加规整的方式直观展现，一般以黑白灰的形式来表示。 原型设计软件 原型设计软件 目前原型设计软件有很多，比较常见的有Axure RP、Adobe XD 和MockupScreens 等。这些工具软件不仅具有丰富的Web 控件，而且交互性很好。Axure RP 是其中的佼佼者，下图所示为Axure RP 9 的启动图标和工作界面。 原型设计软件 原型设计软件 使用这些专业的原型设计软件除了能够完成产品原型线框图绘制以外，还能完成高保真产品原型的绘制。高保真产品原型是真实地模拟产品最终的视觉效果、交互效果和用户体验感受，在视觉、交互和用户体验上非常接近真实的产品，甚至包含产品的细节、真实的交互和UI 等。下图所示为使用Axure RP 9 完成的高保真App 产品界面。 原型设计的必要性和作用 原型设计的必要性 原型设计是帮助网站设计完成最终标准化和系统化的较好手段。它最大的好处在于，可以有效地避免重要元素被忽略，也能够阻止做出不准确、不合理的假设。 在项目开始之初，对每个元素进行调试并确保它们能够如同预期一样运作是相当重要的步骤。当设计完成可交互的高保真产品原型之后，设计师可以将它作为一个成型的界面来使用。通过测试模型中所有的功能，确认其能否解决规划阶段所计划解决的问题。 如果没有使用产品原型，而是在完成项目整体的设计和开发之后进行测试，那么修改和调整的成本就相当高昂了。 原型设计的必要性和作用