Template & Design

Ce site est basé sur le template Craftivo créé par BootstrapMade, disponible sur bootstrapmade.com. Le template a été entièrement personnalisé et adapté à mes besoins : restructuration complète des sections, modification du système de couleurs, personnalisation des animations, ajout de nouvelles fonctionnalités et optimisation du code pour correspondre à mon identité visuelle et à mes projets personnels.

Licence : Template utilisé selon les termes de la licence BootstrapMade
Version : Mise à jour d'octobre 2025 avec Bootstrap v5.3.8

Images & Photographies

Photo de profil : Photographie personnelle retouchée avec l'application Paint 3D pour optimiser le rendu et l'intégration au design du site.

Image de fond (Hero) : Image générée avec l'intelligence artificielle Gemini puis retouchée avec Paint 3D pour améliorer la clarté et l'adapter à la charte graphique du site.

Images du portfolio : La majorité des visuels de projets ont été générés avec l'intelligence artificielle Gemini pour illustrer mes réalisations. L'image du projet "Salon Hair Aude" provient de la page Facebook officielle du salon (facebook.com/profile). Pour la section Architecture, les photos sont des captures d'écran personnelles de mes réalisations sur les logiciels SketchUp et Sweet Home 3D. Les logos de ces deux logiciels proviennent respectivement de SeekLogo et de Wikipédia.

Favicon & Logo : Le logo personnel a été entièrement créé par mes soins sur Canva, reflétant mon identité visuelle. Les drapeaux français et anglais utilisés pour le sélecteur de langue proviennent d'Emojipedia. Les icônes utilisées dans l'interface (Bootstrap Icons) sont intégrées nativement au template Bootstrap et font partie de la bibliothèque open-source Bootstrap Icons.

Bibliothèques & Frameworks

Ce site utilise plusieurs bibliothèques et frameworks modernes pour garantir une expérience utilisateur optimale. Bootstrap 5.3.8 constitue la base du design responsive, permettant une adaptation parfaite sur tous les appareils. AOS (Animate On Scroll) gère les animations fluides lors du défilement de la page, apportant du dynamisme à la navigation. GLightbox permet d'afficher les images du portfolio en mode galerie avec zoom. Isotope assure le filtrage interactif des projets par catégorie. Swiper est utilisé pour créer des carrousels modernes et tactiles. Typed.js anime le texte de présentation avec un effet machine à écrire. Enfin, Waypoints détecte le défilement pour déclencher certaines animations au bon moment.

Technologies utilisées : Bootstrap 5.3.8, AOS, GLightbox, Isotope, Swiper, Typed.js, Waypoints

Typographies

Les polices utilisées proviennent de Google Fonts et ont été sélectionnées pour leur complémentarité et leur lisibilité. Roboto a été choisie pour le corps de texte grâce à sa clarté exceptionnelle et sa neutralité, garantissant une lecture confortable même sur de longs paragraphes. Mulish apporte une touche moderne et dynamique aux titres avec ses formes arrondies et son caractère contemporain. Raleway, élégante et raffinée, est parfaite pour la navigation et les éléments d'interface, créant une hiérarchie visuelle harmonieuse.

Services Externes

Le formulaire de contact de ce site utilise Formspree, un service externe qui permet de gérer l'envoi des messages sans avoir besoin de développer un backend complexe. Cette solution sécurisée et fiable traite les soumissions de formulaires et les envoie directement par email. Le site est hébergé et déployé via un service d'hébergement web professionnel, garantissant une disponibilité optimale et des performances rapides. Le nom de domaine est géré par un registrar fiable assurant la continuité du service.

Outils de Développement

Pour créer ce site, j'ai utilisé Visual Studio Code comme éditeur de code. C'est un logiciel gratuit qui facilite l'écriture du code avec de la coloration et des suggestions. J'ai utilisé Git et GitHub pour sauvegarder mon travail et suivre les modifications au fil du temps. Pour retoucher mes images, j'ai utilisé Paint 3D qui m'a permis d'améliorer et d'adapter mes visuels. Les navigateurs web (Chrome, Firefox) m'ont beaucoup aidé avec leurs outils intégrés pour tester le site sur différentes tailles d'écran. Enfin, j'ai parfois demandé de l'aide à des IA comme Claude ou ChatGPT pour corriger des erreurs dans mon code, comprendre certaines fonctions, ou vérifier mon orthographe et ma grammaire.

Inspirations & Ressources

Pour réaliser ce site, je me suis appuyé sur plusieurs ressources utiles. J'ai consulté la documentation Bootstrap pour comprendre comment utiliser les différents éléments du template. Le site MDN Web Docs m'a aidé pour les questions sur le HTML et le CSS. J'ai aussi regardé d'autres portfolios sur internet pour trouver des idées de design. Quand je rencontrais un problème, je cherchais des solutions sur Stack Overflow ou je regardais des tutoriels YouTube. J'ai également utilisé des intelligences artificielles comme Claude et ChatGPT pour m'aider à corriger mes fautes d'orthographe, déboguer mon code quand quelque chose ne fonctionnait pas, et me donner des explications sur certaines notions que je ne comprenais pas bien.

Remerciements

Je souhaite remercier mon professeur de l'IUT de Béthune pour son cours et ses explications qui m'ont permis de comprendre les bases du développement web nécessaires à ce projet. Je remercie aussi toutes les personnes qui créent des outils gratuits et partagent leurs connaissances en ligne, ce qui nous permet d'apprendre et de progresser plus facilement.