10/08/2006 : Bonjour à tous, croulant un peu sous le boulot, je n'ai pas touché à ce site depuis bientôt 2 ans(complétement depassé par rapport à ce dont je suis capable maintenant).

j'en profite pour faire un peu de pub pour le site d'un pote qui promet (le site, pas le pote hein ;-) ) http://www.dkdesign.fr

En attendant, voici la liste de mes derniers travaux qui méritent le détour...

anciennes news
--------------------------------------------------

 

Web - nh-reptiles


Site de vente d'animaux boides et varanides - société NHREPTILES

screenshot - cliquer dessus pour accéder au site

 

screenshot -back office


  • site mixant flash / html / css / php-mysql avec back office
  • gallerie d'images dynamique avec thumbnail geré par XML
  • partie news geré par back office avec editeur online WYSIWYG - upload d'image avec visualisation des images serveur, suprression multiples d'elements etc.
  • navigation -> composants flash developpé gérant navigation du browser (actualiser / retour / precedent)
  • compatible ie 5.0, ie 5.5, ie 6, mozilla, firefox et safari (mac)

  • sans doute mon site le plus abouti d'un point de vue technique car melangeant toute les technologies que je maitrise. Flash avec de la programmation objet pour le diaporama, le menu et la gallerie xml - html / css pour la mise en page compatible tout browser - php-mysql pour la partie dynamique (animaux disponible, news...) geré par un back office . en ce qui concerne le design, je me suis inspiré des didgeridoo australiens pour donner l'aspect terranova desiré par mon client.

  • Flash Mx 2004
  • DreamWeaver Mx 2004
  • Photoshop cs


Web - Soirée certification

Site promotionnel en full -flash pour une soirée sur le théme " certification en management de projet" - société OPTEAM


