Practice mashups. Mlearning 2009

Prototype your architecture for your pedagogical activity Antoine Beugnard and Jean-Marie Gilliot

Context and Goals Fast prototyping M-learning context Web Infrastructure Think (architecture) different ! Goals Just make a prototype How to derive on a real architecture page 2 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Agenda Components examples How to assemble ? A web page on a server a blog is one easy option A pbworks wiki is another DIY : Do It Yourself Try it and your neighbour post And others ... page 3 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Web Objects – Web Components Access Object + Function name Data Parameters API display page 4 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Component Examples A document (video/ slide / …) hosted on any website RSS Reader Agregator/ Storyteller : Embeddable Video Toxkbox, DimDim … Any web2.0 Tool : WallWisher : http://www.wallwisher.com/wall/mlearning09 Sources http://www.go2web20.net/ http://www.programmableweb.com/tag/mobile page 5 Mlearning 2009 A. Beugnard & J.-M. Gilliot

How to make the glue ? (another view for 3-tier architecture) Object Client side Data Combination of data Server Side Seed Site Object Intermedary site Data Object Object + Data Data page 6 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Making some glue without programming Publish a web document (Intermedary Server Side) Blog Post : http://molene.enstb.org/mlearning09/ Or any other … Wiki Page : http://www.pbworks.com Copy, Paste Add some components & Adapt In my example Collaborative Document : WallWisher Just as an iframe <iframe src="http://www.wallwisher.com/embed/mlearning09" frameborder="0" width="100%" height="400px" style="border: 1px solid #999999"> loading it...</iframe> Your datas : slide show of collected pictures Get <embed> code from any website That's independant components page 7 Mlearning 2009 A. Beugnard & J.-M. Gilliot

More Components Video Tokbox Added in the post Added as a side Widget Twitter / other interface Side Widget page 8 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Making some glue without programming Aggregate feeds Connecting Data in Google Docs (Seed Server Side) Define a Form (or share mine !) To collect data Use the spreadsheet To compute your collected data Add a Gadget : a Map / a List / A drawing / a cell Export it ! To use your results page 9 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Results Fully accessible application Collaborative space Video / twitter for exchange Form to collect data MCQ Location Gadget to export results (maybe on another place) page 10 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Google inside ? Easy to use Enable connexions between components (Gadgets) Should everything be Google hosted ? We said we just want a prototype ! page 11 Mlearning 2009 A. Beugnard & J.-M. Gilliot

A collaborative page Adding information on a collaborative workspace Adding information on a map Enabling additional exchanges : Twitter Video Chat page 12 Mlearning 2009 A. Beugnard & J.-M. Gilliot

Few tricks Define your scenario What will happen ? Requirements Define/Find appropriate components Collect it on a page Remind your HTML page 13 Mlearning 2009 A. Beugnard & J.-M. Gilliot

HTML ? Usually copy/paste given code May need to include a whole page : <iframe src="http://www.wallwisher.com/embed/mlearning09" frameborder="0" width="100%" height="400px" style="border: 1px solid #999999">loading it...</iframe> <embed> <object> are other options Check what your site will accept page 14 Mlearning 2009 A. Beugnard & J.-M. Gilliot

http://molene.enstb.org	32
http://spiral.univ-lyon1.fr	1
http://www.slideshare.net	1

Practice mashups. Mlearning 2009

by Jean-Marie Gilliot on Jul 03, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

3 Embeds 34

Statistics

Practice mashups. Mlearning 2009 — Presentation Transcript