davrous Posted November 30, 2015 Share Posted November 30, 2015 Hi! I’ve spent of lot of my free time recently to work on an upgraded version of babylonjs.com to be responsive across devices: http://www.babylonjs.com The new site uses Media Queries of course, Flexbox, SVG and much more fun: CSS Filters! Hovering the mouse on our elements will zoom it a little using CSS transforms & transitions and will apply a blur & sepia filter on the other elements of the flexbox. Using the scrolling links will also use a slight gray filter during the scrolling. The website has been tested on IE11/Edge/Chrome/Firefox & iPhone/iPad/Android & Windows Phone devices but if you find anything wrong on your device, please tell me. The website is now also much more faster to load (from 6s to 600ms!). This is because we've splitted the demos into specific page. In the past, we're using a SPA like approach. It was complex for our users to find the right file to review. Now, by simply view the source of a specific demo like this one: http://babylonjs.com/Demos/PointLightShadowMap/, you should be able to understand how it works. I've put also all images on our CDN. That's why the new page now loads very fast. In conclusion, this website is using almost all modern features supported by modern browsers: WebGL, Web Audio, Gamepad, Pointer Events, IndexedDB, Media Queries, SVG, Flexbox, Filters, Transform & transitions. Don’t know a lot of sites using that much features. ;-) Cheers, David Stvsynrj, Vousk-prod., Jaskar and 9 others 12 Quote Link to comment Share on other sites More sharing options...
jerome Posted November 30, 2015 Share Posted November 30, 2015 Awsome ! Quote Link to comment Share on other sites More sharing options...
iiceman Posted November 30, 2015 Share Posted November 30, 2015 I like it! Everything looks pretty good as far as I can tell. The "sepia effect" confused me a bit at first, but after I figured out what's going on it's pretty cool Good job! Quote Link to comment Share on other sites More sharing options...
MasterK Posted December 1, 2015 Share Posted December 1, 2015 it seems more clear... before now, i always can't found the source of demo... GameMonetize 1 Quote Link to comment Share on other sites More sharing options...
WolfKodi Posted December 1, 2015 Share Posted December 1, 2015 I love the separate pages for each demo and how much more responsive it is. GameMonetize 1 Quote Link to comment Share on other sites More sharing options...
Vousk-prod. Posted December 1, 2015 Share Posted December 1, 2015 Excellent !!Much more pleasant to look at, more easy and convenient to use, a really really good job davrous !! davrous 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.