But imagine any creative person – creating a 3d character for a game, drawing a picture, composing a music score, creating a graphically rich document or presentation, etc.  They likely have something in their hand, or their hands are busy doing something.  When that involves interacting with a computer they are likely clicking the mouse to drag something around or edit text, for example, or using a stylus on a digitizer surface (like a wacom) for drawing, or typing away on a keyboard.

These input devices are all essentially gone on new tablets and smartphones.  You can still type (slower) on virtual keyboards, and you can click like a mouse with your finger (tap).

An example of the impact of this is rich text editing, like with a word or openoffice or google docs document.  Many browser-based wysiwyg editing tools, which are used virtually everywhere, such as in moodle (which uses the TinyMCE editor) or drupal, no longer work when you access them from an ipad or iphone or android device (or other mobile platforms like blackberry or palm webos).  Even the newest “HTML5″ editors, such as Aloha Editor, pop up an error message if you try to access them from a mobile device.  Other browser-based editing and drawing tools also no longer work on these new platforms, or you have to draw with your fingers.  Most of Google’s and others’ tools like Google Presentation do not work on mobile platforms.  Really, just imagine most any software people use on a desktop to create stuff – like office, or the flash ide, or gimp/photoshop, blender 3d, etc.  Even when programming, which really is just typing in plain text, we usually prefer to use IDEs that popup suggestions and corrections to help us out.  For many of our desktop apps its hard to even imagine them working on a tablet or phone.

The rich text editing tools in browsers like TinyMCE or CKEditor primarily rely on the contenteditable HTML attribute to support editing.  Add that attribute to an HTML element, and the contents of that element become editable inside the web browser.  It works in all browsers, including old Internet Explorer versions. It doesn’t really work well or even at all on mobile browsers though (see here, here, here, here).

Newer versions of android, webkit, and mobile firefox have been slowly improving their support for contenteditable, and maybe they will eventually “fix” the issue, but I’m not sure that this will be fixed through engineering alone.  Some code editors like codemirror 2 and the ace editor are trying out workarounds like using a hidden textfield that captures key presses.  Codemirror 2 works on an ipad somewhat, the ace editor does not.  It remains to be seen if a similar trick might work for a rich text editor (it’s tricky enough just to do it for plain text).  And like I said, the HTC Flyer and other tablets (esp. those being designed for medical and other professionals) are starting to include a stylus, and it remains to be seen if that will catch on (it didn’t before with older tablets).  Others are coming out with dual screen tablets, where the second touchscreen can work like a touchpad on a laptop or nintendo ds, but that also may not catch on.

Another more general alternative strategy to this issue of tablets having no mouse or other input devices other than the touchscreen and the camera (which can be used for gestural or other input), might be to conceptually rethink how to support multimedia creation on these mobile platforms.  Perhaps we should drop the notion of “documents” or “pages”.  After all, you don’t think of a flash widget as a page or document.  You don’t think of a game as a set of pages or documents.  And Apple and other developers have already created apps for some specialized types of content creation and creativity, such as musical instrument simulators and so forth.

So, this may be a pre-paradigmatic moment where we’ll see what catches on: will we try to perfectly “emulate” the mouse and stylus and its supported interactions via other means such as gestures, or will new and unique types of interactions continue to catch on (like multitouch stuff).  Probably a combination of both, but so far the camera is hardly being used at all for input, other than recording videos or taking pictures.  And some may dismiss the idea of a stylus ever catching on again, but Apple has occasionally made “mistakes” before (the first mac didn’t have a floppy drive, for example), and others have been successful in incorporating a stylus, like the Nintendo DS, which my little boy continually loses

• What is the Platform of the Future for Developing Interactive Graphical Educational Software? – I argue for HTML5/Javascript, since Java and Flash do not run on (all) mobile/tablet platforms
• A Snapshot of the HTML5/Javascript Universe – a listing of various open source projects, libraries, and tools available to use
• Browser-Based IDEs – this is the future, I believe – doing coding in the browser.  Some updates are discussed below (cloud9 IDE, and a web-based version of eclipse)

Some Exciting New HTML5/Javascript and Related Projects

Here are some interesting new software projects and libraries and tools I’ve run across since my previous HTML5 post:

• Mobl
  • http://www.mobl-lang.org/ and https://github.com/mobl
  • Mobl is a new language that compiles down to javascript.  It has a great number of interesting features, including static typing, IDE integration (Eclipse), reactive programming (binding), data persistence (the creator of Mobl Zef Hemel also created persistence.js), and it automatically converts synchronous to asynchronous code.  This project is still under active development, but a great deal has already been implemented.
