In Coding Projects | 30 May 2013 | Laisser un commentaire
With this prototype, on desktop browsers you can move around the 3D CSS clock model with your mouse. On mobile browsers, rotation is triggered by the mobile orientation …
Crédit : The original code to 3D rotate a CSS box is taken from there : http://www.laplace2be.com/projects/phone/
On my HTC One S with Chrome browser and Firefox browser…

Here on your PC…
Some others infos here :
http://www.b2bweb.fr/molokoloco/pixels-polished-jquery-css3-analogue-clock/
In Molokoloco | 23 Mar 2012 | Laisser un commentaire
Exploring the web i found this little experiment by @felixturner
It use the audio API and Three.js, for a real time 3D sound visualization
My remake is here : http://www.b2bweb.fr/bonus/Braincer/
In Shared Items | 20 Apr 2011
Nokia a mis à jour son service de cartographie gratuit en ajoutant la possibilité de se balader dans vingt villes modélisées en relief de manière réaliste.
Le géant finlandais de la téléphonie vient de lancer Ovi Maps 3D en version beta. Son service de cartographie gratuite similaire à Google Earth et Bing Maps vient de se doter de vues en 3D très réalistes. Ces images impressionnantes des bâtiments et des arbres couvrent une vingtaine de métropoles aux Etats-Unis et en Europe. On peut ainsi se balader et zoomer dans les villes de San Francisco, New York, Toronto, Miami, [...]
In Shared Items | 4 Mar 2011
Firefox 4 is almost here. Check out some awesome Web demos on our brand new demo web site: Web’O Wonder. Screencast here.
Firefox 4 is almost here, and comes with a huge list of awesome features for web developers.
In order to illustrate all these new technical features, we put together several Web demos. You’ll see a couple of demos released every week until the final version of Firefox 4. You can see the first 3 demos online now on our brand new demo web site: Web’O Wonder
Note: Some of these demos use WebGL, and will work only on compatible hardware. Make [...]

Unity — the popular 3D game development tool — has announced that its Unity Android and Unity Android Pro tools are now available for download. So what’s the big deal? The tool allows developers who have used Unity to create games for other platforms — including iOS — to port them to Android with “one click.”
Loads of popular games have been created using Unity, and some have already been ported using Unity Android — Samurai II: Vengeance and Drift Mania Championship, for example. “We were very impressed with how simple it was to port our iPhone game Drift Mania[...]to Android. The [...]
In Molokoloco | 27 Feb 2011 | 1 commentaire !
WebGL (Web-based Graphics Language) is a cross-platform, royalty-free web standard for a low-level 3D graphics API based on OpenGL ES 2.0, exposed through the HTML5 Canvas element as Document Object Model interfaces.
WebGL brings plugin-free 3D to the web, implemented right into the browser. Major browser vendors Apple (Safari), Google (Chrome), Mozilla (Firefox), and Opera (Opera) are members of the WebGL Working Group.
The specification is since 18 February 2011 in Final Draft (1.0) stage. WebGL is managed by the non-profit Khronos Group
Developers familiar with OpenGL ES 2.0 will recognize WebGL as a Shader-based API using GLSL, with constructs that are semantically similar to those of the underlying OpenGL ES 2.0 API. It stays very close to the OpenGL ES 2.0 specification, with some concessions made for what developers expect out of memory-managed languages such as JavaScript.
WebGL frameworks list (Khronos wiki page) : C3DL, CopperLicht, EnergizeGL, GammaJS, GLGE, GTW, O3D, SceneJS, SpiderGL, TDL, Three.js, X3DOM, WebGL Google Web Toolkit bindings, OSG.JS
And some cool demos and sources here and here !!!
Khronos WebGL home : http://www.khronos.org/webgl/
/** * Creates a webgl context. * @param {!Canvas} canvas The canvas tag to get context * from. If one is not passed in one will be created. * @return {!WebGLContext} The created context. */ var create3DContext = function(canvas, opt_attribs) { var names = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"]; var context = null; for (var ii = 0; ii < names.length; ++ii) { try { context = canvas.getContext(names[ii], opt_attribs); } catch(e) {} if (context) { break; } } return context; } |
In Shared Items | 23 Feb 2011
Shared by molokoloco
Je retiens bien celui-ci !
gameQuery : A jQuery plug-in which helps building JavaScript games with the help game-related classes offered.
It features multi-layer sprite animations (with hierarchy support), collision detection, sound, keyboard state polling and periodic callbacks.
As JavaScript-HTML5 development is getting more popular and browsers supporting new features are being utilized by more users everyday, -as expected- many new games are being developed with JavaScript.
JavaScript-powered games are not only easier-to-develop for web developers but they [...]
In Shared Items | 23 Feb 2011
For some time now I’ve been working on a Sencha Labs project to build a WebGL framework and today I’m very proud to release it. It’s called PhiloGL and it’s intended for advanced data visualization, creative coding and game development.
WebGL has been in development for a few years, and although the raw API’s are powerful, they’re also very low-level. This makes doing WebGL development tough for the average JavaScript developer. The goal of PhiloGL is to make WebGL programming as fun and easy as developing with any of the mainstream frameworks. PhiloGL uses cutting edge [...]
In Coding Projects,Molokoloco | 20 Feb 2011 | 1 commentaire !
Radiohead + JavaScript + Canvas = ~(*_*)~
http://www.nihilogic.dk/labs/canvas_music_visualization/
Sur le site vous trouverez aussi d’autres trucs excellents…
Comme par exemple…
Nb : “Finally, my HTML5 audio project Pocket Full of HTML5 had lost its support of the new HTML5 audio data api, so it used the SoundManager2 fallback even when using a audio-data-enabled Firefox build. Again, the problem was due to changes in the API, which is still very early in its development“
Vu sur le net… d’autres expériences notables :
On peut aussi construire directement ses propres effets (Shaders et Vertex) avec les éditeurs en ligne…
PS : Firefox beta 4 ou Chrome 9 requis
PS2 : Technical explanation of the html5-audio-data-api
PS3 : Mais pourquoi vit-on dans un monde en 3D ?
In Shared Items | 30 Jan 2011
Shared by molokoloco
o_O http://www.iquilezles.org/apps/shadertoy/ (Load Presets)
J’ai pas compris le code, mais ça claque ! ;)
One of the things WebGL will bring us is Fragment Shaders. If you’re familiar with Pixel Bender you know how Fragment Shaders work.
Although they usually go with Vertex Shaders, you can set it up for doing just 2D effects with it. Iq did exactly this some months ago with Shader Toy — a browser based Fragment Shader editor.
This week I started experimenting with this. First thing I needed to do was a sandbox with the basic WebGL initialisation code. With [...]
MyBookReadR V2 | jQuery.colonize | jQuery.boxFx | jQuery.analogueClock2 | The RSS Wall | FastWebStart
My latest sources and sheets :
Github sources | Personnal wiki | jsFiddle example | WebDev bookmark