Portfolio
Designed and developed as part of the Web Design course, this project involves the creation of my interactive portfolio website. The main challenge was to design a platform that was not simply an online CV, but a genuine extension of my creative world. I chose to build the user experience (UX) around the metaphor of a book: “Websites that can be explored like a story… page by page.”
My steps
- Concept & Character Design: The first phase involved defining the visual theme. Wanting a website that felt warm and reflected my personality, I worked on character design to create my own cartoon-style avatar. This avatar appears throughout the site (reading, floating on a cloud in my journey, or next to my contact details) to guide the user.
- Site Map & Wireframes (UX): I structured the homepage so that it tells a chronological and logical story. The wireframes helped validate the layout of the sections: the introduction, the ‘skills library’ (represented by rows of books), the ‘My Projects’ section (designed as a shelf of themed books), followed by a timeline of my career, and finally the contact form.
- Visual Design (High-Fidelity) & Visual Identity: The move to high-fidelity design allowed me to harmonise the custom illustrations with the UI elements. I designed unique book covers for each of my flagship projects (such as Soundlabs, Marvel, or Les Voisins Solidaires).
- Internal Page Layout (Case Studies): I also designed the template for the internal pages. When a user clicks on a project (such as the Soundlabs example), they are taken to a clear, well-structured layout featuring the design brief, the methodology (mood board, wireframes), key features and a gallery of screenshots.
My design
- Colour palette: The website uses a harmonious combination of soft, organic tones (shades of beige, cream and chocolate brown for the footer). This choice creates a cosy, comfortable and soothing atmosphere, reminiscent of the paper in old books and the world of reading.
- Typography & Style: The combination of elegant fonts for the headings and bespoke cartoon-style illustrations strikes a perfect balance between professionalism and originality, showcasing both my design skills and my visual identity.
Key features
- The Skills Library: A fun and visual way to showcase my technical and methodological tools.
- The Projects Shelf: An interactive grid where each major project is represented as a book (Site reproduction, Plai, Portfolio, Les Voisins Solidaires, Marvel, Soundlabs).
- The “My Journey” Timeline: A poetic timeline where my avatar moves from cloud to cloud to detail my past training and experience (2020 to present).
- The Contact Section: A clear space with an integrated form, complemented by a structured chocolate-coloured footer for quick navigation.
Conclusion
This portfolio was the perfect opportunity to combine pure UX/UI design with illustration and personal branding. Creating a cohesive world based on the book, whilst designing modular web components and a seamless reading experience, allowed me to demonstrate my ability to tell a story through interface design.
Gallery