• Other Javascript-based languages and compilers
  • Here is a long list: https://github.com/jashkenas/coffee-script/wiki/List-of-languages-that-compile-to-JS Coffeescript is the most popular, but it sticks to the boundaries of what javascript handles (so no asynchronous macros or static typing or other big changes, for example)
• Modkit
  • http://www.modk.it/software
  • Modkit is basically a version of the Scratch graphical programming environment, but it works in the browser.  Not yet released, but coming soon.
• WireIt
  • http://neyric.github.com/wireit/ and https://github.com/neyric/wireit
  • WireIt is a YUI-based library for creating graphical interfaces or libraries that are like draggable nodes or concept maps, except the nodes aren’t merely bubbles or text, they can be editors or controls or whatever.
• HTML5 Canvas libraries
  • This is a rapidly evolving area as well.  Any graphical, educational animation or simulation is going to revolve around the (relatively) new <canvas> tag in HTML5.  There are several new canvas libraries out there, but there isn’t yet one clearly superior option that has the best of all the features of these libraries.  Another factor is that the javascript universe is split between jquery and non-jquery libraries (jquery mobile is emerging as a top option for the non-canvas parts of an application interface).  Some of these rely on jquery and some do not:
  • CAAT http://labs.hyperandroid.com/animation and https://github.com/hyperandroid/CAAT/
  • Unveil.js https://github.com/michael/unveil – Has support for not using up the processor when it is not needed
  • easeljs http://easeljs.com/ – Created to be like flash with display lists and so forth, by flash developers. Works with jquery I believe.
  • doodle.js http://lamberta.posterous.com/doodle-js and https://github.com/biilly/doodle-js
  • artisan.js http://artisanjs.com/ and https://github.com/davidbrooks/Artisan
  • sprite.js https://github.com/batiste/sprite.js
  • https://github.com/dkln/canvas_library
  • gury https://github.com/rsandor/gury – Works with jquery
• Javascript diagramming/flowchart libraries
  • See this question on quora: http://www.quora.com/What-JavaScript-libraries-are-recommended-for-building-simple-to-complex-interactive-diagrams
• New game libraries
  • http://craftyjs.com/
  • http://code.google.com/p/jgen/
  • https://github.com/RyanWilliams/cocos2d-javascript
  • http://gamejs.org/
  • more: http://sites.google.com/site/html5gamejam/engines
• Gesture recognition libraries
  • http://depts.washington.edu/aimgroup/proj/dollar/
  • http://depts.washington.edu/aimgroup/proj/dollar/ndollar.html
  • https://github.com/raganwald/iGesture
  • https://github.com/plainview/Jester
  • icon library to indicate gestures: http://gestureworks.com/features/open-source-gestures/
• Browser-based IDEs
  • The Cloud9 IDE is under heavy development, and they’ve now opened up beta access to the hosted version of their javascript (node.js) based development environment.  Their Ace editor component is available now as a separate project, as well, which has combined with Mozilla’s skywriter editor project.
  • In June or so, look for an initial release of a web-based version of the Eclipse IDE, codenamed Orion
• 3D Multiuser World
  • It has long been a holy grail of the edtech world to have a multi-user virtual world for students and teachers to use.  There already is Second Life (and it’s mono-based open source clone OpenSim) and Open Wonderland (java-based), but now with WebGL, it’s possible to create such a thing that works in the browser, and Katalabs has done so, releasing a prototype of their open source virtual world software called Kataspace.  Requires a recent version of firefox or chrome – see the Learning WebGL site for more info on WebGL.
• BASIC in the browser
  • Some various compilers/editors for basic or visual-basic like languages that work in the browser:
  • Pex: http://www.pexforfun.com/Page.aspx#learn/
  • qb.js: QBASIC in the browser http://stevehanov.ca/blog/index.php?id=92
• Smalltalk/Squeak in the browser
  • http://chirp.scratchr.org/dl/experimental/JsMorphic/morphic.html
  • https://github.com/AdamSpitz/lively-kernel-official
• Proper
  • http://quasipartikel.at/proper/
  • Proper is a semantic text editor that works in the browser.  See also other related libraries like substance, data, and unveil: https://github.com/michael
