主要内容
原型(Prototype) 最后更新: | 文章数: 26
产品原型简单的说就是产品设计成形之前的一个简单框架，对网站来讲，就是将页面模块、元素进行粗放式的排版和布局，深入一些，还会加入一些交互性的元素，使其更加具体、形象和生动。
-
26. UE学习笔记：原型对设计质量的影响 2010-06-26 15:11
最近迷上iTunes U，下了一堆课在听。除了Open Yale Course系列很赞之外，Stanford的HCI Seminar内容也非常丰富。最新的2010冬季学期有10节课，暂时“修”了一节，题目是：How Prototyping Practices Affect Design Results (January 15, 2010)，其中介绍的两个研究课题蛮有意思 ... ...
-
25. 使用线框图来简化你的产品设计流程 2010-05-25 23:22
绘制一个线框图是你在制作一个网站前必须要经历的过程。线框图能够帮助你合理的组织并简化你内容和元素，是网站内容布局的基本视觉表现方式，是网站开发过程中一个重要的步骤。 一、线框图的好处： 让项目组成员在初期就可以对网站有个清晰明了的认知 能激发设计师想象力，使其在创作过程中有更多发挥空间 给开发者提供一个清晰的架构，让他们知道他们需要编写的功能模块 让每个 ... ...
-
24. 我们的原型设计方法 2010-03-22 21:46
根据Standish Group的“Chaos Chronicles Report ”，大约 66% 的软件开发项目不是失败，就是超出预算、超出项目时间，或是交付缩水的功能。 项目失败或亏损的前三大原因为： 缺乏使用者的参与 需求或规格不完整 需求或规格变更 白大哥在上一回的《我们的UED设计流程及方法》中也提到，一些需求管理 ... ...
-
23. 产品交互原型设计工具分享 2010-03-15 21:51
交互设计师的一项重要工作就是进行产品原型设计(Prototype Design)。而产品原型设计最基础的工作，就是画出站点的大体wireframe(框架图)并结合批注、大量的说明以及流程图等，将自己的产品原型完整而准确的表述给产品、UI、重构/开发工程师等等，并通过沟通反复修改prototype 直至最终确认，然后进入后续的设计开发流程。 要完成以上复杂的设计和沟通工作，需要一个好的原型设 ... ...
-
22. 非原型 不设计 2010-01-20 21:18
在风起云涌的互联网浪潮中，产品迭代的速度越来越快。随着用户需求的激增，也不断带来了对设计师能力要求的提高。初入交互设计领域几年来，明显发现可视化的内容远比文档的更易于被用户（以至我们的客户）所接受，就像用户研究项目中常说的一句话：“用户怎么说的，并不代表他们怎么想。”今天以“原型设计”为基点，与大家展开几点做简要的分析。 一、什么 ... ...
-
21. 用户研究员对比原型有感 2009-12-20 21:10
一般我们会觉得，最终呈现给用户的UI是交互设计师水平的直接反映。但作为用户研究员的我，开展原型测试时接触、比较过各条产品线十多个交互设计师所做的原型，深刻体会到：原型的质量，有时更能体现交互设计师的功力——包括思维能力、组织能力以及细致程度。就比如你看一个美女穿着光鲜亮丽得体，但你得看过她家里才知道她到底是淑女还是邋遢女。 原型的质量，是指保真程度么？非 ... ...
-
20. 画好线框图的20个步骤 2009-08-31 21:45
原文作者：Clive Howard原文链接：20 Steps to Better Wireframing译者：飞琼 对于任何一个开发项目来说最大的错误可能就是没有计划。最近，有些人认为开始前无需计划，一个优秀的开发者需要的是随机应变。我敢肯定这样的做法最后注定是要失败的。 线框图是计划中的第一步也是最重要的一步。这是将创意转换成客户使用的程序的第一步。本文将要带你了解线框图整个的流 ... ...
-
19. 从线框图到最终设计 2009-07-12 02:21
原文：From wireframes to design 作者：Jesmon Allen 译者：耿人杰 ———————————— 全文的分割线 ————& ... ...
-
18. 用Flash Catalyst做交互原型 2009-06-18 21:41
稍微试用了几天，总体上有这么几个感觉： 1.原理上与其他原型工具大同小异，基本上都是“制作分状态页面—>定义事件关联—>定义交互效果”的套路。 2.从功能上看，Fc像是ImageReady、Flash和Axure 的结合，操作形式上有Balsamiq Mockups的影子,熟悉这几款软件的同学上起手来应该是很快的 ... ...
-
17. 传说中的纸上线框图 2009-05-11 20:50
画线框图/原型图，是每个产品设计人员的基本功。 可以用绘制画线框图的软件工具很多，从word、ppt这样的办公软件，到PhotoShop、illustrator、visio之类的设计软件，当然还有专用的Balsamiq、Axure等等。 那么如何选择线框图/原型图工具呢？ 目的决定方法：明确目的，按照目的选择－－不选好工具，选合适的工具 结合自己的能力：产品人员 ... ...
-
16. 线框图 - 原型可视化 2009-04-21 22:06
原文作者：Editorial.co.in原文链接：Wireframes - Prototyping Visualization译者：applia 当你需要为网站快速创建一个直观和可用的用户界面的时候，在写代码之前做好设计是基础。一个普遍的方法就是通过线框图来展现你的设计，线框图是一种使用线条为基本元素的绘画，与蓝图相对，像框图表现基本的导航和功 ... ...
-
15. 纸上原型设计方法探讨 2009-04-20 22:52
做这个东西有两个目的： 1. 把业内一些零碎和模糊的东西进行分析、整理并加以亲身实践，制定成使用说明或者标准化的设计工具。现在国内的交互从业者对一些概念和工具的理解基本上只停留在老外创造的美好词汇和自己的臆想之中，融入到工作实践时总有这样那样的不靠谱，这并不是东西本身不实用，而是师夷长技的时候并没有结合自身情况。 2. 抛块砖，引堆玉。 ... ...
-
14. 常用原型图设计工具 2009-03-14 16:45
天天和产品打交道，不时要做一些页面原型、离不开各种工具，工欲善其事必先利其器，好的工具软件可以大大提高工作效率，工具各有优劣，大家按需取之。原型设计工具我暂时把它分为两类，Web应用原型设计工具及软件应用原型设计工具、微软的visio就不说了： Web应用原型设计工具：先来看看这个几个：Axure RP、Balsamiq Mockups和Pencil Project试用感觉： ... ...
-
13. 交互设计文档4：Axure交互实例 2009-03-11 09:15
上下文链接：交互设计文档-1：经验和设计工具、交互设计文档-2：设计工具的选择 、交互设计文档-3：Axure线框图实例 上篇用SNS未登录首页的实例介绍了Axure RP Pro制作线框图(Wireframe)的基本操作方法，嗯，那只是个入门。这个工具更多的“好东西”在这篇，以及在大家自己的研究之中。下面，我就把我所用到过的“好东西&rd ... ...
-
12. 经验分享：交互设计文档(3) 2009-03-09 15:51
前一篇：经验分享：交互设计文档(2)下面，用几个实例来介绍用Axure RP Pro制作交互文档。在制作过程中，经常会有一些Tips，是一些使用软件的技巧和相关提示。这些多半都是我个人的总结，有些可能是我的“错觉”，希望在这方面能够得到指导，也希望一些有用的技巧真的能在实际操作中帮到大家。 根据Facebook的未登录首面来设计一个SNS社区首页的原型 Fa ... ...
-
11. 经验分享：交互设计文档(2) 2009-03-07 15:28
前一篇：经验分享：交互设计文档(1) 继续介绍上文中提到的原型设计工具，还有几个工具也是很有必要一一介绍一下的： Balsamiq Mockups （有Web版本）关于这个工具，黄主任在他的来，超酷的Balsamiq Mockups中有一些介绍。优：看着超舒服，提供的组件工具很多。劣：虽然提供了很多常用的工具，但反而让文字操作变得不太方便（当然，我们不是在介绍排版工具& ... ...
-
10. 经验分享：交互设计文档(1) 2009-03-03 07:00
从主流互联网公司的产品项目流程一文中提到使用几种工具制作低保真的“原型设计”。想到自己从前在还不了解“用户体验”这个概念之前就设计过许多这类“原型”，其实也算是一种不一样的交互设计经历了。在下面，姑且就把所有的原型设计称为“交互设计文档”吧，用来抛砖引玉，因为最想看到的其实是别人正在做的更专业的东西。同 ... ...
-
9. 来，我画给你看…… 2009-03-02 17:03
产品设计人员往往长期处于一种对话的状态。 首先是跟自己对话：我的想法是否正确？还有没有漏掉的地方？各个部分有什么关系？然后是跟UI设计、跟研发、跟boss、跟投资人……对话…… “我是这样设计的……”“我的意思是……” ... ...
-
8. 用Word画原型 2009-02-18 14:44
关于原型，有太多故事了。说起快速的原型制作（区别于软件工程的快速原型法），应该以文本文档/富文本文档（如Word）为主。因为，白板、草图虽然快但不易保存，HTML虽然丰富但制作慢，一些原型工具，如Axure，则效率也低，使用也复杂。 最初设计的时候，我是以Word为主的，就是打表格（顺带一句，白鸦是PPT，便于演示和简单的效果）。Word 画表格十分方便，而且在沟通中也比较高效（批注）。渐 ... ...
-
7. 选择原型设计工具 2008-11-30 17:56
在程序、网页被实现之前，一定需要把界面给“画”出来，成为原型设计，就像动画片要画分镜头、手稿一样。原型设计能起到有效沟通的作用，漂亮，直观的原型图更是让人赏心悦目。 1. Microsoft Visio 我最常用的原型设计工具，几乎是Windows平台下惟一的“最佳”选择。有很多的模板可以选择，可以制作包括流程图、平面布置图 ... ...
