今天我们开始我们的第一个Mugeda动画作品,并通过它来看看制作Mugeda动画的一些通用流程.在开始制作之前,请确保你已经拥有一个Mugeda网站的账号.如果还没有,你可以登录 www.mugeda.com 免费注册一个. 简单来讲,制作一个Mugeda动画内容,包含有如下几个步骤: 1. 添加元素(图片.文字等)到舞台: 2. 为添加的元素定义动画: 3. 定义和用户的交互行为(例如点击跳转等): 4. 导出或发布内容: 在这个例子中,我们制作一个简单的动画,让一段”Hello, world…

[Mugeda HTML5技术教程之2] Mugeda HTML5动画平台简介 摘要:Mugeda提供基于云的平台,供开发人员和设计人员快速的开发.发布和统计基于HTML5的,包含丰富动画和交互的移动富媒体内容. 在上一篇教程中,我们大致分析了HTML5的现状以及今后的发展趋势.在移动浏览器(含浏览器控件)中渲染的HTML5应用,将会和移动原生应用相辅相成,共同发展,在移动互联网大潮中扮ch来越重要的角色.另一方面,开发HTML5应用目前仍然存在成本高.效率低的诸多问题,这也在一定程度上阻碍了H…

本节我们将要做一个跨屏互动应用的案例分析,该应用时给一家商场做活动使用的,是一个跨屏爱消除游戏.PC端页面显示在连接在PC的大屏幕上,参与活动的玩家可以用自己的手机扫描PC端页面上的二维码,连接成功后,操作手机上的游戏可以同步控制主屏幕的游戏画面和结果.游戏结果会记录到排行榜,商家定期会对排名前10的玩家进行奖励. 游戏规则和前面分析过的爱消除的案例类似,这个游戏本身就是在原来的单机游戏的基础上有进一步开发做了跨屏通讯的内容. (一)游戏规则: 1.开始游戏时,德基的logo机出现在最上面一行的…

本文档要分析的案例是一个爱消除的网页小游戏,从中可以体会一些Mugeda API的用法和使用Mugeda动画制作网页游戏的方法. (一)游戏规则: 1.开始游戏时,手机出现在最上面一行的任意一格: 2.开始游戏时,彩色石头随机从上往下落,填满所有的方框,相同的三个石头不能相邻的排在一列或者一行: 3.手机从上移动到最下面一行的任意一格,就算胜利,或游戏时间结束,消除的石头数量超过30个也算胜利. (二).游戏玩法 只要三个相同的石头相邻的排在一列或者一行,他们就会消失,同时上面的石头往下落,落到…

[Mugeda HTML5技术教程] 开篇: HTML5 - 生存,还是毁灭 摘要:HTML5并不试图解决所有问题.但是在很多适合的场合,HTML5是不二选择. To be, or not to be, that is the question.   -Hamlet 生存,还是毁灭,这是个问题.-<哈姆雷特> 这句500年前困扰哈姆雷特的两难选题,用来描述今天很多商业决策者和技术爱好者在面对HTML5技术时的心境,可谓再合适不过了.业界存在无数混杂的声音,上至业界大佬,下至技术票友,都为HTM…

一.API 概述 Mugeda API 提供了一个简单的,结构化的方法来实时动态管理Mugeda内容.它提供了一下方法: •访问Mugeda内容中的对象. •获取和设置对象属性,如位置.旋转.比例.不透明度等. •控制Mugeda动画的回放(例如:播放/暂停/跳转). •在舞台中添加/移除/编辑对象. •处理鼠标/触控事件创造互动体验 Mugeda API 是基于系统JavaScript技术.  不需要额外的库. 二.开始 开始使用Mugeda API是很轻松的. 在Mugeda IDE中,只需…

Mugeda Studio 是基于云平台的制作HTML5动画的专业可视化集成开发环境,可以让你在不需要安装客户端程序的情况下,只通过浏览器就能轻松创作高质量的HTML5动画.HTML5动画相对于传统的Flash动画最大的特点是可以跨平台部署,除了能在PC上显示,还可以在手机.pad等移动设备上完美显示.本节我们将主要介绍下Studio界面的相关组件,以方便大家后续使用.各组件的具体用法,后续章节会陆续介绍. 下面的截图是一个Mugeda Studio界面的工作图. Studio界面的主要组件有菜…

