【】效率工具—原型及交互设计工具（1） - 简书
下载简书移动应用
写了47482字，被214人关注，获得了407个喜欢
【】效率工具—原型及交互设计工具（1）
交互设计工具
世界上最实在最方便的原型设计及交互工具：
手，动作，神态及语言
国外的谷歌，facebook等大型互联网公司的交互工具就是上面最原始，最有效最直接的原型及交互设计工具，通过笔直接画出自己心中想的，通过自己对事物的理解想出交互动作，最后再通过交流表达出自己的所想这样就在短时间里达到非常快捷，非常可观的效率，这样的会议即使做一次都是非常受益的。但是在国内大多都是自己想自己做，做完之后再交流再改正，单纯的积累学习，而不是在于分享交流，通过软件来方便完成工作流程而已。真心希望回归原始，返璞归真的方式来做产品设计及产品研究.这次谈的主要集中在电脑计算上的设计，如果想谈手工设计APP，WEB原型交互的下一次有时间我会收集一些资料来做较为详细的介绍.客户端的前提平台选在os x和Windows，还有web端首先说一下原型设计1.（有破解，有汉化）全平台（全平台是指：OS X和Windows端）
特点：全平台原型和交互相结合
在对交互动画要求不是非常强烈的情况下，下载Axure足够满足你的需求.2.（有汉化，有破解）
主要特点在于线框图
这个工具最大的特点还原手绘，通过线框图方式来画原型图3.（有汉化，有破解）
特点在于多了一个APP移动端
可以通过APP移动端来绘制原型图.在Windows的平台下主流的原型设计工具是Axure在OS X平台另一个是omni系列的大巨头4.（有汉化，有破解）
特点在于原型设计功能多，非常专业
os x端的工具中是非常专注于原型设计高保真的设计主要工具还是原来的一些老油条：1.adobe的PS，AI（有汉化，有破解）全平台制霸详细就不说了，多多少少大家都认识了。2.sketch（有汉化，有破解）mac独占这个工具在APP设计上有很专业的集中工具，是一个轻量级设计工具
特点在于轻量级，简洁
特点在于非常简洁，使用的工具再说下交互设计本来从专业性上来说是不好分开的，但是工具过于专业，所以我不得不分开说明交互设计工具中主流的全平台工具：1.adobe AE（有破解，有汉化）是最随意的工具，会用的都知道2.（有汉化，购买价格你定）我见过最良心的交互设计全平台软件软件价格随你定，官方软件教程价格随你定，软件的负责人随便邮件骚扰，他们一定给你一个满意的答案.所以以上来看不用它，还真不还意思...
有了汉化就用起来舒服多了...下面说下mac独家的1.（免费使用，需要苹果开发者身份）这个软件后台有点硬...是facebook的御用原型设计工具，xcode也把这个家伙整合了进去，想当初找这个软件，把百度翻了几遍都不知道怎么安装....特别提醒：Origami是手机移动端的软件，配合QC使用，不要误解了
特点在于大公司都在用，你也追一追，可视化编辑非常方便
有编程背景或者基础的交互设计人员这下就爽了，发挥出自己的优势起来了.2.（有汉化，有破解）无需动代码直接变代码，直接简单的操作可以做到可视化.
特点在于做H5一些特定的效果收放自如
简单明了，收放自如，熟练以后就感觉很畅快...3.最争议的几个软件放在一起说Flinto，principle，Floid这三个软件，你一旦用过你会觉得在功能上实际上都差不多，动画效果很到位.
Floid特定旁边有一个可视化窗口方便方便调整
principle可插入素材
设计方式三者大致相同
Flinto也是同principle使用方式大致相同
以上工具都有破解，但是只有Flinto有官方汉化，民间没有汉化小组汉化.最后一个可能成为未来强者的adobe公司的comet笔者收到邀请所以现在在内测阶段使用
其实感觉上来用有点像PS的设计空间，但是其功能和Flinto这类工具相似
慢慢看着成长..今天大概就说到这里，你有没有发现我们说的这些工具都是注重哪个？主要是APP移动端，WEB端下次再说
如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮
被以下专题收入，发现更多相似内容：
玩转简书的第一步，从这个专题开始。
想上首页热门榜么？好内容想被更多人看到么？来投稿吧！如果被拒也不要灰心哦～入选文章会进一个队...
· 131089人关注
工具癖：追求技能提升，改变生活，完美体验的极客。
投稿须知：请勿在文章里添加带有推广性质的图文或者链接，包括但不限于微信/微博/...
· 109177人关注
小而美，复杂问题简单拆分。最新iOS相关Tips，欢迎自荐.
· 147人关注
如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
选择支付方式：[交互设计工具] Principle for Mac - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
已注册用户请 &
探索世界的好奇心万岁
Sponsored by
国内领先的实时后端云野狗 API 可用于开发即时聊天、网络游戏、实时定位等实时场景传输快！响应快！入门快！
Promoted by
[交互设计工具] Principle for Mac
18:08:28 +08:00 · 2090 次点击
最棒的交互原型设计工具， Ever.
官方网站：
配合 Sketch 使用真是棒棒的！@1ychee 快点去谈授权
介绍视频：
15 回复 &| &直到
15:09:15 +08:00
& & 18:32:32 +08:00
遇到多页面的就乱套了。。。。而且不能画圆形，只有矩形，可以加圆角。。。
& & 18:37:13 +08:00
@ 可以画圆形...圆角足够大就是
& & 19:38:51 +08:00
嗯？感谢推荐！
之前也有人在微博上推荐过~~这玩意真的很好用吗？
& & 20:31:30 +08:00
@ 如果我想做一个圆形放大的动画呢？能疯
& & 20:52:50 +08:00
确实不错！先试用一下
& & 22:19:57 +08:00 via iPhone
@ 有四个视频教程，你看看，我觉得很简单
& & 22:20:43 +08:00 via iPhone
@ 不明白你的问题是什么？圆形放大，我用了 10 秒做好
& & 22:37:01 +08:00
& & 23:11:27 +08:00
前几天看湾区日报转的文章推荐这个. 自己没有搜索到, 多谢发出来!
& & 08:43:57 +08:00
感觉很赞。。。
& &350 天前
@ 对比了 Framer 和 Principle 最终还是决定买 Principle 。结果没发现有人组团买 T- T
& &350 天前
@ 是啊。慢慢来。我们会谈的。。
然而我也说不准时间（毕竟代理啥啥啥的也要开发商同意才行），所以。。别等我们，你先买吧 ;-(
& &245 天前
后来有谈拢吗？
& &245 天前
@ 没有。开发商和我说：特么怎么每天都有人不断发邮件要做我们的代理商。让我静静，不要再打扰我。谢谢
＃这是一个悲剧＃
& &245 天前
@ 已买...不过最近作者疲于更新... 还木有正式 1.0
& · & 1818 人在线 & 最高记录 2067 & · &
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.7.5 · 51ms · UTC 03:25 · PVG 11:25 · LAX 20:25 · JFK 23:25? Do have faith in what you're doing.这是官网：中文文档：
回答建议修改：传播、获取盗版资源
作者修改内容通过后，回答会重新显示恢复正常。
长久以来，我一直在花时间寻找一款真正适合我的交互设计软件，为此我先后学了Origami和Pixate，也花了一点点时间研究了下Framer，但2天后我果断放弃了它。Origami（去年写的教程：&a href=&/question//answer/& class=&internal&&Quartz Composer 如何入门？ &/a&）和Pixate我当初也是花了大力气和决心学习 ，虽然现在在绝大多数项目中完全能够轻松驾驭，但过程总是磕磕碰碰，并不那么愉悦的说。所以，寻找更优更高效的生产工具我从未停息过。&br&&br&一周前无意中关注到Principle，只是稍许的时间我就被它吸引到了，这是迄今为止唯一一款我能不在教程帮助下直接上手的UX软件。 它很巧妙的结合了Sketch-界面和功能布局、Keynote-神奇移动效果、Flash-创建补间动画，甚至Origami-事件的管道拖拽等软件的优点，相信你能够跟我一样很快的掌握这款交互设计的神器。&br&&br&至于学习的轨迹，跟Origami几乎相似：&br&&ol&&li&看完官网的 &a href=&///?target=http%3A///tutorial.html& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&五个基础视频教程&i class=&icon-external&&&/i&&/a&；自己动手做完成五个视频内容&/li&&li&认真阅读&a href=&///?target=http%3A///docs.html& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&官方文档&i class=&icon-external&&&/i&&/a&，很简单，10分钟可以看完，英文吃力的同学可以看我整理的&a href=&///?target=http%3A///principle-chinese-document& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Principle中文文档&i class=&icon-external&&&/i&&/a&。整个教程只有「连续的交互/Continuous Interactions」和「联动/Drivers」稍微需要花点时间消化，其他都特别容易掌握。&/li&&li&加入 &a href=&///?target=https%3A///groups/625/& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Facebook的Principle小组&i class=&icon-external&&&/i&&/a&，活跃比较高，可以很快找到解答；或者加入我们学习互助扣扣群&/li&&li&看完SketchTV 在Youtube上录制的 &a href=&///?target=https%3A///playlist%3Flist%3DPLgwNtYvZGv9STGDSx_knjYyzS7XzmpK84& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&高保真的视频教程&i class=&icon-external&&&/i&&/a&，有几个复杂的项目跟着做，可以帮助理解一些复杂的动画实现原理 好像半个月更新一次&/li&&li&下载网上所有你能找到的Principle源文件，&a href=&///?target=http%3A///& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&在这里，我已经为大家收集好了&i class=&icon-external&&&/i&&/a&，千万不要直接下载源文件看，会很累，建议你看完效果直接自己上，遇到问题在从源文件中寻找答案即可。&/li&&/ol&
长久以来，我一直在花时间寻找一款真正适合我的交互设计软件，为此我先后学了Origami和Pixate，也花了一点点时间研究了下Framer，但2天后我果断放弃了它。Origami（去年写的教程：）和Pixate我当初也是花了大力气和决心学习 ，…
&a href=&///?target=http%3A//ux-/post/1ead49_7fa3f8b& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Principle : 你必须试一试的原型设计工具-Shunz@UX&i class=&icon-external&&&/i&&/a&&br&From: &a href=&///?target=https%3A//blog.growth.supply/principle-the-prototyping-tool-you-got-to-try-93ab743fe4ae& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&&Principle : the prototyping tool you've got to try&&i class=&icon-external&&&/i&&/a&&br&&br&翻译上文时用Principle做了两个动效gif，但在知乎编辑框中不知为啥画质渣成狗，帧率也有问题（好吧，发出来一看，根本变成静态jpg了，WTF！）。&img src=&/eea88e8cddd4444aaee1a2_b.jpg& data-rawwidth=&261& data-rawheight=&465& class=&content_image& width=&261&&&img src=&/d8bba3fcf018ce5cc87eb42_b.jpg& data-rawwidth=&261& data-rawheight=&465& class=&content_image& width=&261&&
翻译上文时用Principle做了两个动效gif，但在知乎编辑框中不知为啥画质渣成狗，帧率也有问题（好吧，发出来一看，根本变成静态jpg了，WTF！…
已有帐号？
无法登录？
社交帐号登录
请问，如何提升产品经理的大菊观？这是官网：中文文档：
Principle可能是目前制作可交互Demo最容易上手、综合体验最棒的软件了。几个月前偶然发现，当时principle mirror还没有出，还在犹豫是不是又是一个无法直接在手机上build的产物，结果第二天mirror就上架了！欣喜若狂～（没记错是个月底31日）而且比起sketchmirror，Principle mirror还是免费的！简直不能再感动～可以手机数据线连接预览（无需网络，支持即时显示），也可以云端直接打开文件。Mac上支持录制操作，导出文件可选.mov 或 .gif（GIF，此处有掌声）Principle和Sketch一样，改版后全部使用点作为单位（6Plus＝414*736）但是图片在导入导出的时候还有些问题，为了确保在Principle最终效果是清晰的，Sketch中画板导出需要*2，贴入P中时再缩小。（如果有人知道怎么解决这个问题请告诉我，跪谢）Principle最大的优点就是上手非常快，界面和Sketch如出一辙，如果设计稿是Sketch做的，那么从画第一个控件到页面元素动起来整个过程都会是行云流水般～目前排名第一个的答案中链接全部学习过。（感谢）最实用的绝对是官方文档：核心只需要掌握4个重点概念：事件Events、动画Animation、连续的交互Continued Interactions和联动Drivers动画 在两个Artboard（画布）中，两个控件元素名称一样就会被认为是同一个；换句话说，两个不同的元素命名一样的话，其实做的是两个元素之间的补间动画。（作为一个曾经没完没了给movieclip命名的人表示很惊喜）有一种情况，A、B画布中，X元素（假设是个侧边栏好了）推开至可视区域外，那么在B画布中也是需要保留X元素的（此时只是留在画布外面，但是必须有），如果B画布中没有X元素那么最终效果就是没有“推开”动画，X元素直接消失。预设了动画曲线，常用的easing curves、springs等等缓动弹性已经变成无脑设置了。默认0.3秒，完美～连续的交互指的是单个页面中，拖拽、滚动、翻页，支持x、y轴操作。其中翻页涉及到固定距离和组合大小一致问题，其他没有坑。联动与动画的区别在于：动画是在不同Artboard中发生的，而联动是在同一个Artboard发生多个相关联的动效。最好理解的就是常见的，一篇内容顶部有个背景氛围图，下拉正文内容时，顶部图片变大。同时，联动就是视差效果的利器。期间只需要控制几个元素动画的开始时间即可。＊＊＊＊＊＊和Principle无关的一点私货＊＊＊＊＊工具总是在推陈出新，但是难点永远在你想不到的动画效果。常常学习一个新软件最后发现好像真的只是在搞清楚这个工具有什么功能，本质上是没有什么提升的。（反正我自己是如此反思的）Dribbble上牛人辣么多，很多几秒的动画背后的细节光靠看是看不到的。请善用Mac自带的Preview，打开GIF会被拆分成几百张，找到发生关键变化的那几帧（俗称关键帧），研究以后才能真正体会动画的奥妙和乐趣所在。另外，官网购买时支持多个账号（俗称拼单），比单个买便宜一些。请支持正版，99刀其实真的不仅仅是不贵，简直物超所值。有些人花了几倍的时间去满世界找破解，只能说明TA的时间和道德还真是挺不值钱的（这种人似乎还经常在一些场合中宣传自己怎么有钱来着）
长久以来，我一直在花时间寻找一款真正适合我的交互设计软件，为此我先后学了Origami和Pixate，也花了一点点时间研究了下Framer，但2天后我果断放弃了它。Origami（去年写的教程：&a href=&/question//answer/& class=&internal&&Quartz Composer 如何入门？ &/a&）和Pixate我当初也是花了大力气和决心学习 ，虽然现在在绝大多数项目中完全能够轻松驾驭，但过程总是磕磕碰碰，并不那么愉悦的说。所以，寻找更优更高效的生产工具我从未停息过。&br&&br&一周前无意中关注到Principle，只是稍许的时间我就被它吸引到了，这是迄今为止唯一一款我能不在教程帮助下直接上手的UX软件。 它很巧妙的结合了Sketch-界面和功能布局、Keynote-神奇移动效果、Flash-创建补间动画，甚至Origami-事件的管道拖拽等软件的优点，相信你能够跟我一样很快的掌握这款交互设计的神器。&br&&br&至于学习的轨迹，跟Origami几乎相似：&br&&ol&&li&看完官网的 &a href=&///?target=http%3A///tutorial.html& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&五个基础视频教程&i class=&icon-external&&&/i&&/a&；自己动手做完成五个视频内容&/li&&li&认真阅读&a href=&///?target=http%3A///docs.html& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&官方文档&i class=&icon-external&&&/i&&/a&，很简单，10分钟可以看完，英文吃力的同学可以看我整理的&a href=&///?target=http%3A///principle-chinese-document& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Principle中文文档&i class=&icon-external&&&/i&&/a&。整个教程只有「连续的交互/Continuous Interactions」和「联动/Drivers」稍微需要花点时间消化，其他都特别容易掌握。&/li&&li&加入 &a href=&///?target=https%3A///groups/625/& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Facebook的Principle小组&i class=&icon-external&&&/i&&/a&，活跃比较高，可以很快找到解答；或者加入我们学习互助扣扣群&/li&&li&看完SketchTV 在Youtube上录制的 &a href=&///?target=https%3A///playlist%3Flist%3DPLgwNtYvZGv9STGDSx_knjYyzS7XzmpK84& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&高保真的视频教程&i class=&icon-external&&&/i&&/a&，有几个复杂的项目跟着做，可以帮助理解一些复杂的动画实现原理 好像半个月更新一次&/li&&li&下载网上所有你能找到的Principle源文件，&a href=&///?target=http%3A///& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&在这里，我已经为大家收集好了&i class=&icon-external&&&/i&&/a&，千万不要直接下载源文件看，会很累，建议你看完效果直接自己上，遇到问题在从源文件中寻找答案即可。&/li&&/ol&
长久以来，我一直在花时间寻找一款真正适合我的交互设计软件，为此我先后学了Origami和Pixate，也花了一点点时间研究了下Framer，但2天后我果断放弃了它。Origami（去年写的教程：）和Pixate我当初也是花了大力气和决心学习 ，…
&a href=&///?target=http%3A//ux-/post/1ead49_7fa3f8b& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Principle : 你必须试一试的原型设计工具-Shunz@UX&i class=&icon-external&&&/i&&/a&&br&From: &a href=&///?target=https%3A//blog.growth.supply/principle-the-prototyping-tool-you-got-to-try-93ab743fe4ae& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&&Principle : the prototyping tool you've got to try&&i class=&icon-external&&&/i&&/a&&br&&br&翻译上文时用Principle做了两个动效gif，但在知乎编辑框中不知为啥画质渣成狗，帧率也有问题（好吧，发出来一看，根本变成静态jpg了，WTF！）。&img src=&/eea88e8cddd4444aaee1a2_b.jpg& data-rawwidth=&261& data-rawheight=&465& class=&content_image& width=&261&&&img src=&/d8bba3fcf018ce5cc87eb42_b.jpg& data-rawwidth=&261& data-rawheight=&465& class=&content_image& width=&261&&
翻译上文时用Principle做了两个动效gif，但在知乎编辑框中不知为啥画质渣成狗，帧率也有问题（好吧，发出来一看，根本变成静态jpg了，WTF！…
已有帐号？
无法登录？
社交帐号登录
一句话怎么够描述清楚一个人呢？如何评价 Principle 这款交互设计工具_百度知道