screenshot - cliquer dessus pour accéder au site


  • Détection automatique du plug-in flash -> redirection automatique vers page en html si flash non présent
  • partie inscription et contact géré via PHP
  • plan d'accés dynamique zoomable en temps réel et impimable sous flash

  • Voici un petit site promotionnel que j'ai réalisé en seulement 3-4 jours qui propose aux visiteurs de s'inscrire à l'évènement au moyen d'un formulaire flash-php. Toute l'interface est conçu à partir de fenêtres draggable du type Windows. J'ai utilisé des couleurs dans des tons verdatre (sans doute l'influence matrix du moment :-) pour marquer visuellement le visiteur.

  • Flash Mx
  • DreamWeaver Mx (php)
  • Photoshop 7

Web - Leimer

ma dernière création en freelance - un site full flash pour un vendeur de vêtements sportswear.


screenshot - cliquer dessus pour accéder au site


  • utilisation des shared object (cookies flash) pour sauvegarder les préférences de l'utilisateur (fond d'"écran..)
  • contenu et images gérés dynamiquement via un back office extérieur
  • mouvements élastiques configurables (oscillations...), player sonore complet avec sauvegarde du volume

  • Leimer est une marque jeune et branchée, proche du milieu hip-hop et distribue également des vêtements plus classiques. Pour cela j'ai orienté ma création sur un style assez moderne par l'utilisation d'éléments de navigations en pixelart, d'emboss et effets de matières métallique, mais avec des couleurs assez sombre laissant une grande place aux fonds plus colorés.
    les fonds quand à eux sont de plusieurs style et permettent à l'utilisateur de choisir son propre univers. Il y a de la création purement infographique via photoshop, de l'illustration (les personnages que l'on vois sur le screenshot) et même de la 3d.

  • Flash Mx
  • DreamWeaver Mx
  • Photoshop 7
  • illustrator 10
  • 3ds max 5 avec plug-in swift 3d v3


Web - Open Team

site commercial pour la promotion d'un logiciel intranet de gestion de projet.


screenshot - cliquer dessus pour accéder au site


  • ce site mélange à la fois flash et html de façon très poussé. tous les textes sont en html, bénéficiant ainsi de mise en forme CSS, et tous ce qui est navigation, images etc. est affiché grâce a Flash. en fait Flash est ici utilisé comme une balise <img> permettant ainsi d'avoir des preloads et effets d'apparitions évoluées. c'est le HTMl qui envoi à chaque fois le nom de l'image à chargé au flash qui adapte sa taille aux dimensions de l'image. Tout est donc facilement modifiable à travers le code HTML.
  • utilisation des Local connexions de Flash MX pour la communication des barres de menus haut et gauche (2 flashs distincts sur une même page html). ici les menus Flash se mettent à jour automatiquement lorsque l'utilisateur utilise les boutons "précèdent" ou "suivant" de son navigateur.
  • le site s'adapte automatiquement à la résolution de l'utilisateur, du 800*600 au 1280*1024 (au delà aussi mais les polices deviennent trop petite)
  • démos du logiciel en ligne faite sous flash à la "main" en utilisant de l'interpolation de mouvement+code actionscript et le logiciel viewlet builder.

  • site corporate par excellence, le bleu s'imposait de lui-meme ainsi que les images de fond montrant des personnes travaillant en groupe. j'ai essayé de donner un style dynamique à l'ensemble par le biais de petites animations flash discrètes soulignant les titres ou autres points important à relever. Orange / noir / bleu / blanc sont les couleurs dominantes de ce site.

  • Flash Mx
  • DreamWeaver Mx
  • Photoshop 7
  • fireworks MX
  • viewlet builder 3
remonter

 

Web - Opteam

site corporate pour la société Opteam spécialisé en gestion de projet.
-SITE RECOMPENSE AUX WEB TROPHEE 2003 ET 2004 DE LA FORMATION

screenshot - cliquer dessus pour accéder au site


  • beaucoup de restrictions imposées sur ce site (800*600, peu de flash etc.) j'ai donc utilisé le javascript pour créer des effets intéressants et ergonomique comme pour le calendrier avec un tag javascript paramètrable, les layers explicatifs de la rubrique "jeux d'entreprise" etc.
  • site utilisant l'iframe avec toutes les techniques nécessaire pour un référencement correct (utilisation balise "noframe", script reconstructeur de frame parent dynamique etc.)
  • arborescence de la navigation du coté gauche se "dépliant" tout en s'adaptant à une taille max 420px de hauteur - javascript / css
  • plan d'accés vectoriel zoomable dynamiquement et imprimable -> flash mx
  • impression du contenu des pages adaptés spécialement pour une mise en page A4 sans la navigation du site (bouton avec code javascript spécifique)
  • Newsletter avec administration complète liste de diffusion, banissement de mail, mail format txt ou html, sauvegarde des newsletter, gestion utilisateur... en php-mysql

  • site sobre avec une utilisation de dégradés violets / bleu pour éviter le bleu classique corporate.

  • Flash Mx
  • DreamWeaver Mx
  • Illustrator
  • Photoshop 7
  • fireworks MX
  • php/mysql - easy php pour le développement
remonter

 

Web - armature

site full flash pour un groupe de musique rap "cool" :-) (en développement)


screenshot - cliquer dessus pour accéder au site


  • utilisation des shared object (cookies flash) pour sauvegarder les préférences de l'utilisateur (fond d'"ecran...)
  • prototype de scrollpane personnel avec fenêtre dragable et redimensionnable avec ajustement du contenu dynamiquement
  • détection automatique du plug-in flash au démarrage et orientation vers la page correspondant

  • mon client désirait un univers à la fois moderne et "zen" avec des personnages filaire en communion entre eux. J'ai traduis ceci avec des fonds utilisant beaucoup de lueur externe en mode fusion densité lumière + sous photoshop avec modélisation de personnages sous poser. l'interface reste dans un esprit vectorstyle avec des angles a 45degré et des biseaux.

  • Flash Mx
  • DreamWeaver Mx
  • Illustrator
  • Photoshop 7
  • poser
remonter



PAO - GameRon

Packaging pour un VgaBox (adaptateur console-ecran pc) pour la société GameRon (vente de matériel de jeux vidéo)


screenshot


  • composition à l'aide d'illustrator, photoshop. CMJN, code barre...

  • Actuellement en charge de la conception de l'ensemble des packaging de la société GameRon, ce packaging représente ma premiere réalisation pour la société. L'idée était de donner un aspect à la fois moderne et serieux, l'accent étant mis sur le design afin d'attirer l'oeil du client dans les magazins.

  • Illustrator 10
  • photoshop 7
  • Barcoder
remonter


PAO - GameRon

Packaging pour un tapis de danse(ps1-ps2)) pour la société GameRon (vente de matériel de jeux vidéo)


screenshot


  • composition à l'aide d'illustrator, Flash, photoshop. CMJN, code barre...

  • second packaging pour la société GameRon, à peine deux jours pour le réaliser, j'ai juste eu le temps de réaliser mes deux danseurs sous illustrator / colorisation sous flash (plus rapide pour les blocs de couleurs). Le résultat n'est pas celui que j'esperai, mais compte tenu du temps imparti je ne suis pas mécontent.

  • Illustrator 10
  • Flash
  • photoshop 7
  • Barcoder
remonter



PAO - satelite

Publicité pour la boutique de jeux vidéo "Satelite" diffusé dans le journal "Jeux Vidéo Magazine" du mois de novembre 2003


screenshot


  • format A4 - fichier tiff CMJN avec 5mm de rogne + traits de coupe

  • l'idée de cette publicité, bien que de type "catalogue de produits" était d'introduire un esprit "sérieux" différent de celui habituellement usités dans le monde du jeux vidéo. J'ai donné une petite touche Web avec du vectorstyle et l'emploi de "vignettes" pour distinguer chaques produits par code couleur.

  • Indesign 2.5
  • photoshop 7
remonter

 

PAO - satelite

Publicité pour la boutique de jeux vidéo "Satelite" diffusé dans le journal "Jeux Vidéo Magazine" du mois d'octobre 2003


