快速生成APP产品设计的小工具推荐 APP-Style

当我们在做APP产品设计的时候,我经常忘掉那些小界面。比如报错页面,比如“正在连接到服务器请等待”等零碎儿,它们和主要界面的关系是怎么样的,它们之间又

当我们在做APP产品设计的时候,我经常忘掉那些小界面。比如报错页面,比如“正在连接到服务器请等待”等零碎儿,它们和主要界面的关系是怎么样的,它们之间又是什么关系,象我这种没有什么编程基础的人来说,经常会忽略这些。所以当我把产品设计交给程序员的时候,他们很容易迷失在我的产品逻辑中,我们不得不一次次的开会,之后程序员们还不得不自己补全很多我遗漏的小页面。这让我很沮丧,也让程序员们很沮丧。

所以我想做这么个小工具,只要你会一点HTML,就可以用它快速的表达APP的产品表现,你可以轻松的增减或挪移界面,也可以很方便的表达它们之间的互动关系。

hicoffee

App Sketch大概的思路是,用一个Section来表达一个全屏的界面。整体有两个维度:横向是从左向右层层推进的主界面,纵向是每个主界面可能产生的各种小页面。各个界面之间的互动关系通过超链接串起来。

最简单的用法,是引用一系列全屏(默认是480*640,当然你可以随便改)的静态图片,每个Section放一张静态图片,然后你就可以看到他们的互动关系然后随手修改。它比Axure好的地方是很简单,你的思路不会因为使用额外的工具而被扰乱,还有就是你可以用自定义的CSS文件准确的描述每个界面的细节,而且这些Css可以复用到成品的APP上,不会浪费。

App Sketch在形态上就是一个html+JS的包,你下载后可以随便怎么改。我做了一套默认的APP风格,你可以直接用,也可以改成自己喜欢的风格。或添加你自己需要的css标签。

这个项目的发起人是我和我的同事张路。我是做市场的不懂编程,而且个性比较粗糙,所以你看到的这个工具现在也挺粗糙。不过这个工具对我挺有用,希望也对你有用。如果你有兴趣,欢迎你一起来完善这个小工具。

快速生成APP产品设计的小工具下载:App-Style-20120524kk.zip

 

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

25学堂今天跟大家分享12张精美的移动模型素材分享,这12张素材你可以应用在你的移动APP项目当中或者是APP官网设计当中,顿时让你的作品高大上!下面的这12张移
如今再来看扁平化APP设计,还是那么的简洁漂亮!最重要的是扁平化的移动APPUI界面简单实用,对移动设计师来说,...最近,25学堂将会推出很多漂亮的移动APP应用模板(框
有创造性的APPUI设计往往可以大幅度提升用户体验的。那么好的移动APP设计干货和APP设计规范也是新手们的渴求的干粮。25学堂秉着分享和共同学习的原则,收集了
移动APP项目名称:易配货APP 2.0移动APP项目背景:易配货是传化物流产业集团为货主与司机打造的物流信息交易平台,基于诚信会员体系和移动互联技术,为会员
iOS切图神器,我想大家都不会很陌生啦,Cutterman也是目前移动端设计人员用的比较多的一款切图工具。还有25学堂之前推荐的在线切图工具和PS切图插件推荐等。
今天25学堂的小编跟大家分享一个国外优秀的图标字体酷站,也是一个在线编辑的SVG图标素材的酷站-SmartIcons.coSmartIcons 网站是一个提供了1500+个顶级图标和内建多种