如何画出专业的原型图？？

zhengyang116 2021-10-12 13:53

首先需要明确一点：不管什么形式的文档，设计、开发、业务等各方的优艾设计网_PS论坛同事能看懂是关键；如果一定要定标准的话，那应该是你想表达的都表达出来的，你表达出来的大家都能看得懂；

下面具体讲一下，以Axure为例：

1、一份交互文档至少要包含下面这几部分：

流程：一款产品涉及到的主要流程需要有，尤其开发同事很关注这块，这块当然可以直接把Visio画的流程图贴上去；更新日志：原型文档肯定会不断更新完善，每次主要更新了哪些需要标注一下，这样看的人会比较方便；原型页面:接下来是产品的主要原型页面，我这边是根据有几个tab与划分，建立对应文件夹；模板：把收集的模板或者新做的模板放在一起，用的时候直接复制过来，同时很多弹框、插件类的是很多页面通用的，所以放在一起把规则写上去比较方便一些；废纸篓：这个一定要有，血泪教训，页面反复改的情况肯定会存在，把之前删掉的放在这里，后续可以找回来接着用，/(ㄒoㄒ)/~~

2、原型页面里需要包含的内容主要可以包含下面这些：因为涉及到知识产权等问题，我以比较通用的登录页面举例；

一个页面包含一个流程的各个界面，尽量不要把多个流程的界面放在同一个页面，那样很难查看；每个界面上写上标题，这样在规则说明等情况是可以快速知道是说的哪里；规则说明：标注每个界面的包含元素、操作情况、规则、跳转情况等，详细程度到图中这样应该是差不多了；流程线：界面跳转流程线链接：最好可以有调到其他页面的链接，点击直接调转；

3、其他

如果是App的话，界面尺寸大小建议375*667，iPhone /8的尺寸，容易查看；全部字体Mac系统建议统一PingFang SC，win系统微软雅黑；墨刀也是很方便的原型工具，也可以使用；

以上这块后续我会继续补充，感谢！

产品经理做原型交互时最基础的工作，也是很耗费时间的，但是不是最最重要的；多参考已有的App，移动互联网发展到现在很多设计语言都是可以借鉴的，没必要一定造新轮子；如果有交互设计师当然是交互设计师去做了；

---

linawang08 2021-10-12 13:55

无耻的给自己16年的文章打个小广告，以下是需要包含的内容。

产品原型的目的所在——给新手的原型手册  优艾设计网_设计  

----------------------------------------------------------------------------------

然而真正能体现专业的，其实是你原型内写的需求颗粒度有多小，需求写的越细致考虑的越多，越能体现你的专业。

比如后端产品，你能考虑到你这个表单页内所需要涵盖几张表？用到几个内部接口？数据类型？怎么定数据锁？表字段有什么限制？与C端交互流程如何？触发条件如何？是否分权分域与角色挂钩？

答主一般是到这个程度，再细致的因为也不是技术出生并没有去深入，只专注我需要的条件（因为业务属性而产生的技术需求）。

---