动画作品制作好后,就要拿来使用,怎么发布到想要的位置也是动画制作者比较关心的问题.这一节,我们讲述怎样将制作好的动画内容发布到想要的地方.对制作好的内容,可能的使用场景主要有以下三种:直接导出:发布到Mugeda CDN:上传到你自己的或者第三方的服务器上. 直接导出到本地,并部署在其他地方.点击工具栏上的导出按钮,或者点击菜单栏的File\导出\动画,就可以把动画包的ZIP文件下载到本地,解压缩后就是动画包的文件夹.然后你可以部署到其他地方. 导出的动画包的内容如下图, 根据制作的动画内容的不…

前一节我们讲述了怎么在新建的作品中添加元素,元素加好以后我们还想让他们动起来,来实现比较炫的效果.这节我们将要讲述怎么给元素添加动画.Mugeda动画是通过时间轴和帧来实现的.通过在时间轴上创建图层和单元,您可以在几分钟内创建专业动画. 时间轴界面如下图.对于要在移动设备上投放的作品,帧速最好不要超过12,因为帧速太快有些移动设备会比较吃力,设置帧速在属性区. 动画图层是用来组织添加对象 每个图层可以包含一个或多个单元(单元将在后面解释) 单击图层将使该图层置为当前图层 添加到舞台的元素将被添加…

本文档通过一个实例介绍可定制贺卡的动画的制作过程.实例包含两部分: 1. 动画部分:介绍动画制作过程中如何给祝福词和落款的文本对象命名,如何给定制按钮定义表单动作. 2. 代码部分:介绍贺卡的脚本逻辑的编写. 例程编辑地址: https://cn.mugeda.com/animation/edit/0326f6a1 例程预览地址: https://cn.mugeda.com/client/preview_css3.html?id=0326f6a1 动画部分 动画需要注意修改的地方: 1. 给祝福…

前一节,我们介绍了Mugeda Studio.这一节我们讲一下怎么通过Studio创建新作品.首先登陆网站,如果还没有登陆账号,你可以登录 www.mugeda.com 免费注册一个.登录网站后,点击网站左侧的“创建作品”,然后从出现的创建列表中选择”从Mugeda Studio创建”,这样Mugeda Studio的在线集成开发环境会在浏览器窗口中打开了. 如果已经在Studio页面想新建另一个作品,可以点击文件菜单下面的“新建”按钮来开始,如图: 进入Mugeda Studio后,首先需要选…

1.简介 本文主要介绍如何在Android应用程序中使用Mugeda动画.Mgeda动画是标准HTML5格式的动画,在Android应用程序中可以使用WebView来加载Mugeda动画.动画内容本身可以放在应用程序本地,也可以放在远端. 先来看一下Mugeda动画的格式.下图中展示了一个典型Mugeda动画的文件结构.对于 Android应用程序来说,需要加载index.html来打开动画. 2. 示例 下面用一个实例在演示如何使用,这个实例的界面如下图所示.中间的白色区域是WebView用来…

元件是一个可以在舞台上实例化和再利用的预先生成的独立动画.一个元件有它自己的时间轴(层,单位等),可以独立显示的动画.元件提高了动画的重用性和灵活性,是个强大的存在.元件可用于创建复杂的动画效果. 所有元件都在元件库里管理.您可以创建.编辑.删除元件,或将他们归类到不同的文件夹.元件既可以直接拖拽到舞台上生成实例,更可以再脚本中,通过Mugeda API 代码动态生产实例,一个元件可以生成多个实例,并可随时动态删除,在复杂的动画中,比如小游戏,非常方便,Mugeda API的使用后面会有专门的章…

我们上节讲了怎么创建新作品.新作品创建好后,我们就可以在里面添加内容了.这一节,我们将要讲述如何在作品中添加元素.动画的中的内容都是以各种元素的形式组成的.对于添加到舞台上的元素,我们可以在时间线上添加动画,也可以在属性对话框中修改相应属性,还可以在脚本中通过名字获取到该元素对象,通过Javascript代码通过Mugeda API 操作该元素从而完成更加丰富多彩的内容.这节我们主要讲解怎么添加元素和修改其属性,给元素添加动画和通过脚本操作元素将会在后面的章节中有详细介绍. Mugeda支持的元…

1. 功能简介 Mugeda提供动画统计功能,使得动画制作者可以直观的了解动画的浏览情况,包括浏览量,参与度,以及观看者的分布情况. 目前统计功能主要展示动画内容和广告工程的统计数据.在动画被发布或导出,并且被观看过之后才会在统计页面中看到关于这个动画的统计数据.在动画被发布或导出,可以将动画放在本地观看,也可以放到服务器上供大量用户观看,这些情况下观看情况都能被统计. 1.1 在动画作品列表中,点击每个动画下方的发布按钮就可以发布一个动画了. 1.2 在每个动画的编辑页面中,点击下图红框中的按…

