HTML5Demos
Contents
HTML5 Demos
NeXT Steps
here everything has yet to be done !
coming soon :
List nice pages using HTML5/CSS/JS Technologies
See also
- HyperText
- HTML
- HTML5
- HTML5 Gaming
- HTML5 Demos
- HTML5 Tutorials
- xHTML
- XML
- JSON
- CSS
- CSS3
- JavaScript
- JavaScript Frameworks
- Cordova, a framework previously know as PhoneGap
- Web Blogs
- Web Browsers
- Web Hybrid Apps
- Web Native Extension and plugins
- Web Formats
- Web Technologies Reference
- Web APIs
- Web Tools
- Web Presentation Tools
- Semantic Web and Data Web
HTML5 Demos
- CSS Filters effects : http://html5-demos.appspot.com/static/css/filters/index.html
- more demos: http://html5-demos.appspot.com/
- labSimurai: toggle CSS http://lab.simurai.com/css/stars/
- more demos: http://lab.simurai.com/
- GamePad API Demo : http://robhawkes.github.com/gamepad-demo/
Audio/Video
- webm demo : http://html5-demos.appspot.com/static/media-source.html
- google web cam toy: http://webcamtoy.com/
* cameara xylophone: http://www.soundstep.com/blog/experiments/jsdetection/
- going fullscreen: http://html5-demos.appspot.com/static/fullscreen.html
- Bohemian Rhapsichord: http://static.echonest.com/BohemianRhapsichord/index.html
- Sound Toy: http://www.iquilezles.org/apps/soundtoy/index.html
WegGL:
- webGL City : http://alteredqualia.com/three/examples/webgl_city.html
- Wave Form : http://airtightinteractive.com/demos/js/reactive/
- Rome : http://www.ro.me/alternate?case=3
- mr Doob : http://mrdoob.com/138/Kinect
- the wilderness downtown : http://www.thewildernessdowntown.com/
HTML5 Demos and Examples site
HTML5 blogs
HTML5 Performances
- [| the-making-of-fastbook-an-html5-love-story]
- Fastbook, a sencha app competing with facebook app to acess facebook
Note: By making it Fastbook Application Sencha has shown that one can build an application with performances but Sencha also demonstrated how the UX design can be tied to one platform performances.
Actually UX Design is also about taking advantage of strongnesses and avoiding weaknesses of one platform, but to achieve that UX design must work with Engineers else they would ignore about weakness and strongnesses inside a platform.
Sometimes it can also consist of not trying to design something that is simply impossible to implement on a given platform with correct performances or technically impossible.
Facebook wanted to keep its original web site based design, so browser based designed, using only one web page. In order to keep one single user experience so users would not be confuse.
Troubles in designing UX starts once we want to keep a single user experience across several platforms, without having took the time to consider weaknesses and strongnesses of each targeted platform.
Sencha in its Fastbook UX design uses several web views. Doing this they changed the UX Design with the benefit of having several web pages, that is, several web pages caches. By having several web page caches they can finely tune how they managed them, and how and when caches are reset. In doing this they can also keep a previous view state when they are re-showing it, while the Facebook application have to restore the whole view including re-downloading data.
This is also demonstrating how web page cache performance can be different from one platform to another - iOS is looking better than Android.
I tried the Fast book application on an iPad 1 and I did not found that the performance were so good comparing to the Facebook web site (the Facebook application is crashing...) - The iPAD 1 is having less RAM to operate and so it is less likely to be able to keep in memory several web page caches
This bring another aspect of UX design: witch platform are we targeting? What are their capabilities? Do we consider that an application have only to work on the more recent hardware? Do we consider we ant to keep some descendant compatibility?
Web Demo Catalog
- https://developer.blackberry.com/html5/download/roadmap/
- https://developer.mozilla.org/fr/demos/
- http://www.apple.com/html5/
- http://www.html5rocks.com/en/
- http://fabricjs.com/demos/
- http://www.vectorskin.com/referentiels-standards-w3c/balises-html5/
- http://raphaeljs.com/polar-clock.html
Web App Demo Catalog
- https://developer.blackberry.com/html5/sampleapps/
- https://01.org/html5webapps/
- Fastbook, a sencha app competing with facebook app to acess facebook
Web App for Web Browser
- Web Office : http://html5.teamlab.com/
- Web Online Music Cloud Editor: http://www.noteflight.com/login
- Web HTML5 GUI editor: http://maqetta.org/
- Web Painting tools:
* sumopaint: http://www.sumopaint.com/www/ * WebInPaint: http://www.webinpaint.com/
- ScribLink: http://www.scriblink.com/
- WebCanvas: http://webcanvas.com/#2476,-2006,1
- Sketchfu: http://sketchfu.com/
- Scirbbls: http://www.scribbls.com/
- Pictaps: http://roxik.com/pictaps/index.html
- Twitpaint: (Intel IT is preventing from acceding this site...) http://twitpaint.com/
Queecky: http://www.queeky.com/
- Web Drawing:
* http://mudcu.be/sketchpad/
- Web Paint and draw:
* fatpaint: http://www.fatpaint.com/en/free_online_photo_editing_graphic_design_software/free-graphic-design-software-paint-draw-online-image-editor
- Web Photo Editing:
* http://pixlr.com/editor/
- Pearls Tree:
* http://www.pearltrees.com/#/N-u=1_88138&N-p=11724733&N-fa=977848&N-f=1_1656856&N-s=1_1656856
- Adobe:
* PhotoShop : * http://www.photoshop.com/ * http://www.photoshop.com/tools
