ui引擎,解决方案.docxVIP

ui引擎,解决方案 　　篇一：强大的界面交互引擎介绍 　　强大的界面交互引擎  　　1、 为什么采用基于H5的页面设计  　　移动设备的普及给媒体和娱乐带来了一场革命。根据中国互联网信息中心（CNNIC）XX年7月的报告显示，中国网民中，手机使用率达%，已经超过传统PC整体％的使用率。其中，手机网络新闻的使用率为%，仅次于即时通信和搜索，远超其他手机网络应用。在资讯移动化的趋势下，观察近期各大门户在重大事件报道中的表现，会发现移动优先、产品社会化、交互趣味化是三个重要的趋势。其中，基于HTML5技术的移动Web页面（以下简称H5页面），较完美地融合了上述三种属性，成为当下最受关注的内容报道形态，也引爆了社交平台上的大规模分享行为。  　　就像CD取代磁带成为一种更高效的音乐播放方式一样，数字文件也将取代CD，依此类推，智能手机也将会替代PC的一部分重要功能。尽管仍有争议，但不可否认的是，移动互联网时代已经到来，随着用户从PC向移动端的迁移，从大屏到小屏，从鼠标键盘到多点触控，移动端逐渐成为媒体报道的前沿阵地。  　　除了原生应用之外，在移动端还有一种产品形态——移动Web页面。它源自于移动互联网诞生初期的WAP页面，有着和PC网页同样的优点：开发周期短、发布和更新方便。此外，用户只需要借助手机浏览器或者内嵌手机浏览器的应用就可以访问，比原生应用要方便得多。但在XX年前，因用户渠道和设备性能的原因，移动Web页面的形态通常都非常简单，也很少有用户互动。XX年，HTML5技术的普及、智能手机的更新换代和新闻客户端、微信等渠道用户的增长彻底改变了这一点。  　　在移动端，要在网页上实现交互和动效需要借助HTML5技术（例如CSS3媒体查询、CSS3动画、Canvas等）。现在的手机浏览器大都支持HTML5的核心技术，例如对触摸事件和手势的响应、播放声音和视频、渲染CSS变换，以及获取设备的加速度传感器数据等。这些技术衍生了诸如互动小游戏、交互型动画页面、可视化新闻等，为市场营销、媒体报道等提供了大量不同形式的载体，同时为产品策划与视觉设计带来了更多的想象空间。 通过HTML5实现交互效果时，通常比原生应用要更消耗设备资源，因此设备性能就成为H5页面效果的一大瓶颈。现在，这个瓶颈正在消除：XX年7月的一项调查表明，中国手机用户换机周期已由XX年的29个月缩短到18个月。而近两年上市的智能手机，大都运行着较新的操作系统和浏览器，性能上也能基本达到展示H5页面的要求。  　　2、 基于Frozen UI的界面交互引擎  　　 特点与优势 　　 随心所用的样式组件 　　FrozenUI提供的CSS组件是目前QQ会员前端开发组所用的通用样式库。遵循手Q样式规范，基本样式使用离线包的方式减少请求，并提供快速接入的方案。  　　 更显灵动的JS插件  　　FrozenUI提供的一系列JavaScript插件，更优雅地在移动端上呈现更灵动的动画效果。  　　 更加丰富的动态效果库  　　3、 丰富的UI组件 　　 按钮 　　 普通小按钮  　　 带进度的按钮  　　 普通大按钮 　　普通按钮组 　　 底部按钮组 　　 面板 　　 默认面板  　　 简单版  　　 头像  　　 基本头像 　　篇二：UI设计流程 　　UI设计流程  　　阶段一：分析  　　1用户需求分析 2用户交互场景分析 3竞争产品分析  　　这两者可以说是相辅相成的。对于一个较为正规的项目而言，必然有对用户需求的分析内容。Tanjurd瑭锦资深UI设计师表示其中用户UI需求是重要的组成部分。如果说UI设计原则是所有UI设计的出发点的话，那么用户UI需求就是本次设计的出发是好的UI设计建立在对用户深刻了解之上。因此用户交互场景分析就很重要。对于大部分项目组来说也许没有时间和精力去实际勘查用户的现有交互、制作完善的交互模型考察，但是UI设计人员在分析的时候一定要站在用户角度思考：如果我是用户，这里我会需要什么。竞争产品能够上市并且被UI设计者知道，必然有其长处。这就是所谓三人行必有我师的意思。每个设计者的思维都有局限性，看到别人的设计会有触类旁通的好处。当然有的时候可以参考的并不一定是竞争产品。  　　阶段二 设计需求：（叶面设计前需提给UI页面组）  　　1.系统设计需求文档。2.系统结构文档（例如栏目划分，目录结构，导航方式等）。3.较复杂页面表现形式草图（手绘或相关软件绘制）。4.较复杂业务流程文档。5.如有可能提供参考和示例站点。6.与程序员沟通部分页面实现方法。  　　段三：页面制作：  　　1.经过确认的美术设计的方案图7.系统设计需求文档等，较复杂务流程文档。2.所需页面脚本需求，与程序员沟通部分页