本文档要分析的案例是一个一氧化碳还原氧化铜的教育小课件,从中可以体会一些Mugeda API的用法和使用Mugeda动画制作移动教育课件的方法.Mugeda为移动教育领域和移动数字出版领域提供理想的教育课件/微课程和交互动画内容制作方案,在PC上制作相关内容的Flash创作人员可无障碍使用Mugeda制作适合平板电脑和智能手机的课件和数字出版物. 课件内容: 一氧化碳还原氧化铜实验课件.课件动画的前半段是实验设备的安装过程动画:后半段是交互部分,在这部分学生可以通过点击按钮的步骤来完成实验,有点…

在广告主的需求中,有很多情况下需要在动画中添加一些外部链接.这份文档就在Mugeda动画中添加外部链接的方式,做一下梳理. 1.通过点击触发的链接 就是要用户点击屏幕来触发链接的情况,这是推荐使用的方式.因为存在流量的考虑,不需要任何点击就跳转的操作,在有些移动设备上是不被支持的,所以我们推荐的触发跳转链接的方式是通过点击触发. 实现的方式是: 在舞台上选中一个物体对象,在动作中选择“链接”,输入框中写入完整的链接的URL,如下图. 这样当用户点击这个物体时就会跳转到相应的页面. 2.自动跳转的…

mugeda动画平台还可以用来制作跨屏互动的动画应用,比如在PC端的大屏幕上显示动画的主界面,同时会显示出供手机扫描的二维码,手机扫描后会在手机上显示手机端动画界面.通过手机就可以和PC端的显示界面跨屏互动操作.这种动画应用在类似一些商场搞活动,或者户外宣传等常见可以使用.可以制作一对一玩的跨屏互动应用,也可以制作一对多玩(多个玩家同时玩)的跨屏互动应用.为了更好的理解跨屏互动应用的使用,本文档将通过一个简单的例子来演示跨屏动画的制作过程. 一.制作动画 1.PC端动画制作 a.在PC端,设置舞…

上一节我们已经在新建的作品中添加了元素和动画,如果我们想要作品能够和用户互动,就需要给元素添加动作行为.在舞台上选中一个要添加动作的元素,在属性栏的动作下拉列表中选择一个动作.可选类别有链接.表单.行为.链接可以导航到网页:表单可以被编辑并提交:行为是更高级的动作方式(包括播放控制.过渡.调用电话功能.回调函数等).后面会有详细介绍. 链接是在广告动画中比较常用的方式.通过链接的方式,我们可以再作品中加入想要用户浏览的一些链接.在动作下拉列表中选择“链接”后在后面的输入框中输入网址.然后选择链接…

本文转载自:http://blog.csdn.net/jcodeer/article/details/1811321 '''Tkinter教程之Menu篇''''''1.创建一个简单的Menu'''#添加菜单hello和quit,将hello菜单与hello函数绑定:quit菜单与root.quit绑定# -*- coding: cp936 -*-from Tkinter import *root = Tk()def hello():    print 'hello menu'menubar =…

Playmaker Input篇教程之PlayMaker菜单概述 Playmaker InputPlayMaker菜单概述 Playmaker插件被导入游戏项目以后,会自动为Unity编辑器添加一个名为PlayMaker的主菜单,如图1-14所示.熟练的使用这个主菜单,可以让我们更快的找到Playmaker提供的重要功能,以及特定行为的快捷键.   图1-14  PlayMaker菜单 Playmaker Input快速打开playMaker编辑器 playMaker编辑器是开发者使用Playm…

Playmaker Input篇教程之Playmaker购买下载和导入 Playmaker Input篇认识Playmaker Playmaker是Unity的插件,其标志如图1-1所示.开发者使用它可以快速的将自己的游戏创意实现出来,而不必纠结于复杂的代码编写.它既适合于独立的开发者,也适合于游戏开发团队.   图1-1  插件Playmaker Playmaker Input篇简述 Playmaker是一个可视的状态机编辑器.而状态机(如图1-2所示)并非十分复杂的概念(本章后面会详细介绍)…