• Real-time Collaboration/Editing
  • IBM just announced the Open Cooperative Web Framework, which uses Dojo and other libraries for real-time collaboration in the browser.  Targeted for things like collaborating during a conference.
  • Tutto is a real-time collaborative javascript shell, using websockets: http://tobyho.com/Tutti_-_Multiple_Browser_Interactive_Javascript_Shell
  • Realie is a web-based real-time collaborative editor, similar to etherpad.  Unlike etherpad, it is coded with node.js and websockets: http://laktek.com/2010/05/25/real-time-collaborative-editing-with-websockets-node-js-redis/
  • Here are some other browser-based collaborative real-time editors: http://en.wikipedia.org/wiki/Collaborative_real-time_editor#Browser-based
• Java Projects
  • These are not javascript at all but I thought I’d share them:
  • Visage http://code.google.com/p/visage/ open source port of JavaFX, which declarative markup for creating user interfaces
  • Openxion http://code.google.com/p/openxion/ Openxion is a java-based port of Hypercard (more accurately, hypercard’s language hypertalk).  It is a command-line tool, it doesn’t support the graphical stuff (cards, etc.) hypercard did.  Interestly, when javascript first came out it was touted as a ‘hypercard for the web’, but really it isn’t even close to what hypercard could do.
• Wireframes and Mockups, Sketches
  • There are several new browser-based tools for visually designing interfaces (fake interfaces), some of which are HTML5-based or else Flash: http://speckyboy.com/2010/01/11/10-completely-free-wireframe-and-mockup-applications/
  • Some open source ones include: http://www.k-sketch.org/ http://www.mdaines.com/plumb/ http://dub.washington.edu:2007/projects/sketchwizard/
• OpenSocial/widget development tools
  • Socialtext has an HTML5 widget builder: http://www.readwriteweb.com/enterprise/2010/12/socialtext-introduces-html5-ba.php
  • Exo is a competitor to Socialtext, and they also have a web-based IDE: http://exoplatform.com/company/en/resource-viewer/Video-Demo/building-web-app-with-exo-platform-3-ide
• Others
  • UJam is a site that lets you put together or record your own music from inside the browser: http://www.ujam.com/
  • and of course there are several other html5-based ‘web 2.0′ tools for creating other stuff in the browser, like Aviary for image editing: http://www.aviary.com/

Here are some android tips & resources I’ve run across in the past year:

• How to root the Droid (the first droid)
• How to root the NookColor
• How to read library e-books on an android tablet – right now the only official way is to use Adobe Digital Editions (ADE, which only runs on windows or mac) and use a device that ADE supports, such as the NookColor or Pocket Edge.  Here’s an ADE video tutorial.
• If you’ve got an older android phone or tablet with only a few screens, I’d recommend LauncherPro or a similar app to improve your home screens.  See this comparison between LauncherPro and other options like ADWLauncher.
• Keeping up with android news: See this twitter list for various sources like androidcentral: http://twitter.com/#!/edtechdev/android
• Places to find recommended, popular apps
  • AppBrain
  • Lifehacker’s list of top apps by category
• Open source apps – see these lists of open source apps and open source games (you’ll have to google to find the actual source though).
• Android development
  • AndDev
  • App Inventor

Some free educational apps:

