Mois : janvier 2014

Je continue les recherches pour faire le fameux jeu de présentation en glisser/déposer et du coup je découvre plein de choses interressantes, la première c’est que jquery permet de faire ça simplement. Et puis plein de tuto au résultat vraiment sympa :

• chez-syl.fr/2012/03/drag-and-drop-html5-jquery/
• guillaumevoisin.fr/tutoriel-drag-and-drop-jquery-exemple-avec-une-liste-des-taches
• w3schools.com/html/html5_draganddrop
• html5demos.com/drag (c’est pas un tuto mais une démo)

Et puis en marge de cette magnifique découverte (pour moi … ) j’ai trouvé des scripts qui peuvent être super intéressant pour optimiser son site, à savoir headjs pour les scripts et bLazy (ou Be Lazy) pour le chargement progressif des images.

La mise en place du drag&drop dans une one page n’est pas si évidente que ça ! Il faut arriver à concilier les deux bibliothèques javascript et leur css respective !

Mais c’est faisable quand même ^^ Voici un exemple de drag and drop.

 

Ok, aujourd’hui je commence le développement d’un page de présentation d’un nouveau procédé de production chimique. La commande est simple, une one page avec un petit jeu éducatif dedans, à savoir un jeu de glisser/déposer.

Première difficulté, reprendre contact avec la multitude de projet et bibliothèque qui pullulent sur le web pour faire ce genre de chose et faire le tri entre le bon grain et livrais.

Exemple de ce qui est possible de faire en jeux one page :

• http://connectmania.com/
• http://slaveryfootprint.org/survey/#where_do_you_live
• http://whosyoursanta.ca/
• http://www.puddingrush.com/

Un tuto intéressant pour refaire ses armes avec JQuery : http://www.snoupix.com/slideshow-jquery-accessible_tutorial_28.html

Deux projets super interressant !!

• http://alvarotrigo.com/fullPage/
• http://www.thepetedesign.com/demos/onepage_scroll_demo.html

Le premier test de la journée : http://lascapi.fr/flowchem/one-page-dynamic-20140106/

Et pour finir le wireframe pas du tout définitif du projet.