[flash=500,400]http://s1.knowsky.com/20131005/nqewdbvk5cl062084725.jpg[/flash]
每一次写关于如果快速创建APP的分享,都想带给大家一个不一样的内容。一个很棒的功能点,或者一个对Celluloid的使用心得,或者……
今天模仿《WWF》制作一个案例,来讲如何通过Celluloid实现一个独立APP的快速搭建。
见视频效果:
[flash=500,400]http://player.youku.com/player.php/sid/XNTQ4NDI4MTg0[/flash]
一个APP的开始,我更喜欢梳理自己的想法,把自己的想法以图文的形式展现出来,并进行深加工和创意,通过Celluloid进行交互设计,终将一个app实现。
[flash=500,400]http://s1.knowsky.com/20131005/fd320lcdgem062084825.jpg[/flash]
我自己的流程图,供大家参考,如果大家有更好的工作方式,欢迎拍砖:
创意IDEA——设计流程图——UI界面设计——Celluloid交互设计——实现APP
[flash=500,400]http://s1.knowsky.com/20131005/d5ccw2cbzbw062085025.jpg[/flash]
通过Celluloid的几次更新,ipS带给了大家对全局导航内容的创建,Celluloid里叫它公共页面,也可以理解为作用在其他页面之上,供多个页面共同使用的一种交互方式。
这样,我可以在整个APP的框架技术上,通过幻灯片、按钮等方式,创建一个全局导航,在不同的内容上快速跳转,或者播将一段优美的音乐,连续播放的作用在几个不同的页面里。
[flash=500,400]http://s1.knowsky.com/20131005/4dkq4s2kw4y062085225.jpg[/flash]
公共页面的设置:
[flash=500,400]http://s1.knowsky.com/20131005/aodwrrlkwmk062085325.jpg[/flash]
通过对整个APP的梳理和设计化操作,很简单的就能搭建出一个APP框架,剩下的,就是制作每个子页面的内容、交互、动画等。
在这里,我就暂时不一一介绍子页面里的交互和动画是如何实现的,在未来,我会集中几期,通过简单的图片演示配合视频教材,来把Celluloid所有的交互方式和动画操作,一点一滴的梳理出来,供大家快速的学习使用。
希望大家喜欢本期内容,也敬请期待以后关于如何快速创建APP的其他内容。
本期案例文件下载地址:http://pan.baidu.com/share/link?shareid=545283&uk=4228735718
使用工具:
Celluloid 制作交互动画
下载地址: http://www.mcitech.cn/download.html
IPS viewer APP真机测试工具
下载地址:http://setup.mcitech.cn/
或者通过appstore下载
往期教程:
App的快速实现01-写在最前面的话,初学者从这开始
http://www.zcool.com.cn/article/ZNDM0NjQ=.html
App的快速实现02-三步实现产品360°展示
http://www.zcool.com.cn/article/ZNDM2MDA=.html
App的快速实现03-快速实现电话、短信、邮件的通信快捷方式
http://www.zcool.com.cn/article/ZNDM3NjA=.html
快速实现APP里的图层时间错位延迟(屌丝钢铁侠)
http://www.zcool.com.cn/article/ZNDI0Njg=.html