Xamarin Anroid开发教程之Anroid开发工具及应用介绍 Xamarin开发Anroid应用介绍 如今智能手机已经盛行了好几年,而针对这些智能手机的软件开发也变得异常火热.但是在Android平台下只能使用Java开发,iOS平台下也只能使用Objective-C或Swift开发.对于那些C#程序员却只能眼看着这些火热的平台流口水.在几年前只能重新学习一门新的语言,才可以进入这些智能手机开发行业.现在,我们有了Xamarin.C#程序员不需要了解其它语言,就可以开始编写Android…

AppleWatch开发教程之Watch应用对象新增内容介绍以及编写运行代码 添加Watch应用对象时新增内容介绍 Watch应用对象添加到创建的项目中后,会包含两个部分:Watch App 和 WatchKit Extension,如图2.18所示.其中,Watch App部分位于用户的iWatch上,它目前为止只允许包含Storyboard文件和Resources文件.在我们的项目里,这一部分不包括任何代码.WatchKit Extension部分位于用户的iPhone安装的对应App上,这…

HealthKit开发教程之HealthKit的复合数据 复合数据就是复合单位和值构成的数据.所谓复合单位就是由单位进行乘法.除法等得到的单位,如m/s.lb·ft等就是复合单位.本节将针对这些复合数据进行讲解. HealthKit的相乘得到的复合数据 在物理学中我们可能接触过类似lb·ft(扭矩单位,扭矩是使物体发生转动的一种特殊的力矩.)这样的单位.这种单位我们可以看做是两个单位相乘得到的复合单位.开发者如果想要在自己的程序中使用这种复合单位,首先需要对这种单位进行创建.创建这种单位需要使用…

HealthKit开发教程之HealthKit的辅助数据 在HealthKit中除了主要数据之外,还有6个辅助数据分别为:体积类型数据.压力类型数据.时间类型数据.温度类型数据.标量类型数据和电导率类型数据.本节将针对这6个辅助数据进行讲解. HealthKit的体积类型数据 体积,或称容量.容积,几何学专业术语,是物件占有多少空间的量.体积单位可以用来测量物体的体积.由体积单位和值组成的数据就是体积类型的数据.体积单位可以分为:国际体积单位.英制体积单位和美制体积单位. 1.国际体积单位 体积…

HealthKit开发教程之HealthKit的主要类型数据 在HealthKit中,我们将最常用到的数据称之为主要数据.主要数据基本上有三种:长度类型的数据.质量类型的数据.能量类型的数据.本节将主要对这三种主要数据进行讲解. 长度类型数据 长度单位是指丈量空间距离上的基本单元,是人类为了规范长度而制定的基本单位.而长度单位和数值构成的就是长度类型数据.根据单位的类型不同,该类型可以分为国际长度单位和英制长度单位两种.以下就是对这两种长度单位的介绍. 1.国际长度单位 国际长度单位是“米”为单…

HealthKit开发快速入门教程之HealthKit数据的操作 数据的表示 在HealthKit中,数据是最核心的元素.通过分析数据,人们可以看到相关的健康信息.例如,通过统计步数数据,人们可以知道一天走的步数.本章将主要讲解HealthKit数据构成的方式,以及如何规范的表达一个数据. 2.1  数据的操作 在HealthKit中,数据都是与单位和值组成的,如图2.1所示.此图为一个睡眠分析的截图.在此图中59m就代表了一个数据.其中m为单位,59为基于单位的数值.本节将讲解数据的创建.判断…

HealthKit开发快速入门教程之HealthKit框架体系创建健康AppID HealthKit开发准备工作 在开发一款HealthKit应用程序时,首先需要讲解HealthKit中有哪些类,在iOS上的Health即健康应用有哪些功能等.本节将针对这些问题进行讲解. HealthKit框架体系 对于一类应用程序来说,要进行开发,首先需要熟悉它的框架体系,即类.以下我们针对HealthKit中所使用的类进行了总结,如表1-1所示. 1-1  HealthKit框架体系 类 功能 NSObje…

HealthKit开发快速入门教程之HealthKit开发概述简介 2014年6月2日召开的年度开发者大会上,苹果发布了一款新的移动应用平台,可以收集和分析用户的健康数据.该移动应用平台被命名为“Healthkit”.本章将主要讲解HealthKit的特点.经典应用以及在开发HealthKit时的准备工作. HealthKit简介 HealthKit就是可以收集和分析用户的健康数据移动应用平台.本节将主要讲解HealthKit的特点.经典应用. HealthKit特点 本小节将主要讲解Healt…