Kamélab
www.kamelab.fr

Dans le cadre de la création de l’agence de communication digitale KAMÉLAB, j’ai été sollicité pour intégrer un site vitrine des activités de la société. La conception de ce site a été réalisée de concert avec le webdesigner qui en a créé la maquette (romainouvrard.fr) ainsi qu’un consultant en webmarketing (johebert.fr) garant de l’optimisation des contenus.

Nous avons choisi de réaliser une landing page amenée à évoluer dans le temps. Cette page se verra enrichie dans un avenir proche par plusieurs autres pages spécifiques aux compétences mise en avant par la société.

Date
2019
Technologies
CSS3
HTML 5
WordPress
Missions
Intégration de la charte graphique (Sketch)
Développement du site
Environnement Intégration continue
Optimisation référencement naturel

Identité & Mascotte Kamélab

L’identité de KAMÉLAB est construite autour d’un bouclier, reflet de l’activité principale de la société, la maintenance applicative de sites web. Très largement inspirée par la pop culture japonaise, on y reconnaît les traits d’une carapace de tortue évoquant Tortue géniale un personnage incontournable du manga Dragonball, nommé Kamé sennin en version originale. Il est celui qui recueille, entraîne et accompagne Son Goku, le personnage principal du manga au début de son histoire. L’idée était de symboliser l’accompagnement proposer par KAMÉLAB auprès de ses clients. Enfin, “Lab” évoque la capacité des collaborateurs de la société à tester, s’approprier et même créer des méthodes et outils innovants. Bref, leur capacité à sortir de leur zone de confort !

Sans surprise, la mascotte de KAMÉLAB est donc une tortue créée et dessinée par romainouvrard.fr. Prénommée Cam, elle est réalisée intégralement en dessin vectoriel avec des traits sombres et épais rappelant une fois de plus l’univers des mangas japonais.

Maquette & Structure

Au regard de l’identité de KAMÉLAB, la maquette est construite autour de formes simples, toutes en rondeurs et des visuels riches qui se fondent dans le décor. De nombreux pictogrammes, intégrés à des boucliers aident à structurer le déroulé des informations, tout en rappelant le logo de la société. Certaines sections du site sont réalisées de manière figurative comme la présentation d’un service 360° où une animation vient appuyer le propos.

Dans un souci de rapidité de mise en ligne et dans le but d’apprécier le comportement du site sur tous les navigateurs et tout optimiser, j’ai décidé de concevoir la maquette statique entièrement fonctionnelle. Ainsi, il était plus aisé de prévoir des corrections et évolutions.
La landing page, une fois développée, a ensuite été réintégrée à un environnement WordPress, où j’ai utilisé des Advanced Custom Fields (ACF) et certains widgets afin de faire évoluer ses contenus plus simplement.