screenshot


  • format A5 - fichier tiff CMJN réalisé sous Indesign et photoshop

  • publicité réalisée en une journée, le fond rouge avais été choisi par mon client

  • Indesign 2.5
  • photoshop 7
remonter

 

PAO - APE

Catalogue 8 pages pour la société APE (Agir Pour l'Emploi)


screenshot


  • format A4 - fichier pdf HR réalisé sous Indesign PC

  • Un petit catalogue de 8 pages qui m'a permis de me faire les dents sur Indesign PC. chaques pages présentais sommairement les formations offertes par l'APE, j'ai cherché à occuper le maximum de place vu la faible quantité de texte que j'avai en utilisant de blocs arrondis.

  • Indesign 2.5
  • photoshop 7
  • illustrator 10
remonter

 

Animation Flash- PrimSaveur

animation d'introduction pour le futur site de PrimSaveur




screenshot - cliquer sur une des images pour lancer l'animation


  • les décors on été crées en 3d sous Plasma puis colorisé sous Flash Mx.
  • utilisation de texture bitmap pour l'orange
  • animation utilisant à la fois interpolation de mouvement et image/image

  • Le client voulait une orange qui se déshabille avec une transition vers un verre de jus de fruit. Comme les principaux acheteurs de PrimSaveur sont des hôtels de luxe, j'ai imaginé l'histoire de cette petite orange-diva qui va donner son show sur les planches d'un théâtre. L'ensemble est très coloré et assez vif. La petite explosion de fumée de la fin a été réalisé à partir d'un gif animé que j'ai vectorisé et retravaillé sous flash.

  • Flash Mx
  • DreamWeaver Mx
  • Illustrator
  • Photoshop 7
  • plasma
  • swish 2 (pour les effets de texte)
remonter

 

Animation Flash- PrimSaveur

animation d'introduction pour site de la fédération française de plongée sous-marine (en développement)




screenshot - cliquer sur une des images pour lancer l'animation


  • utilisation de plasma pour modéliser de nombreux éléments comme le livre, les lunettes de plongée, la lampe de chevet etc.
  • décors en extérieurs réalisés sous Flash directement
  • animation du personnage en 3d avec poser

  • J'ai voulu donner un petit aspect bd à cette animation en incrustant des bulles dans les bulles de l'animation. Un petit coté manga pour le visage de mon personnage directement inspiré de DNA. Poser et son module d'animation / exportation swf m'a été très utile pour obtenir des animations souples pour le personnage principal et le dauphin. L'ensemble de l'animation est accès sur des tons bleu / nuit rappelant un peu l'affiche du grand bleu de Besson (rapport à la FFSE)

  • Flash Mx
  • DreamWeaver Mx
  • plasma
  • Poser
remonter

 

Cd-Rom- maquette TVI

cd rom maquette de démonstration pour chaine de TVI (Canal Sat) - Cash TV & Cash grattage




screenshots - CASH GRATTAGE & CASH TV


  • Cd-rom démonstration developpés sous Flash MX 2004 - conception de classes "menus" specifique TVI avec editeur d'ecrans.
  • Cash TV est entierement paramétrable par fichier externe (scrolltexts, ordre d'apparition des rubriques, animations, tirages etc...)

 

  • Ces maquettes on été réalisés en 2 fois deux semaines en tenant compte de la conception graphique et le développement. Ces deux maquettes sont axés sur un même jeu d'objet flash que j'ai développé destiné à reproduire l'ensemble des fonctionnalités TVI du décodeur Canal Sat.

  • Flash Mx 2004
  • Illustrator
  • photoshop CS
Cd-Rom- didacticiel coaching

cd-rom de démonstration d'un module d'E-learning pour de la gestion de projet




screenshots


  • Cd-rom entièrement développé sous Flash MX - environnement type Windows configurable
  • assistant visuel (type assistant office), génération de courbes de résultat etc.
  • introduction animé en 3d

  • Pour ce petit Cd-Rom j'ai développé une interface très simple avec beaucoup d'arrondis et de couleurs chaleureuses (orange). Beaucoup d'llustrations pour expliquer chaques étapes et une ergonomie intuitive et surtout paramètrable par l'utilisateur.

  • Flash Mx
  • Illustrator
  • plasma
  • photoshop 7
remonter

 

Jeu Flash - chaos adventure

Projet d'un jeu d'aventure développé en Full Flash avec illustration vectoriel et bitmaps (en développement)




screenshots


  • sauvegarde des parties avec shared object
  • décors réalisés sous 3ds max export en swf
  • pathfinder développé par Elmac

  • fan des anciens jeux d'aventure à la monkey island je me suis lancé dans le développement d'une production du même genre, mais jouable en ligne. Interface à base d'icones, utilisation de mon personnage chaos, création de fonds en vectoriel et/ou bitmaps.

  • Flash Mx
  • Illustrator
  • plasma
  • photoshop 7
  • poser
  • swish 2
remonter