• X Construction Lite – bridge building game
• Google Sky Map – shows the names of stars, planets, constellations that you point at, using the accelerometer and compass
• There are apps or android-friendly mobile front-ends for Blackboard (requires university subscription) and Moodle (see also http://mle.sourceforge.net/ and http://code.google.com/p/moodbile/)
• Video podcasting is possible with apps from Qik or Ustream viewer or broadcaster
• Physics: space physics lite, space simulator, physics calculator
• Musical instruments: mypiano, guitar solo lite
• Programming: IProgram, scripting layer for android, ruboto
• Various math practice apps like Math Workshop or Math Attack
• Of course there are all the e-book reader apps such as Aldiko, Nook, Kindle, …
• See also AppBrain’s education section and this list of 101 best android apps in education
• See also the IEAR site for many educational apps, but they are mostly iphone/ipad apps at this point.

Some free games:

• angry birds, of course
• minisquadron
• hungry shark
• falling ball
• sliceit
• hit the penguin
• air attack
• hyperspace
• my paper airplane
• toss it
• winds of steel
• flying high

Here’s a taste of the current tools and frameworks out there for developers interested in learning more about this platform.  Probably the first thing you have to decide though, is are you more interested in running your HTML5 app on mobile phones and tablets (iPhone and iPad’s iOS, Android, and to some extent Blackberry and Palm), or in a regular desktop browser (Firefox, Chrome, Safari, IE…), or both?  Some tools for mobile web app development are listed below.

Keeping Up with the HTML5/Javascript/CSS Universe

First, here are some places to keep up with this rapidly evolving field:

• http://twitter.com/edtechdev/html5 – A list of folks and organizations that develop javascript & html5 related things
• Learning WebGL – for keeping up with 3D developments
• Some discussion groups: http://groups.google.com/group/iphonewebdev , sitepoint forum, codingforums, etc.
• The Changelog – They have a regular podcast which often features interviews with developers of HTML tools such as some of the ones listed below (Sencha Touch, Coffeescript, etc.)
• There are several other javascript and css and html5 news sites and blogs out there, too, such as Badass Javascript.

General Javascript Application Frameworks & UI Toolkits

• JQuery – most popular and almost universal javascript framework.  It lets you ‘select’ elements in the DOM to operate on, in a very functional way. See numerous jquery tutorials, books and plugins and jquery.ui.  Has a little mobile support (touch/swipe).
• YUI – very java-like user interface toolkit from Yahoo, very complete and accessible.  They have started adding mobile support (touch/swipe/etc).
• See this comparison of javascript frameworks for others such as Sproutcore, Dojo, qooxdoo, mootools, etc.  Some other frameworks listed on that page actually involve coding in Java (or another language) which is converted to javascript, such as GWT and pyjamas.
• JS Optimizers – to compress/obfuscate and combine into one file your js code see Google Closure Compiler, YUI Compressor, JSMIN
• Mobile application frameworks – these frameworks are specifically for creating mobile applications (iphone/ipad/android) using javascript/html5, although usually that doesn’t include the canvas yet, and also unfortunately most of their demos work ONLY on mobile platforms, not on the desktop.  The main problem is that on the desktop with a mouse you can click and drag and drop, whereas on mobile/tablets with no mouse you touch and swipe and so forth instead. One decision you also need to make is, do you want to access native elements of the mobile platform (like camera, tilt sensor, etc.).  If so, see the first two options (PhoneGap and Appcelerator).  The latter options often work with PhoneGap, too.
  • PhoneGap – has an open source permissive license. They support Blackberry and Palm and Symbian and so forth, as well as iOS and Android.  They create a native webview wrapper for your HTML5 app, so that you can access native things such as the camera or sensors.
  • Titanium from Appcelerator – also has an open source permissive license, for fast, native mobile apps developed with javascript/html5 that can access native sensors and so forth, too.  See their kitchen sink demo and other demos.
  • Sencha Touch – built off of ExtJS and JQTouch – any app you develop with it either needs to be GPL or else you have to pay for a commercial license from them.  Can work with PhoneGap, they have some nice demos, esp. for the iPad.
  • Ansca Mobile – Corona SDK, better for game development, commercial license.
  • appMobi – commercial, too, I believe
  • Rhomobile – you actually develop in Ruby and it converts it to a javascript/html5 mobile app

HTML5 Canvas & Javascript Drawing / SVG Libraries

There are hundreds of html5 canvas demos out there if you search around.  Again, unfortunately many canvas demos do not work as well on mobile or tablet platforms, or lack interaction support (drag or swipe or whatever).  The harmony demo listed below is one exception.  Android 2.2 will incorporate a much faster v8 javascript engine from google, and future versions of the webkit browser used by most mobile/tablet devices will hopefully add support for 3D with webgl, too.  See the WebGL / game development stuff in a later section below.

• Canvas tutorials
  • Create a drawing app with html5 canvas and javascript
  • Creating a bar graph, part 1
  • interactive canvas tutorial
  • dive into html5 – canvas – book chapter
  • canvas kitchen
• ProcessingJS – nice drawing library and development environment for creating animations and visualizations.  This is a port by John Resig, inventor of JQuery, and others of the original java-based processing library to javascript.  There are numerous sites that let you code your processingjs program from within your browser (see “browser-based IDEs” below), such as hascanvas and jsdo.it.
• canto.js – improved canvas api, very jquery-like, includes some turtle graphics (logo-like) commands.  See also this turtle graphics in javascript page.
• ExCanvas – for making canvas work in internet explorer (IE 9 will support it I believe)
• Raphael – Javascript SVG, vector graphics, library – very nice demos
• RGraph – graphing library
• flot – javascript plotting library
• bluff – graphing library
• Javascript InfoVis Toolkit
• three.js – canvas-based 3d engine (not using webgl as the ones below)
• Painting/Sketching demos
  • Harmony – by mrdoob, who also created the above three.js.  This is a very nice demo which also works on mobile/tablet platforms, with touch support.
  • Canvas Painter
  • sketchpad

Alternate Languages/Parsers/Class systems for Javascript/CSS/HTML

As I mentioned in the previous post, one potential downside of the HTML5 platform (at least from a beginner’s perspective), is that you are stuck with the javascript language (as well as HTML and CSS).  Well, that’s not always the case now.  There are alternate languages that compile to javascript (like coffeescript) or css (like Sass and Compass) or even HTML (like HAML).  Javascript, in a sense, is the new C.  Many of the types of tools we used to mainly see in Java-land are also now available in javascript, such as parser generators.

• Coffeescript – alternate language that compiles to javascript.  It is still mostly like javascript, but adds some things that make your code much more concise.
• Sass and Compass – alternative to CSS – adds some smarter features to CSS like variables and so forth
• HAML – alternate to HTML, not as popular perhaps, or as needed as the above two, since there are 2000 HTML WYSIWYG editors out there.
• Javascript parser generators – if you want to create your own DSL or language:
  • jison – used by coffeescript
  • PEG.js
  • canopy – ties you to his ruby-like JS.Class library
  • ANTLR‘s javascript target – not so lightweight, but has a lot of advanced functionality and features, such as being able to create better error messages
• Actionscript to javascript – see Jangaroo and Gordon
• If you want a more ruby or java-like class system (inheritance, traits, mixins, design by contract,etc.) to use rather than javascript’s built-in prototype object system, see:
  • Joose – See their Blok demo designer app too
  • JS.Class which I mentioned above
  • traits.js – trait library (see also jstraits). Joose supports traits, too.
  • base2 – older class library
  • Prototype, mootools, qooxdoo, and some other javascript frameworks also come with their own class system.

Server-Side Javascript

Javascript is no longer a language that only runs in the browser.  It has become a first class language for the server / desktop, too.   Just run “node myscript.js” for example like you would any other kind of script on a server or linux box.  Coffeescript works with node.js on the server or desktop, too.

• node.js – Uses Google’s fast V8 javascript runtime.
• narwhal – an alternative to node.js
• CommonJS – a standard library for javascript, mainly meant for the server-side at this point.  node.js and narwhal implement commonjs.
• npm – a package manager for node.js, similar to gem for ruby
• I’m still waiting to see a drupal-like content management system built all in javascript.
• Jake – a build tool for javascript (like make, rake, etc.)
• WebSockets – a new HTML5 feature that allows for better persistent server-client connections.  You’ll find some demos around of multiplayer games and web pages that use websockets, and on github there are node.js websocket server examples.  You need the Chrome browser or Safari or  Firefox 4 beta.
• ExpressJS – server-side web application framework

Javascript Game Development, 3D & Physics Engines

Further evidence that javascript is the real deal, you can do 3D and interactive games with it.  To run the WebGL stuff you’ll need a recent build of the Chrome (or Chromium) browser or Firefox, see the Learning WebGL FAQ section.

• Spritely – nice sprite engine
• gameQuery – 2D engine
• Akihabara – for creating arcade-like games
• jsGameSoup
• Copperlicht – WebGL 3D game engine
• GLGE – another WebGL game engine
• SceneJS – WebGL scenegraph library, see also the interactive, editable demos
• C3DL – Canvas 3D library
• Dextrose Aves Engine – commercial game engine in development, see this video talk
• tinygames – see their work (building off of karma edu and so forth) to create educational html5-based games (math only apparently).
• Physics Engines & Demos
  • bullet.js
  • Box2DJS
  • JibLibJS
  • box2dnode
  • cloth simulation

Browser-based Development Environments

• See my earlier post Browser-Based IDEs, but also these:
• jsdo.it – Has built-in support for javascript libraries such as processing, jquery, etc., and you can share/fork/rate code.  jsFiddle is a similar tool.
• http://sketchpad.cc/ along with hascanvas and others work with processingjs for creating animations
• I mentioned it in the previous post, but the bespin editor continues to evolve and improve.  It now supports code completion using jsctags.
• GUI Designers – really nothing out there that is finished and free and open source (see Ext Designer for a commercial option), other than of course free WYSIWYG HTML designers, but see these rough demos:
  • Opus-js – see the composer demo
  • Blok – rough demo for Joose, runs on google app engine

See Jim’s Linux on Netbooks instructions on how to setup such a netbook program for your school.  Jim also has shared various presentations and other resources related to the program.

Karl Fisch blogged about how he implemented a variation on Jim’s program.

By the way, if you are in the market for school netbooks, or suffering from iPad envy, you might check out the $500 Eee PC T101MT touchscreen netbook, described in this liliputing post.  It’s been reported to work perfectly fine with the latest version of Ubuntu (10.04, Lucid Lynx, due out later this April).  Students can draw notes and pictures on the device (with a stylus), plus it has USB ports and a webcam, unlike the iPad.

The PHET project, for example, uses both java and flash. These haven’t always been the main options, however, and I suspect it will change again in the near future. Here’s a short history of some of the development tools I’ve leaned on for educational software development over the past 15 years:

• early 90s – hypercard / supercard, Perl/CGI for web apps
• late 90s – java, visual basic, real basic, PHP emerges for web apps, javascript in the browser
• early 00s – by this time, commercial options no longer cut it for me, too many bugs, ignored feature requests, too expensive, vendor lock-in – free and open source is king: python, java (later open sourced), C#/vb.net (esp. the Mono open source clone). Unfortunately there is no alternative to the commercial, proprietary flash, which becomes king of RIAs (rich internet applications) instead of java applets.
• late 00s – by this time, desktop apps no longer cut it. RIA is king for creating interactive graphical educational apps – java and JVM languages like scala, and still no real alternative to flash (there is javafx, but it hasn’t largely caught on yet, and just about all the demos so far require you to download the app (JNLP) rather than run in the browser, despite support for JNLP applets). The move to RIA means no more Mono/.NET since it doesn’t run in the browser – support for silverlight is weak/non-existent on many browsers/platforms. And no python, although perhaps one day browsers will support it as an alternative language to javascript. I’m not holding my breath on that though. Mono/.NET is emerging again now in 3D virtual world space, however, because it is the basis for Second Life / OpenSim, and its only open source competitor, the java-based Project Wonderland is no longer supported by Oracle, who bought out Sun. The project is continuing outside of Oracle, but it’s future is unclear.
• early and late 10s? – This is the question of this post. Mobile platforms can no longer be ignored, and that means no java. Actually android is essentially java (dalvik), but standard java applets do not work. Flash is only just now being ported to work on android, and it may become available for the iphone as well, although Apple is hostile to it (as well as java). Since google doesn’t support browser applets (even android applets), and Apple wants total control of their platform, Flash is only increasing its dominance and importance.

HTML5

Since Oracle bought out Sun, and there is no support nor any planned support for java on the android and iphone platforms, it appears the only open source alternative for the future of RIA apps may be HTML5. But that cannot be used for creating the kind of highly interactive graphical educational software that you can create in java and flash. For this to work in HTML5, it would require WebGL, a 3D (OpenGL ES) canvas for HTML5. WebGL still does not work out of the box on any mobile platform, but it has been or is being ported to work on WebKit (the browser engine for Palm’s WebOS and the iphone web browser) as well as android. Currently, to run WebGL you need to grab a nightly build of Firefox, WebKit, or Google Chrome (I’m trying out the last one). Official builds will have likely have built-in support for WebGL come November 2010 or so perhaps (Firefox 4). Here are some more resources on WebGL:

• Learning WebGL – blog
• Vladimir Vukićević, blog of the main developer for the canvas control, and porting it to android. He did similar work on the mono platform earlier.
• Planet WebGL – aggregator
• Blender to WebGL exporter
• Copperlicht – sample 3D engine for WebGL
• WebGL Wiki – User Contributions (other libraries)
• O3D is an open source google project (they also support WebGL), that is essentially a 3D canvas with a more javascript-friendly API. It seems to be better for static 3D scenes with less interactivity. It is also NOT supported on android or other mobile platforms.

The main drawback to the HTML5 platform is that javascript is the only language supported. That’s not a problem for me, personally, I’ve been using javascript since when it was called livescript. But my interest also is in programming languages/tools that make it easier for students, teachers, and other non-CS types to develop interactive educational software, as discussed in this chapter (pdf). A workaround for now would be to create a to-javascript compiler for alternate languages, as has already been done for java with the GWT project (which has various WebGL controls in development: WGT, GWT-G3D, GWTGL, GWT-WebGL), but in the long run it would be best if a common runtime were developed for WebKit and Firefox to support other languages than javascript, but then we are just re-inventing java and the JVM. So I don’t dismiss the java platform at all just yet, but it’s definitely not having a good year so far

There was some software I had to change when I made the switch, but I was planning to do so anyway. For data analysis instead of SPSS, I learned R, which is more powerful (see these notes for getting R and a GUI interface installed on Ubuntu). I had to find a different tool to make screencasts. Luckily they are all free in Linux. I used gtk-recordmydesktop, but there are also Istanbul, WebcamStudio, and others. For music instead of Winamp there was the winamp-clone xmms (and now Audacious). Of course there are itunes alternatives too. Wine can be used to run any Windows-specific software, including games. Second Life has a Linux version that works just fine, too, and Adobe AIR applications like Tweetdeck, Thwirl, and Seesmic Deskop work just fine. All web-based applications from Youtube to Google Apps to whatever work great in Firefox – you can install the latest Adobe Flash and Sun Java 6 plugins too.

The only reasons I’ve been still booting to Windows occasionally now are to make screencasts that show how to do things in Windows (which most students are using), and also to use the Wimba whiteboard/chat application that our university uses. Wimba is a Java applet-based application and should work on Linux fine, but it runs a “check my system” test first which complains and fails.

Also, our university stopped its proxy server that I was using to get off-campus access to journal articles in favor of a VPN instead that doesn’t work in Linux, but now I just use an ssh tunnel to campus instead which works just fine (see these instructions for ssh tunneling).

I didn’t have time to hyperlink everything – you can google to see the various tools in more detail.

• Learning Management Systems
• Moodle (PHP)
• Sakai (Java)
• Web-based application frameworks
• Rails (ruby)
• Grails (groovy)
• Turbogears, etc. (Python)
• Cake, Symfony, etc. (PHP)
• JSP, Struts, Velocity, Tomcat, etc. (java)
• ASP.Net (.NET/Mono)
• Cloud computing services
• Google Appengine (Python, Java)
• Amazon EC2
• Sun cloud
• Content management systems
• Drupal (PHP)
• Joomla (PHP)
• Plone (Python)
• DotNetNuke (C#, .NET/Mono)
• Browser-based Ajax/Javascript frameworks
• GWT
• JQuery
• Mootools
• Browser applets
• Flash/Flex
• JavaFX, Java
• Silverlight (.NET) Moonlight (Mono)
• 3D multi-user virtual worlds
• Second Life / OpenSim (.NET/Mono)
• Project Wonderland (Java)
• Croquet (squeak/smalltalk)
• O3D (Javascript, new from Google)
• 3D games
• Java – JMonkeyEngine, JOGL, LWJGL, etc.
• C/C++
• .NET – XNA
• 2D games/simulations
• Netlogo, Starlogo, Repast (Java)
• Pulpcore (Java)
• Processing (Java)
• PyGame (Python)
• Cell phone applications
• Android (uses java-like language and runtime by google)
• iPhone (apple)
• JavaFX mobile
• Java ME
• Desktop applications
• .Net/Mono System.Windows.Forms
• Java Swing
• C/C++ – GTK, QT
• Python – PyGTK, wxPython, etc.

This summer I’m also teaching a course on Internet Development – beginning web development. All the materials and video screencasts are being posted online as well. I’m trying a new style of teaching web design. CSS is taught much earlier (in the 3rd week), tables much later. I’m using a more powerful text editor (JEdit) and Firefox addon (web developer) instead of the traditional notepad lessons. JEdit helps scaffold the process of authoring HTML and CSS files. Lastly, during the last month of class starting in late June we are going to learn about content management systems (in particular, Drupal). I’ve been building websites for 15 years starting with a site in 1995 for my student Amnesty International group that included a Perl CGI script to support letter writing, and in 1996 the Amnesty International USA site. But over the past 10 years pretty much every site I’ve built has used a content management system, starting with PHPNuke and later PostNuke, TikiWiki, and now Drupal. So I think it’s fitting to introduce students to content management systems even in a beginning class so that they are prepared to create real websites for some organization, business, or school.

I’ve put the materials for every course I’ve taught online, starting with a simple wiki outline for a survey class on computer applications such as iMovie, Dreamweaver, and Photoshop to my Advanced Learning Design course in Moodle (login as guest).

Related to all this, I’m helping a student finish up a dissertation exploring the motivations for why faculty at MIT put their courses online in opencourseware. Actually though, faculty have been putting their courses online on their own websites or using wikis like wetpaint or pbworks or wikispaces for many years. Below are some reasons for my own decision to put my course materials online:

• It sticks around for students and others to review later. In Blackboard and other traditional learning management systems your stuff disappears shortly after your class is over. I don’t really take to the philosophy that students should have to memorize everything for a test. They’ll forget it soon afterward anyway (see this five minutes university bit by Father Guido Sarducci).
• Re-use is easier. I can review a previous year’s class materials and revise them without having to start from scratch.
• Posting publicly online and using blogs I believe makes assignments more meaningful to the students and to myself. You aren’t just writing a paper for the instructor, but for everyone else to see as well.
• I can improve the materials on the fly, or post stuff before the whole class is finished. In traditional opencourseware, you don’t put your stuff out in the public until all the materials for the whole course are completely designed.
• It’s difficult to get people to observe your course for peer review and feedback. Even more difficult when you are teaching online. Members of my tenure committee and others can review my teaching materials much more easily when they are publicly accessible online.
• No one else is doing it in your area. There is no other open course out there on learning design or educational technology, and not even on internet development (except for some wikiversity notes). Of course there are thousands of HTML and CSS and Drupal tutorials and videos online, but this way I can organize them all or create new resources for one integrated course.

Btw, we are using a tweaked version of the creativecommons_lite Drupal module so that all wiki pages and blog posts on our site default to use a creative commons open license. But interestingly I’m already seeing students on their own pick other licenses for their blog posts. One student made a post public domain, another made it all right reserved, etc. Other faculty in my department are getting onboard as well, using Drupal as a blended learning support tool for their courses, and/or posting news and wiki pages to our site. We even used the wiki to work on a forthcoming article for Educational Technology magazine about our department, which is unique in that it combines both learning sciences folks and folks with a background in instructional design / instructional technology.

1. One platform option is digital pens such as Livescribe, IOGear, and ZPen. You draw your notes on regular paper, and the pen records the notes. You can transfer the digital notes to a computer in various file formats. These pens range in price from $65 to $200 and have various file formats and developer platforms. Livescribe’s software API for example is java-based. The advantages of this platform are the cost – they are cheaper than laptops although the livescribe is still quite expensive. The Livescribe pen also requires printing their own special paper with micro dots used for tracking the pen position. Other pens like IOGear use a triangulated sensor attached to the corner of the sheet of paper or pad. Another issue though is the workflow. Students still need access to a computer of some sort to upload the notes, and some custom software for doing so.

2. Another platform is the PDA, such as a Palm or Windows CE machine. These aren’t as popular as they used to be, with folks moving on to more expensive devices such as the iPhone, Google G1 Android phone, and the Blackberry. There is a mobile version of Microsoft OneNote available, which is software for notetaking.

3. A third platform is to use a regular laptop or netbook, plus a separate tablet drawing input device attached, such as a Wacom Bamboo tablet (starting from around $50-$60). This is a clunkier option, but doesn’t add much cost if a student already has a laptop. There is the regular version of Microsoft OneNote one could use, or the free and open source Jarnal notetaking program, developed in Java.

4. A fourth option is one which I hope is the next phase in netbooks. These are netbooks with touchscreen interfaces – basically cheaper tablet pcs. The Classmate PC and its derivatives are in this class ($500-$600), as is the new Touch Book (due to be released this summer for $300-$400, pictures here). The Touch Book especially looks very interesting, except one issue is that it doesn’t run regular Ubuntu or Windows – it uses an ARM processor that can run Android or Ubuntu Mobile. It’s essentially a big cell phone minus the phone. I don’t know if Jarnal would run on it or if there is alternative free and open source notetaking software that runs on Android or Ubuntu Mobile. There are some Android note taking applications listed here.

The latter two options though especially could be developed using open source platforms and software, and are completely paperless, unlike the digital pen options. The students can take and upload and share their notes while in class or online, instead of having to manually transfer and upload notes from digital pens. Of course the best solution would be a platform that would work with all 3 of the latter platforms mentioned, including smart phones such as the G1 which runs Android.

Anyway, I very likely will be ordering a Touch Book this summer and will post back here with some notes then.