[Mugeda HTML5技术教程之3] Hello World: 第一个Mugeda动画
2014-01-16 13:40
656 查看
今天我们开始我们的第一个Mugeda动画作品,并通过它来看看制作Mugeda动画的一些通用流程。在开始制作之前,请确保你已经拥有一个Mugeda网站的账号。如果还没有,你可以登录www.mugeda.com
免费注册一个。
![](https://lh6.googleusercontent.com/MZVKtBs2KzhKLw2DqbHJf2co04aRho1DNMXkHlGHbZw9bGi9fnqEQt6vlippE3ncO_a275y8Ucloo-ASHwdZckTozEsJOmigWkA246Tp_1emcu5_uvBkV_xgEw)
简单来讲,制作一个Mugeda动画内容,包含有如下几个步骤:
1. 添加元素(图片、文字等)到舞台;
2. 为添加的元素定义动画;
3. 定义和用户的交互行为(例如点击跳转等);
4. 导出或发布内容;
在这个例子中,我们制作一个简单的动画,让一段”Hello, world!”的文字旋转着出现在屏幕中央,点击文字后,调转到一个指定的页面。动画的演示地址如下:
https://cn.mugeda.com/client/preview_css3.html?id=bbbdd815
下面我们来一步步讲解如何实现上述动画。登录网站后,点击左侧的“创建作品”,然后从出现的列表中选择”从Mugeda Studio创建”。
![](https://lh4.googleusercontent.com/c0BzEc1vRVvbzWwmUyrddU0fL4RSF-oehatOqs6T00AxeEPeMWinmKQAW55rXVn7Wu8mnhaGg80FnrCr4ORPYgeklIDicYSBw0uiiMB2svkWwmC84sBTwiiF8w)
Mugeda Studio的在线集成开发环境(IDE)会在浏览器窗口中打开。首先需要选择一个动画尺寸。在这个例子中我们选择300x250,
这是一个典型的适合移动设备动画的尺寸。选择尺寸后,按“确定”继续。
![](https://lh6.googleusercontent.com/ClP1o-8q-772PjMZjfNY5GqMD6q-tmuGgzb-vlGfZpef-3G9cKOvDYHH0-FDbpZY5uaPz9CaLOuBaZWuqyByTL8PpXezk0lJON2_ob4whOS9OeFkHqagprCpqg)
Mugeda会准备好一个大小为300x250的舞台,这时候我们就可以开始制作动画内容了。
![](https://lh5.googleusercontent.com/sBJnzfJDA8FJ1XCX3ghQda4ygewXCY8oqD6ieEJAnLiglxeDh1A6oZW-tD5T4H1rTcswVl9nh1vfMPKcayNEzLJWscZfb8gLen8NZnOf_3XQ5CSW2yZX3zGkNA)
首先我们为舞台添加一个背景图片。从IDE左侧的工具栏上选择“图片”按钮,可以打开选择图片的对话框。
![](https://lh5.googleusercontent.com/F4gV3YZyszkv2zbgkQe2ib48SIiiXFqF41cPHjtAPiGCDLMo6-RiuLEGEXKLCPFpS2doaI8i1pic3QlVEshIiYy114iFRJ9Xp_o3MvtIglrwWoATxywankmPTQ)
选择图片对话框是在制作动画中用的最多的对话框之一。他提供了三种上传图片的方式:选择本地文件,输入网址,通过拖拽批量上传。上传的时候还可以指定一个目标文件夹。我们暂时采用默认上传位置即可。这个例子中我们从本地上传一个木质纹理图片。大家可以自由选择一个图片。选择图片并上传后,其尺寸、格式以及预览会显示在对话框中。如果满意了,就点击“选择”将图片添加到舞台上。
![](https://lh3.googleusercontent.com/kh66y0X8lcvSlxkXWe1ygwwR3ZB8Z_YsHoCOBLrMzUuFEoVra79YCj3u9awD0wa-KRFXVfYqG6Sdb68olU3oJNoKrcMOyRSzSsJ4A-KQvtnkVRVxCtsyq2Uzyg)
由于添加的图片尺寸(370x280)比舞台大,图片会缩小显示在舞台中央。
![](https://lh3.googleusercontent.com/YWMjxxIDDCMs--TDd3x-Mn5ezo5EX0cSzg1zjOvJa9R8hiin3s-XZyOvmGutXDpLtfdkndWNsXk_JS-XfTipQORO7LqsM8qd-4BXxLmDPR38AAQaJF-r4cT7Sw)
为了使其全屏显示,可以点击选择图片,然后在IDE下部的属性对话框中编辑其位置和大小使其全屏显示。
![](https://lh3.googleusercontent.com/7PJOkYWB3h2kETmV0aQubgSSJtQUNj3Qv8_NbeKlwIkgaeC2intcWt-cT_Ms36_T1qfivhuwnIXSHzlze_pteRZlPNDJw_Uis0LUp6Y9NNwZx2vUR6_TDZ8N2A)
接下来,我们为舞台添加一段文字。首先在IDE上方的时间线上,点击时间线左下角的“新图层”添加一个新的图层。
![](https://lh5.googleusercontent.com/m9PnYZOtg8dCeQ1fQE-j5Jppj62pPfrzITHyVWQ9wniVRyn5l1VPUKmfLazJ6uQi3vE1j_Kna9145pXz1x1v7QMO-vYTVxHjzP_HQywQ-pvH6vFoavMnnTrw2A)
新添加的图层会自动命名为”图层1”, 并添加在图层0的上面。
![](https://lh4.googleusercontent.com/dZb-ne4d4s3S2Ivgfoxo89B6PqUsUZzmoYNtWTLAzBjAgKQWOAq_Mh9jhYSXJ_JVIaSvRHFIQcahl6qmtF_V6rNWg5l5RsBH0bVpE3XLmL1B1TWrRZODtB4NXA)
下面我们来添加文字。从IDE左侧的工具栏选择”文字“, 并在舞台上点击鼠标添加文字。
![](https://lh3.googleusercontent.com/98RsWd28vK1rtzflXWyo-CbX1DsBGo47SX-aBPrmU_v88aHZMcs1XjvWJCEu9b72h-t2Ua6svqo6fKvOAtKMMRdcismyqASHZrASivUdZ3jQb_UTkXMxwO6ajg)
这是文字刚添加到舞台的样子。我们需要调整其属性。
![](https://lh3.googleusercontent.com/DZ1pc9tSC8g3oTK8ESO8SdtYC5RKJW7sT8D0iQGSRtTbI0ZwX6AIQbYpvtorfWKU6hrfMAa27gkhMsrC7u3gX7Y9rnUOzwT-aHDqBOshIoVJYrKgHA4s0kJVXA)
点击左侧工具栏上的选择工具,然后选中添加的文字。文字的属性会出现在下部的属性面板中。
![](https://lh6.googleusercontent.com/qMhyuoVJ99V3kIz2-9sjD0DLrGVBh4P0q7hc7hDNsE52Vtqv4qXq2aFsoXVgQS57rudLWuZtWPjqAwBvznJbHIiODhNxwzhyti8PC1RxGD3u3i-l06tmBuNGMw)
在属性面板调整其参数到一个满意的样子。下面是一个调整好的样子。
![](https://lh4.googleusercontent.com/4wMC_rK6yQ7RKdfSMXaPuNIpfuo51yuWshRZcyLFpMVPGlhaCQxug6UmLN6DNlI8g-ErqmWnm3MVF2A2NAI09w7ASyKhG_o4_ygPi7Q1B_LHPXuAN2eVnGOCmg)
到此为止,我们已经完成了第一个步骤:添加元素到舞台。接下来,我们为添加的文字定义一个简单的动画。在继续之前,我们先保存一下作品,点击IDE上部工具条上的”保存”按钮,或者从文件菜单中选择“文件/保存”。第一次保存作品时,需要提供一个文件名称。保存时的舞台截图,将作为作品的缩略图存在。今后再次保存时,不需要提供文件名,而作品缩略图会根据最新的舞台截图进行更新。
![](https://lh4.googleusercontent.com/erGYJuT0qW46QlzRnWbqRj8lAjgIHbXbkxg3xwWAFDyv0vix1baDKiG5Q1Bpuwd85H_VLGwoea--CkPnGGfPF86yy_GjJSfiNreFB01fxcHiRBkYiLnui8io8w)
为了制作动画,我们需要先将内容的帧数扩展至一个适合的数据。默认情况下,动画内容只有一帧,这个可以时间线面板上看到:
![](https://lh5.googleusercontent.com/ZWc5zlvLe6A7f5cpC2ikYMeU4N3ZZnUIwK9sOYw4JJnnXdc0PMrMSNJzXnIiHUDvpXPDAsNRpYhDO6eMARX-hy_CRsTWQRHnSt1iwFMgXIKCHZpswc6K1vsfLg)
我们现在把动画的帧数调整到20帧,以便制作动画。在时间线上点击图层0,选中第20帧,然后单击鼠标右键,从出现的菜单中选择“插入帧(F5)”,可以将图层0的帧数扩展至第20帧。也可以选中第20帧后,直接按下键盘的F5键,达到同样的效果。
![](https://lh3.googleusercontent.com/ac3CbynHeD7QZ13qQyqIX9qQpDoIhFf7JqaMudBKW5OIz_YE0Z-_miUl1q63oGJvC-mVXMeLPJ15pqki9AewoMJ2P_ZD7lv3ZK1cmI42EOdnvFUNbj_k-BMOIw)
这时候时间线显示如下。注意,图层0已经包含20帧,而图层1仍然只有一帧。
![](https://lh6.googleusercontent.com/zJKcB_FokYAoGYXWoo-fh8BPennEUBNEWskAnzshWL6xJlzS-2cqW62PBA7rHReMEEvOSKoB5RkTZ0WbUeSZC201Y5ItLLJVEOLf8rg8wbsvK0gvgZLVA0dmdg)
注意,定义在图层中的元素(图像、文字等),只有在图层的范围内才可见。为了理解这一点,可以点击工具栏上的播放按钮,在舞台上预览作品。
![](https://lh6.googleusercontent.com/jPH9sGpDBiribqLH2Fvf41wAZCVOkOeT25Ym4mbCy4QC9cmuKgLFb2aDPfxjglGcHqAcB_GnucO6rK5H1vWDf3kkV_CgNkI3bIXr3KN4EoakWd6HKEIKzV5zVw)
注意观察时间线的当前帧变化,以及舞台上文字和背景图片的可见性。由于我们要在文字上定义动画,因此,按照上述同样的方法,选中图层1,然后将其也扩展至20帧。
![](https://lh4.googleusercontent.com/71Y92WNEjGBOP6YwPS10jonOlj2cvU9WJSsFMFOh-_-Ap5JE8oXCOQx17r3JL24zTDyvx3rPcb1qG94C5gTzqVjX1EZR6I0mtKVaWtouMdw7DMYWPXt2JmuiHA)
终于可以开始添加动画了。在时间线上,单击图层1中1到20帧的任何一帧,单击右键,在出现的菜单中选择“插入关键帧动画”。
![](https://lh3.googleusercontent.com/9CUhkocQ4ghqCFlMPWkYd58hGjG2TTHRUiTXBLrQ4I-_wDCJR6ypsWDohKExC8ZcA6_dLxHK0T6QT448DgqzygQYgrJ3NFmgW-QFLHfpoNFA6TBG6eoA9QrxuQ)
这时候,图层1变成了浅绿色,并且在图层范围的最后一帧(第20帧)出现了一个红色的点。这表明,动画已经添加成功了。图层1中的第1帧和第20帧,定义了动画的开始、结束帧。中间的帧就可以由系统自动通过插值产生了。我们可以为图层1中包含的(文字)元素在动画的开始和结束帧分别定义不同的(位置、大小等)属性,从而产生动画效果。
![](https://lh5.googleusercontent.com/L9lLz9TMaI_Mfm4PknU_-NL4iAo7IWWIjd5Gns56ZaR6Mjij-dVglWliRxShCOXsoPph0Ga88_ht9oYALOG3SCF42fl3XTUQysMg8EkPS1taCe_qpU23G478SQ)
在时间线上选中图层1的第1帧,选中IDE左侧的“变形”工具,然后在舞台上选中文字,可以对文字进行缩放、旋转等操作。也可以直接在属性面板调整其属性。在这个例子中,我们把文字的初始透明度设置为10,旋转设为180度,大小缩小一点,并放置在舞台中央。调整好的属性如下图所示。
![](https://lh6.googleusercontent.com/rEYPzf7EuvwrI56fgzfdrFAvN-Q3WBIIcyuPzcGvlMZcFgZ9xHNxCZdOV954kVcHrkWdiKtKNQjHYc2GjjaVygcFA0jE-outzKbn_1IlnwuvfclX4DtJv8K8Ug)
保存作品。然后从工具栏点击“播放”在舞台上预览动画效果。也可以在工具栏上点击“预览”在一个单独的窗口预览动画效果。还可以在工具栏点击”二维码“获取一个二维码,然后在手机上预览产生的动画。
![](https://lh3.googleusercontent.com/OT6wU8EUtlfUfc5V2HdoGrXlEP8mkjeiMBTJPhx__6Sdy2mxqqvZtjm-uDUIbMn3GXWYOFWTGbl2Xg9ZMB4hWXtA4q4QYsc5RiDais2XENO25vW4uLIGFuKqMQ)
默认生成的动画会不停的循环,如果不想要循环,可以通过菜单项”动画/循环“来切换循环状态。
![](https://lh6.googleusercontent.com/zIdkd0l9Ee1ezobx_21T1Z7RTUvkOhH-UlI8nzZgL27orptgeiXmNL9nKRnnYWRquNKhlQYy8yBKrmvdb7C2HIrGx8to34oAE4U4H9nRwoYjTBWy59yLJdg6-g)
到此为止,我们已经完成了添加元素、定义动画两个步骤。这已经可以满足相当一部分网页动画的需求了。下面我们进一步为动画添加一个最简单的跳转行为。就是当点击文字时,跳转到一个目标网页。
暂停舞台的动画播放,选中背景图片,然后在其属性面板上,为其添加一个”链接“行为,地址指向百度,打开方式选择“外部打开”。
![](https://lh3.googleusercontent.com/XzXh-QYMPwebYqdG2M98Ao7NTa0LpwqV4ZnoVtuxP8f8TXmPg5ca8mBySiXKnQ8h49CQB_DQTf5s65wm3utxeLFEcyw77B-LJ7-sgxv2DavbG8_Niw4ph0QI1g)
再次通过预览窗口(注意不是在舞台上播放)查看动画。点击背景图片,将会导航至http://www.baidu.com。Mugeda支持大量的行为方式,从简单的链接,到表单提交、动画控制、调用手机功能(例如打电话),甚至调用JavaScript回调函数等。我们会在今后的教程中陆续介绍给大家。
![](https://lh4.googleusercontent.com/bI0QUi_Mqj4xpNa5bBbxsq5LS7gbcgP41mn0DifjJjEYk9g4NFTZ3m0B0a96QiLdLB65ytjWejYTGntcBVuyJlljfqi0jXUdNluKM1FcSUp-TijFjJEKC__nCw)
好了,恭喜你!第一个动画已经顺利完成了!
为了在你的网站使用这个动画内容,最简单的方式,就是导出完整的动画包,并内嵌到自己的网站中。记住在导出前保存你的作品。然后在工具栏选择导出按钮,或者在菜单中选择”文件/导出/动画”。该操作会将动画内容打包下载到你的硬盘上。
![](https://lh6.googleusercontent.com/Wj4t9qy9BSghZNC-UtQawJj8y2oY-cN51MWvTq4dsca0JOBZ6J02r8ie31KLrb-zCB0ArUtHr8M1Q-yDSEsw0iZ6BEZhywEo6ZtXZvslx_m_YMZNj0v8vqS88g)
![](https://lh4.googleusercontent.com/2JHH3Sa60QLVlAWmos9sndpX2kcVy2RI6v2lsGQIjDZ2QkKJ6nPZdtclPWdwn_MIX5HtOWCC8OIHgyDP-eX0We17YtEfJpTQ6eARxuw8S-Ll7Hfxd-K8-ifEYw)
导出的动画包中包含有动画播放所需要的脚本、样式、页面、图像等。双击其中的index.html文件可以直接在浏览器中观看动画内容或者通过iframe的方式嵌入动画。除此以外,Mugeda提供整套使用内容的方式,例如通过脚本插入、通过Mugeda
CDN发布等。我们会在今后的教程中陆续介绍。
![](https://lh6.googleusercontent.com/IIgWnz-3xNxAec6iiiuWqkiu1zJqGXXwpuqZe9wuZjPIwq4RnlfDnh4QDvc5pemtk3oLZPQClyYc1sHo-GVPFYh9WTFOzrqjUIXxrEP072prhSEfz7D_htevpQ)
本教程用到的动画的预览地址是:
https://cn.mugeda.com/client/preview_css3.html?id=bbbdd815
你也可以在登录后用下面的链接在IDE中查看其源代码:
https://cn.mugeda.com/animation/edit/bbbdd815
在本教程中,我们了解了使用Mugeda制作动画内容的一些最基本的操作:
1. 添加图像和文本元素到舞台;
2. 为元素定义动画;
3. 为元素定义行为;
4. 定义元素属性;
5. 基本的时间线操作;
这些操作十分容易理解和掌握,而其功能十分强大。在此基础上可以制作十分专业的动画效果和交互应用。我们会在其它教程中逐步介绍讲解。
免费注册一个。
简单来讲,制作一个Mugeda动画内容,包含有如下几个步骤:
1. 添加元素(图片、文字等)到舞台;
2. 为添加的元素定义动画;
3. 定义和用户的交互行为(例如点击跳转等);
4. 导出或发布内容;
在这个例子中,我们制作一个简单的动画,让一段”Hello, world!”的文字旋转着出现在屏幕中央,点击文字后,调转到一个指定的页面。动画的演示地址如下:
https://cn.mugeda.com/client/preview_css3.html?id=bbbdd815
下面我们来一步步讲解如何实现上述动画。登录网站后,点击左侧的“创建作品”,然后从出现的列表中选择”从Mugeda Studio创建”。
Mugeda Studio的在线集成开发环境(IDE)会在浏览器窗口中打开。首先需要选择一个动画尺寸。在这个例子中我们选择300x250,
这是一个典型的适合移动设备动画的尺寸。选择尺寸后,按“确定”继续。
Mugeda会准备好一个大小为300x250的舞台,这时候我们就可以开始制作动画内容了。
首先我们为舞台添加一个背景图片。从IDE左侧的工具栏上选择“图片”按钮,可以打开选择图片的对话框。
选择图片对话框是在制作动画中用的最多的对话框之一。他提供了三种上传图片的方式:选择本地文件,输入网址,通过拖拽批量上传。上传的时候还可以指定一个目标文件夹。我们暂时采用默认上传位置即可。这个例子中我们从本地上传一个木质纹理图片。大家可以自由选择一个图片。选择图片并上传后,其尺寸、格式以及预览会显示在对话框中。如果满意了,就点击“选择”将图片添加到舞台上。
由于添加的图片尺寸(370x280)比舞台大,图片会缩小显示在舞台中央。
为了使其全屏显示,可以点击选择图片,然后在IDE下部的属性对话框中编辑其位置和大小使其全屏显示。
接下来,我们为舞台添加一段文字。首先在IDE上方的时间线上,点击时间线左下角的“新图层”添加一个新的图层。
新添加的图层会自动命名为”图层1”, 并添加在图层0的上面。
下面我们来添加文字。从IDE左侧的工具栏选择”文字“, 并在舞台上点击鼠标添加文字。
这是文字刚添加到舞台的样子。我们需要调整其属性。
点击左侧工具栏上的选择工具,然后选中添加的文字。文字的属性会出现在下部的属性面板中。
在属性面板调整其参数到一个满意的样子。下面是一个调整好的样子。
到此为止,我们已经完成了第一个步骤:添加元素到舞台。接下来,我们为添加的文字定义一个简单的动画。在继续之前,我们先保存一下作品,点击IDE上部工具条上的”保存”按钮,或者从文件菜单中选择“文件/保存”。第一次保存作品时,需要提供一个文件名称。保存时的舞台截图,将作为作品的缩略图存在。今后再次保存时,不需要提供文件名,而作品缩略图会根据最新的舞台截图进行更新。
为了制作动画,我们需要先将内容的帧数扩展至一个适合的数据。默认情况下,动画内容只有一帧,这个可以时间线面板上看到:
我们现在把动画的帧数调整到20帧,以便制作动画。在时间线上点击图层0,选中第20帧,然后单击鼠标右键,从出现的菜单中选择“插入帧(F5)”,可以将图层0的帧数扩展至第20帧。也可以选中第20帧后,直接按下键盘的F5键,达到同样的效果。
这时候时间线显示如下。注意,图层0已经包含20帧,而图层1仍然只有一帧。
注意,定义在图层中的元素(图像、文字等),只有在图层的范围内才可见。为了理解这一点,可以点击工具栏上的播放按钮,在舞台上预览作品。
注意观察时间线的当前帧变化,以及舞台上文字和背景图片的可见性。由于我们要在文字上定义动画,因此,按照上述同样的方法,选中图层1,然后将其也扩展至20帧。
终于可以开始添加动画了。在时间线上,单击图层1中1到20帧的任何一帧,单击右键,在出现的菜单中选择“插入关键帧动画”。
这时候,图层1变成了浅绿色,并且在图层范围的最后一帧(第20帧)出现了一个红色的点。这表明,动画已经添加成功了。图层1中的第1帧和第20帧,定义了动画的开始、结束帧。中间的帧就可以由系统自动通过插值产生了。我们可以为图层1中包含的(文字)元素在动画的开始和结束帧分别定义不同的(位置、大小等)属性,从而产生动画效果。
在时间线上选中图层1的第1帧,选中IDE左侧的“变形”工具,然后在舞台上选中文字,可以对文字进行缩放、旋转等操作。也可以直接在属性面板调整其属性。在这个例子中,我们把文字的初始透明度设置为10,旋转设为180度,大小缩小一点,并放置在舞台中央。调整好的属性如下图所示。
保存作品。然后从工具栏点击“播放”在舞台上预览动画效果。也可以在工具栏上点击“预览”在一个单独的窗口预览动画效果。还可以在工具栏点击”二维码“获取一个二维码,然后在手机上预览产生的动画。
默认生成的动画会不停的循环,如果不想要循环,可以通过菜单项”动画/循环“来切换循环状态。
到此为止,我们已经完成了添加元素、定义动画两个步骤。这已经可以满足相当一部分网页动画的需求了。下面我们进一步为动画添加一个最简单的跳转行为。就是当点击文字时,跳转到一个目标网页。
暂停舞台的动画播放,选中背景图片,然后在其属性面板上,为其添加一个”链接“行为,地址指向百度,打开方式选择“外部打开”。
再次通过预览窗口(注意不是在舞台上播放)查看动画。点击背景图片,将会导航至http://www.baidu.com。Mugeda支持大量的行为方式,从简单的链接,到表单提交、动画控制、调用手机功能(例如打电话),甚至调用JavaScript回调函数等。我们会在今后的教程中陆续介绍给大家。
好了,恭喜你!第一个动画已经顺利完成了!
为了在你的网站使用这个动画内容,最简单的方式,就是导出完整的动画包,并内嵌到自己的网站中。记住在导出前保存你的作品。然后在工具栏选择导出按钮,或者在菜单中选择”文件/导出/动画”。该操作会将动画内容打包下载到你的硬盘上。
导出的动画包中包含有动画播放所需要的脚本、样式、页面、图像等。双击其中的index.html文件可以直接在浏览器中观看动画内容或者通过iframe的方式嵌入动画。除此以外,Mugeda提供整套使用内容的方式,例如通过脚本插入、通过Mugeda
CDN发布等。我们会在今后的教程中陆续介绍。
本教程用到的动画的预览地址是:
https://cn.mugeda.com/client/preview_css3.html?id=bbbdd815
你也可以在登录后用下面的链接在IDE中查看其源代码:
https://cn.mugeda.com/animation/edit/bbbdd815
在本教程中,我们了解了使用Mugeda制作动画内容的一些最基本的操作:
1. 添加图像和文本元素到舞台;
2. 为元素定义动画;
3. 为元素定义行为;
4. 定义元素属性;
5. 基本的时间线操作;
这些操作十分容易理解和掌握,而其功能十分强大。在此基础上可以制作十分专业的动画效果和交互应用。我们会在其它教程中逐步介绍讲解。
相关文章推荐
- [Mugeda HTML5技术教程之3] Hello World: 第一个Mugeda动画
- [Mugeda HTML5技术教程之18]如何在Android应用中使用Mugeda动画内容
- [Mugeda HTML5技术教程之7]添加动画
- [Mugeda HTML5技术教程之7]添加动画
- [Mugeda HTML5技术教程之18]如何在Android应用中使用Mugeda动画内容
- [Mugeda HTML5技术教程之1] HTML5: 生存还是毁灭
- [Mugeda HTML5技术教程之15]案例分析:制作移动教育课件
- [Mugeda HTML5技术教程之16]案例分析:制作跨屏互动游戏
- [Mugeda HTML5技术教程之17] 理解Mugeda访问统计结果
- [Mugeda HTML5技术教程之9]使用元件
- [Mugeda HTML5技术教程之1] HTML5: 生存还是毁灭
- [Mugeda HTML5技术教程之15]案例分析:制作移动教育课件
- [Mugeda HTML5技术教程之5] 创建新作品
- [Mugeda HTML5技术教程之16]案例分析:制作跨屏互动游戏
- [Mugeda HTML5技术教程之4] Studio 概述
- [Mugeda HTML5技术教程之2] Mugeda HTML5富媒体平台简介
- [Mugeda HTML5技术教程之1] HTML5: 生存还是毁灭
- [Mugeda HTML5技术教程之5] 创建新作品
- [Mugeda HTML5技术教程之12]制作跨屏互动应用
- [Mugeda HTML5技术教程之10]发布内容