Encore du drag and drop !

Et oui, j’ai pas encore fini  car après la recherche documentaire et la « remise à niveau » j’ai pu passer au codage proprement dis. À cette occasion j’ai essayé d’utiliser un logiciel de gestion de versions décentralisé pour garder trace de mes différentes étapes de développement.

Page d'accueil du site pour FlowChem

La plus grosse difficulté que j’ai eu au niveau de la programmation est au niveau de la gestion des évènements et de leur ordre pour réaliser le système d’ajout, de déplacement et de suppression des icônes en fonction de leur origine et de leur destination.

Pour le design c’est pas du définitif, ce n’est qu’une première version, mais le gros du travail est sur les icônes qui doivent être à la fois graphique, et évidente pour des chimistes.

Et puis la surprise de dernière minute c’est l’adaptation du site à une résolution de 800×600 en plus de la version plus standard pour 1024×748 et plus.

Voici les deux versions :

Je prend volontiers les retours sur le comportement de cette petite application sur votre terminal ! :-)

Publié dans Développement, Web | Mots-clefs : , , , , , , , , , , | Laisser un commentaire

Drag and Drop dans une OnePage

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 :

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.

Code du script jquery miniaturisé

Code du script jquery miniaturisé

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.

 

Publié dans Développement | Mots-clefs : , , , | Laisser un commentaire

OnePage Dynamic

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 :

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

Deux projets super interressant !!

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.

Wireframe du site en one page

Publié dans Développement | Mots-clefs : , , , | 1 réponse

La balade dans le Frontonais

La balade dans le Frontonais

Publié dans Photographie | Mots-clefs : | Laisser un commentaire