Template & Design

This website is based on the Craftivo template created by BootstrapMade, available on bootstrapmade.com. The template has been completely customized and adapted to my needs: full restructuring of sections, modification of the color system, customization of animations, addition of new features, and code optimization to match my visual identity and personal projects.

License: Template used under BootstrapMade license terms
Version: October 2025 update with Bootstrap v5.3.8

Images & Photography

Profile photo: Personal photograph edited with Paint 3D application to optimize the rendering and integration into the website design.

Background image (Hero): Image generated with Gemini artificial intelligence and then edited with Paint 3D to improve clarity and adapt it to the website's visual identity.

Portfolio images: Most of the project visuals were generated with Gemini artificial intelligence to illustrate my work. The "Salon Hair Aude" project image comes from the salon's official Facebook page (facebook.com/profile). For the Architecture section, the photos are personal screenshots of my work on SketchUp and Sweet Home 3D software. The logos of these two software come from SeekLogo and Wikipedia respectively.

Favicon & Logo: The personal logo was entirely created by me on Canva, reflecting my visual identity. The French and English flags used for the language selector come from Emojipedia. The icons used in the interface (Bootstrap Icons) are natively integrated into the Bootstrap template and are part of the open-source Bootstrap Icons library.

Libraries & Frameworks

This website uses several modern libraries and frameworks to ensure an optimal user experience. Bootstrap 5.3.8 forms the basis of the responsive design, allowing perfect adaptation on all devices. AOS (Animate On Scroll) manages smooth animations when scrolling through the page, bringing dynamism to navigation. GLightbox displays portfolio images in gallery mode with zoom. Isotope provides interactive filtering of projects by category. Swiper is used to create modern and touch-friendly carousels. Typed.js animates the presentation text with a typewriter effect. Finally, Waypoints detects scrolling to trigger certain animations at the right time.

Technologies used: Bootstrap 5.3.8, AOS, GLightbox, Isotope, Swiper, Typed.js, Waypoints

Typography

The fonts used come from Google Fonts and were selected for their complementarity and readability. Roboto was chosen for body text thanks to its exceptional clarity and neutrality, ensuring comfortable reading even on long paragraphs. Mulish brings a modern and dynamic touch to headings with its rounded shapes and contemporary character. Raleway, elegant and refined, is perfect for navigation and interface elements, creating a harmonious visual hierarchy.

External Services

The contact form on this website uses Formspree, an external service that manages message sending without needing to develop a complex backend. This secure and reliable solution processes form submissions and sends them directly by email. The website is hosted and deployed via a professional web hosting service, ensuring optimal availability and fast performance. The domain name is managed by a reliable registrar ensuring service continuity.

Development Tools

To create this website, I used Visual Studio Code as my code editor. It's a free software that makes writing code easier with color coding and suggestions. I used Git and GitHub to save my work and track changes over time. To edit my images, I used Paint 3D which allowed me to improve and adapt my visuals. Web browsers (Chrome, Firefox) helped me a lot with their built-in tools to test the website on different screen sizes. Finally, I sometimes asked for help from AI assistants like Claude or ChatGPT to fix errors in my code, understand certain functions, or check my spelling and grammar.

Inspirations & Resources

To create this website, I relied on several useful resources. I consulted the Bootstrap documentation to understand how to use the different template elements. The MDN Web Docs website helped me with questions about HTML and CSS. I also looked at other portfolios online to find design ideas. When I encountered a problem, I searched for solutions on Stack Overflow or watched YouTube tutorials. I also used artificial intelligence tools like Claude and ChatGPT to help me correct spelling mistakes, debug my code when something wasn't working, and get explanations on certain concepts I didn't understand well.

Acknowledgments

I would like to thank my professor at IUT de Béthune for his course and explanations that allowed me to understand the basics of web development necessary for this project. I also thank all the people who create free tools and share their knowledge online, which allows us to learn and progress more easily.