William Ravel

<p class="mb-3">Conception et développement de Coloring Book, application SaaS Desktop et IOS en phase alpha, dédiée à la création de livres de coloriage personnalisés. Plateforme intuitive proposant gestion de pages, composition graphique via bibliothèque d’assets SVG, coloriage interactif sur canvas, export PDF haute qualité.</p> <ul class="flex list-disc mx-5 flex-col gap-1 mb-3"> <li><a href="https://coloringbook-frontend.onrender.com/" target="_blank">coloringbook-frontend.onrender.com</a></li> <li><a href="https://github.com/willahh/coloringbook" target="_blank">github.com/willahh/coloringbook</a></li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Contribution à la refonte du portail web pour la consultation et recherche de notices de livres, collaboration avec équipes métiers, fonctionnelles et techniques dans un environnement de travail Agile/Scrum.</li> <li>Participation au développement du frontend en React / ClojureScript et du backend en Clojure / Java, avec PostgreSQL et Apache Solr pour les recherches de notices via des index optimisés.</li> <li>Participation au développement de l’API REST externe fournie aux clients pour gérer leurs notices personnelles, paniers et bons de commande.</li> <li>Application du Domain Driven Design (DDD) pour modéliser le domaine métier, du TDD, ainsi que du BDD avec tests en Gherkin</li> <li>Utilisation d’architectures Hexagonale, Event-Driven, et communication via Pub/Sub sur Google Cloud Platform.</li> <li>Monitoring avec DataDog, création de dashboards et optimisation des performances.</li> <li>Déploiement CI/CD via GitLab. Gestion des environnements colorisés et clusters Kubernetes, assurés par une équipe de DevOps.</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Design des interfaces</li> <li>Création du front d'un module chemin de fer de préparation de documents et prospectus</li> <li>Drag and drop de produits depuis un chutier vers des pages</li> <li>Affichage des promotions sur les produits dans la page</li> <li>Interactions sur les pages : zoom, déplacement</li> <li>Annotation sur page avec différents outils : punaise, rectangle, tracé à la main</li> <li>Interface avec panneaux redimensionnables / repliables</li> <li>Utilisation au clavier / Raccourcis clavier.</li> <li>Compatibilité IE6-IE10, Échanges XHR au format JSON, +200 vues.</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création du front d'une galerie paginée avec différents outils et vues (liste / vignette), agrandissement / réduction des images</li> <li>Interface avec panneaux redimensionnables / repliables</li> <li>Compatibilité IE6-IE10, Échanges XHR au format JSON</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Intégration responsive HTML / CSS / Javascript à partir de maquettes graphiques fournies par une agence</li> <li>Création d’un système de grille responsive à 6 points de rupture : mobile / tablette / petite résolution / résolution standard / très grande résolution. Chargement des images dans la résolution qui convient le mieux selon le point de rupture</li> <li>Configurateur en ligne responsive et interactif permettant de charger des modèles et de les visualiser sous différents angles avec différents tissus / accessoires. Création du front - SPA javascript IE10, jQuery</li> <li>Réalisation des tâches Grunt pour les différents modules</li> <li>Optimisation des performances et de la taille des bundles js : Le site doit être chargé rapidement en mobile en 3G, et consultable sur de très grande résolution, utilisation de Adobe Scene 7 pour la gestion des ressources statiques</li> <li>Accessibilité : Intégration des normes d’accessibilité WAI en partenariat avec une société spécialisée</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création du front d'un outil d’édition intéractif de documents papier, brochure, catalogue. Ajout de pages, déplacement dans les pages. Navigation, création / redimensionnement de zones, dépôt de commentaires (punaises, rectangles, tracés). Utilisation au clavier / Raccourcis clavier</li> <li>Divers modules avec mapping des données vers des emplacements en drag and drop</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création du front d'une galerie paginée au look Adobe Bridge avec différents outils et vues (liste / vignette), agrandissement / réduction des images</li> <li>Interface avec panneaux redimensionnables / repliables</li> <li>Compatibilité IE6-IE10, Échanges XHR au format JSON</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Design et intégration du site web - responsive</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Responsable de la conception UI/UX et des améliorations quotidiennes</li> <li>Création d'un outil interactif et animé en Flash et Actionscript, d’édition de documents papier, brochure, catalogue.</li> <li>Outils de dessin sur la page au crayon feutre virtuel</li> <li>Navigation et zoom avec animation</li> <li>Barre d'outils pour intéragir : main, flèche de sélection, traçage de zone, toggle de commentaires</li> <li>Raccourcis clavier pour chaque fonction</li> <li>Création et redimensionnement de zones via des ancres similaire à InDesign</li> <li>Dépôt de commentaires (punaises, rectangles, tracés).</li> <li>Échanges xhr au format xml</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création d'un outil en Flash et Actionscript permettant de cropper une image dans une zone prédéfinie.</li> <li>Zoom / Déplacement / Rotation</li> <li>Symétries horizontales et verticales</li> <li>Saisie à la main précises des coordonnées et dimensions : x, y, angle, largeur, hauteur, scale x, scale y</li> <li>Zoom débordant ou centré dans le conteneur</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création d'un outil intéractif permettant de naviguer (déplacement / zoom) et d’ajouter des commentaires sous forme de punaise.</li> <li>Création du front - Actionscript 2 / 3</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création d'une visioneuse de documents, compatible iPad 4 et Android. Nombre de pages illimitées avec un système de tampon de 3 pages visibles à l'écran et de suppression de celles qui n'apparaissent plus pour compatibilité mémoire sur les tablettes.</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Participation à l’élaboration de l’interface et de l’ergonomie du produit.</li> <li>Rédaction de la documentation utilisateur au format web.</li> <li>Maintenance de CSS avancés dans le temps</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Intégration (découpage HTML !) HTML / CSS / Javascript de différents projets allant de boutiques en ligne / CRM / Sites événementiel / Sites luxe et back-offices</li> <li>Réalisation de maquettes avec Photoshop et Illustrator</li> <li>Réalisation de widgets HTML Ajax</li> <li>Compatibilité des navigateurs IE6 à IE11</li>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Création de la charte graphique</li> <li>Création du site internet avec WordPress</li> <li>Mise à jour régulière des contenus (auteurs, livres)</li> <li>Mise en page de livres sous QuarkXPress.</li> </ul>

<ul class="flex list-disc mx-5 flex-col gap-2 "> <li>Designé et développé plus d'une vingtaines de sites web <br> (Flash ❤️, Actionscript, PHP, MySQL, HTML, CSS, JS) pour la communauté du mode Counter-Strike du jeu Half-Life. <li>Suivi ma passion pour le graphisme et le développement et amélioré mes compétences pendant 7 ans en conception d'interface utilisateur, CSS, HTML et JavaScript</li> <li>Création de maps et du site internet pour le mod Space-Hulk d'Half-Life</li> <li>Finaliste du concours graphique le-match.com en 2005 au palais des congrès</li> </ul>