邮箱订阅

订阅即可免费获取优质的设计资讯!

邮箱订阅

感谢你的支持!

分享到微信朋友圈:

Close

打开微信,点击底部的“发现”,使用 “扫一扫” 即可将网页分享到我的朋友圈。

热门文章

Mockplus是什么?

Mockplus,更快更简单的原型设计工具。快速创建原型,一键拖拽创建交互,团队协作省事省力。微软、华为、东软、育碧、Oracle、西门子、IBM等全球知名企业和全球300多所高校都在用,你也可以免费开始你的设计!

了解更多

Chainco交互利器--交互设计教程

桃子CC1233 2016-07-07 16:05:04 阅读:26341 www.zcool.com.cn

Chainco一款交互软件,根据不同的设备可设置各种交互效果, 在这里跟大家分享一下我的经验,尤其是希望能帮助一下刚进入这行的小白菜, 因为是第一次写这种文章,所以说的有哪里不好不对的地方,希望大家能够谅解并指出,感激不尽~~

Chainco一款交互软件,根据不同的设备可设置各种交互效果,
在这里跟大家分享一下我的经验,尤其是希望能帮助一下刚进入这行的小白菜,
因为是第一次写这种文章,所以说的有哪里不好不对的地方,希望大家能够谅解并指出,感激不尽~~


今天要介绍的这款软件叫Chainco
大家可以用电脑登录https://www.chainco.cn/user/login

c2f1577e04180000012e7edefad5.jpg

简单注册一个帐号就可以开始使用了,
注册完进去的页面如下图,
点击新建项目就可以开始做自己的
交互效果图啦~

b2c6577e04670000012e7ecad51e.jpg

这里是我创建的两个项目,
依次是项目名称、项目机型、创建时间,
右侧则依次是编辑、演示、克隆、删除。

首先点击新建项目,
将会有下面页面弹出

在这里对自己的项目起一个名字,方便记忆查找。
选择自己要设计的设备的机型,这里目前几乎包括了各大主流的设备机型
选择好之后点击创建就OK啦,
看到木有~揍是辣么简单~

这里我创建的是iOS 6plus的
箭头标识的地方都可以添加页面。


这里上传图片可以一次上传N张,所以还是很便捷的

ba2d577e05800000018c1bbd4e52.jpg

我们对所有界面的操作都在平铺那里,
所以点完排序记得回平铺那里哦~

48db577e05b50000012e7e294177.jpg看到红色箭头指向的小角标了嘛
这个是用于我们来固定区域的
我们在演示一个移动界面的时候,往往顶部搜索框和底部导航栏
都希望他能够固定在那里,
拖动小脚表,想要多大的区域固定就拖动多高,很方便。

把所有界面中带固定区域的都固定好之后,
就要开始设计交互流程啦。
当鼠标放在要设计的图片上的时候是不是有一个黑色的十字架,
我们要给哪里做交互,就用这个十字架框选要做交互的部分。
这里截图,截不到十字架,
亲们就意会下子吧<(‵^′)>

44fe577e060e0000018c1b5b2f9b.jpg

这里框选了商品分类

框选完之后,会出现一个线条,
这时候把这个线的一头连接到你要链接的页面就可以,
这是你会发现操作框的左侧会有一堆功能出现

fece577e06490000018c1b369027.jpg

触发方式顾名思义就是想对框选的部分
进行什么样的手势操作出现链接的页面,
首页的功能块一般都是点击触发的,所以默认选择第一个点击触发,
转场的意思也很简单,
就是你希望你链接的页面以什么样的动画出现,
我这里设置的是推动向←
想看效果的话可以都试一下,选择最合理最人性化的交互方式(*^__^*)

接下来就是体力活了,给所有要做交互的页面设置效果、触发方式吧~

fc5a577e06820000018c1bd30dc0.jpg

都做好之后,点击界面右上角的演示,就可以看效果啦~

dc72577e06a30000018c1bcfb95a.jpg

我们的Chainco更加强大的一点就是这个扫描二维码啦~
扫描二维码还可以在移动设备上查看,
在手机界面中会有生成一个icon,
打开就是我们刚刚做的交互效果,
拿着它去给客户演示,
瞬间高逼格有木有o(∩_∩)o

af9f577e06c70000012e7e16e8b5.jpg

串这个icon就是我们刚刚制作的交互效果,
赶紧打开看看吧~
有了他以后再也不用担心跟程序沟通不明白啦,
直接把这个生成的APP演示甩他一份,
就照着这个效果、这个流程做晓得不,
<(‵^′)>
瞬间觉得自己好屌有木有~

如果我写的东西对你有所帮助的话,
那么亲~
点个赞再走呗~

原型工具难上手、速度慢?试试Mockplus!

_____

Mockplus,更快更简单的原型设计工具。快速创建原型,一键拖拽创建交互,团队协作省事省力。微软、华为、东软、育碧、Oracle、西门子、IBM等全球知名企业和全球300多所高校都在用,你也可以免费开始你的设计!

免费下载
logo

咨询客服

帮助群:748169314 加入QQ群

服务邮箱:service@jongde.com

咨询客服

在线客服

置顶