web设计中的过场动画
发布在剧中人驻前端乱炖大使馆2014年8月26日view:3281
在文章任何区域双击击即可给文章添加【评注】!浮到评注点上可以查看详情。

智能手机的界面设计和软件设计中,充斥着各类酷炫的过场动画。所谓过场动画,指的是两个界面相互切换时,通过特效来增加产品的趣味性的设计。

然而web的界面通常是一个个独立的页面,在页面相互切换时,浏览器的处理过程多数为凝固当前界面为不可操作状态,直接渲染第二个页面。性能较差的浏览器甚至会在凝固界面后新界面展示前,出现一个白屏画面的过程,整体体验较为突兀。

受限于页面间的跳转效果在程序上不可控,因此在web设计上,很少会提到“过场”的概念。

可能说到这儿,会略微显得“过场动画”太高大上了,对于我等屌丝来说是非常奢侈的事情。

且慢,随着移动web app的开发体验越来越接近原生移动端体验的今天,过场再也不是遥不可及的女神了。在单页面(和单页面相关的解释)的设计中,可以很容易的实现过场的设计。

至于单页面是什么,我个人的理解是:兼顾访问进度与无刷新的交互设计。如果你需要体验下这类效果,可以自备梯子去下facebook或者google+,翻不了墙的话也可以尝试看下我的个人博客

当然,单页面这个概念只是今天我提到过场动画在web设计中的一个技术基础,下面说说web设计上常用的几种切换方式(不完整,仅作为抛砖引玉)。 web设计中的过场动画

以上仅仅是自己在个人博客中实践得出的经验,整理得较为粗糙,见谅!

评论
发表评论
暂无评论
WRITTEN BY
剧中人
90后天蝎男,爱设计,喜欢造前端轮子,爱倒腾nodeJS代码。
TA的新浪微博
PUBLISHED IN
剧中人驻前端乱炖大使馆

大家好,我叫 剧中人 90后天蝎男,爱设计,喜欢造前端轮子,爱倒腾nodeJS代码。

常混迹于各前端群,专业潜水二十年,下面是我的一点点小成就,贱笑了!

友情链接 大搜车前端团队博客
我的收藏