Web Design Lyon
Création de sites internet et d'applications web
Studio de graphisme multimédia /// Conception graphique interactive
Contact
Refonte du site de la communauté de commune de Saint-Galmier (www.ccpsg.fr)
Conception de l'extranet revendeur de la marque Couzon (www.couzon.com)
Ensemble scolaire Saint-Louis
Objectif: Refondre en HTML le site existant en Flash. Conserver la version Flash du site et optimiser sa vitesse de chargement (divisé par 10). Ajouter des éléments fonctionnel sur la version Flash (Menus + mise à jour de contenus).
Webdesign: Une charte graphique web complète existait déjà sur la version Flash, le challenge consistait donc à porter un design full flash sur un site HTML, en conservant le même style graphique, le même type d'animation et les mêmes fonctionnalités.
Technique:Animations full Javascript, template Joomla en HTML5 et CSS3 rétro-compatible.
Particularité: Ultra-rapide, auto-administrable par le client (comme pour les autres sites Joomla).
Mise en ligne: Mars 2012
intersed - servial
Objectif: Seconde refonte graphique et structurelle du site internet pour améliorer l'image de marque de la SSII.
Webdesign: Un design travaillé dans les moindres détails allant jusqu'à la personnalisation des formulaires, avec un soin particulier sur la mise en relief et le travail des ombres et de la lumière. L'objectif était d'obtenir un design à la fois robuste et carré à l'image de toutes les solutions informatiques proposées par Intersed - Servial et en même temps, facile à comprendre et à utiliser. Simplement fonctionnel.
Particularité: Optimisation pointue pour la vitesse d'affichage, laboratoire R&D sur HTML5 et CSS3 .
Mise en ligne: Janvier 2012
Power sécurité privée
En ligne : www.powersecurite.fr
Objectif: Site internet de présentation des prestations de services de l'entreprise pour la partie publique, ce site web intègre également des fonctionnalités avancées sur un extranet accessible aux administrateurs.
Webdesign: Une approche résolument corporate a dominé l'orientation graphique de ce site. La valeur ajoutée du webdesigner s'exprime au travers d'une typographie ultra-lisible et parfaitement hiérarchisée.
Technique:Conception basée sur le CMS Joomla dans sa version la plus récente au moment de la conception du site.
Particularité: Possède un module de e-recrutement en back-office.
Mise en ligne: Décembre 2011
Team TMS Racing
Objectif: Présenter l'activité du TEAM TMS Racing qui engage régulièrement des pilotes chevronnés sur les courses du Bol d'Or à Magny-cours et du 24h du Mans.
Webdesign: Toutes les rubriques du site sont présentées sur la même page. Chacune des catégories de contenu est diffusée sous la forme d'un module avec des onglets qui permettent de naviguer d'un article à l'autre. Un composant de blog et des fonctions audio-vidéo seront prochainement ajoutés au site.
Technique:CMS Joomla! 1.7 avec template développé pour être compatible avec les appareils mobiles.
Particularité: Site monopage avec menu permanent en haut de page.
Mise en ligne:Août 2011
Comité d'Entreprise Régional de la SNCF
Objectif: L'enjeu graphique était double : D'une part communiquer auprès des institutions et de la presse, et d'autre part s'adresser directement aux cheminots et à leurs familles. Ceux-ci viennent découvrir les prochaines sorties "Loisirs & vacances" mises à leur disposition par le CER.
Webdesign: La mise en page sobre des articles, une typographie simple, et des tonalités de gris apportent une dimension institutionnelle au site. En parallèle, les couleurs vives et multiples, des visuels riches et colorés ainsi que des fonctions interactives sont en phase avec l'aspect ludique du site.
Technique:Pour le Responsable du Service Communication, refondre le site du CER sous Joomla était une évidence car il administre déjà entièrement ce site avec ce CMS.
Particularité: Arrière-plan travaillé pour les grands écrans 16/10 (image 3).
Mise en ligne: Juillet 2011
Compagnie de danse Kham
Objectif: Présenter une compagnie de danse contemporaine de dimension internationale.
Webdesign: Un des aspect de l'art contemporain dans le web design s'exprime par une forme de "Synthésisme pictural" associé à une typographie souvent de grande taille, parfois massive. Le tout dans un esprit résolument minimaliste. Pour cette raison, j'ai choisi de créer deux zones bien délimitées avec des aplats de couleur sans ombres et sans dégradés.
La grande zone noire a pour fonction de remplir l'espace dans l'univers d'un spectacle souvent nocturne. Sa taille est variable en fonction de la hauteur de la fenêtre du navigateur. La zone beige contenant le menu et les articles est toujours positionnée au bas de la fenêtre du navigateur et vient recouvrir la zone noire.
La typographie et la mise en page des articles s'expriment dans une simplicité qui laisse le regard totalement disponible pour la beauté des photos de la compagnie.
Particularité:Optimisé pour les écrans mobiles.
Mise en ligne: Mai 2011
éveil de la mémoire corporelle
www.eveil-memoire-corporelle.com
Objectif: Ce site présente les soins proposés par une praticienne d'une technique de réflexologie. Le challenge consistait à créer un univers relaxant, zen et authentique mais également de présenter une image de sérieux et de crédibilité.
Webdesign: Pour le fond du site, j'ai choisi 2 couleurs pastel pour leurs douceurs. J'ai ensuite appliqué des dégradés légers et des ombres subtiles pour amener de la profondeur. Une troisième couleur pastel (orange) vient renforcer cette impression. Les visuels ont été choisis pour leur appartenance à l'univers du zen ou leur aspect "aérien" (Lotus, orchidée, pierres Feng-Shui, papillon).
Le côté sérieux du site est apporté par une typographie comportant différentes tonalités de bleu, une association de polices avec empattement et sans empattement ainsi que par des menus volontairement sobres pour aller à l'essentiel.
Mise en ligne: Mars 2011
Extend prevention
Objectif: Extend Prévention était une société spécialisée dans la formation contre les risques en entreprises. Elle proposait également des prestations de mise aux normes et d'entretien de différents systèmes et matériels de sécurité.
Webdesign: Le graphisme de ce site fait appel à des codes picturaux relevant du domaine de la sécurité. Le site est comme un panneau de signalisation géant avec différents niveaux d'informations.
Des couleurs vives, jaune et orange, conduisent l'internaute vers les "issues de secours". La couleur dominante rouge reflète un environnement à risques dont les dangers sont néanmoins maîtrisés. Un visuel "hazard stripe" vient renforcer cet univers tandis que les menus sont bruts et très contrastés.
L'homme au parapluie est un visuel conçu sur mesure pour traduire la philosophie de l'entreprise.
Technique:Ce site devait comporter un module complet de e-learning qui n'a pas été installé.
Particularité: Actuellement hors-ligne.
Mise en ligne: Janvier 2011
irm des sources
Objectif: Présentation du déroulement des examens médicaux d'un cabinet d'IRM, proche de la Clinique de la Sauvegarde dans le 9ème arrondissement.
Webdesign: Pour cet univers médical, la dominance du blanc est apparût comme une première évidence. Un rouge profond, de type carmin a ensuite été choisi comme couleur principale. Le graphisme a été pensé pour créer une ambiance lumineuse et sécurisante tout en fournissant des informations claires et accessibles.
Sur la page "Examens" (constituant le coeur du site), une couleur supplémentaire (bleu) est harmonieusement intégré pour élargir le champ de la mise en page.
Les textes s'expriment dans 4 couleurs : 2 teintes de gris, du noir et le rouge du site, en fonctions de leurs niveaux d'informations.
Particularité:Investissement remarquable de l'équipe de l'IRM des Sources dans la création des contenus.
Mise en ligne: Novembre 2010
Mairie de chanas
Objectif: Présentation de la commune de Chanas dans l'Isère.
Webdesign: Le graphisme de ce site s'appuie sur un design résolument rétro et basique (dans l'esprit du web des années 90) associé à des visuels tendances jusqu'à la fin des années 2000 (icônes "glossy", en reliefs et sur des ombres portées soutenues).
La dimension institutionnelle est apportée par une typographie travaillée pour être sobre et facilement reprise par l'équipe de la mairie lors de l'édition des articles.
Le client a souhaité que chaque lien du menu principal (top-menu) renvoi sur des pages portail constituées de grandes icônes. A partir de là l'internaute est redirigé vers les articles associés aux icônes. Un menu latéral à gauche prend ensuite le relais.
Particularité:Ce site possède un composant de blog qui permet à une vingtaine d'associations de la commune de créer des articles sur le site de manière très simple.
Mise en ligne: Septembre 2010
TFC Rhône-alpes
Objectif: Présentation de l'offre de services télécommunication.
Webdesign: Le graphisme de ce site répond aux envies du client : un affichage fenêtré et plusieurs textes défilants sur la page d'accueil.
Le design est une expression du style "Corporate Web 2.0" : dégradés marqués, ombrages profonds, textes incrustés, le tout limité dans une résolution fixe de 1024x768 pixels.
Dans le header, une illustration conçue sur mesure traduit les métiers de l'entreprise (réseaux téléphoniques, fibre optique...).
Particularité:Un module d'administration écrit en PHP permet au client d'éditer les bandeaux défilants de la page d'accueil.
Mise en ligne: Juillet 2010
epargis
Objectif: Création d'un site générateur de prospects dans le domaine du courtage en prêt et en assurance.
Webdesign: Ce site ayant pour vocation de s'adresser aux plus grands nombres, d'une façon simple et directe, la page d'accueil oriente immédiatement le visiteur vers les 3 domaines d'activités de la société.
A l'intérieur de ces catégories, un menu latéral à gauche permet de passer de l'une à l'autre. Elles comportent chacune 5 articles accessibles par des onglets ou en le faisant défiler avec la molette de la souris.
Une animation Flash occupant la moitié du site met en valeur quelques concepts clés basiques propres à ce secteur professionnel.
Particularité:Ce site possède un composant JQuery qui permet le défilement horizontal d'un article à l'autre tout en restant sur la même page.
Mise en ligne: Juillet 2010
pistel
Objectif: Habillage graphique de l'interface d'un progiciel développé en PHP pour le suivi de la distribution des pneus Dunlop / Goodyear en France.
Webdesign: Encore un mode fenêtré et limité à une résolution de 1024x768 pixels pour ce site qui est avant tout un outil destiné à être utilisé sur des ordinateurs possiblement anciens, dans des entrepôts ou sur des quais de chargement.
Dans le header, une illustration sur mesure exprime les métiers du transport et de la logistique, "des hommes au camion".
L'arrière-plan extérieur au site évoque le bleu de travail avec son motif toile de jean tandis que l'arrière-plan intérieur est une symbolisation du bitume par son motif légèrement moucheté de points diffus.
Particularité:Les menus permettant l'accès aux autres pages du site n'apparaissent qu'après identification.
Mise en ligne: Septembre 2009
intersed - servial
Objectif: Refonte graphique du site internet de l'entreprise, pour le moderniser et développer des contenus en rapports avec les différents pôles de compétences.
Webdesign: Le design de ce site représente une très nette avancée par rapport au précédent et pour autant il a déjà vécu avec ses 2 ans d'existence.
Une société de services informatiques à la pointe des dernières technologies des SI et des NTIC comme Intersed - Servial se doit d'upgrader son site vers un niveau encore supérieur.
Nous y réfléchissons donc en ce moment.
Particularité: Site conçu en stage de fin de formation, avant de devenir salarié de Intersed - Servial.
Mise en ligne: Juillet 2009
Site portfolio
Objectif: Conception d'un site portfolio en fin de formation Infographie Multimédia à l'AFPA.
Webdesign: A l'issue d'un an de formation, nous devions tous concevoir un site, à la fois pour présenter nos travaux et comme démonstrateur des compétences acquises. J'ai donc créée une ambiance personnelle que j'ai également déclinée en print (voir le CV).
C'est un univers intimiste et travaillé dans les détails : Un tableau avec des moulures présente les travaux "Print" et comporte une référence aux 4 couleurs de l'imprimerie (CMJN) en bas à droite du cadre. Un grand écran plat présente les travaux web et comporte une référence aux 3 couleurs du numérique (RVB) en bas à gauche de la dalle.
Ce site a également fait son temps et celui sur lequel vous lisez ces lignes vient en assurer la relève.
Particularité:Site "one page" dont le défilement s'effectue horizontalement.
Mise en ligne: Juillet 2009
