Project Overview

This personal project involved developing a website to showcase my portfolio of both professional and personal projects. It demonstrates my cumulative skills in web development, including creating dynamic websites with extended content management, SEO optimization, and utilizing an efficient and modern tech stack.

Project Evolution

Version 1.0

• Built using an Astro theme
• Utilized plain CSS in a single file
• View the original version

Version 2.0

• Complete redesign and rebuild
• Improved branding, presentation, animations, and overall design
• Inspired by Swiss Style design principles
• View the Figma design for 2.0

Key Features

• Dynamic content management
• SEO optimization
• Responsive design
• Modular SASS for improved maintainability
• Custom animations using GSAP

Development Process

1. Initial development using an Astro theme
2. Refactoring classes and transitioning to modular SASS
3. Image optimization for improved performance
4. Complete redesign in Figma to establish a unique identity
5. Implementation of the new design with enhanced features and animations

Learning Experience

This project provided valuable insights into:

• Scalability challenges in web development
• The importance of modular and maintainable CSS
• Balancing performance with visual appeal
• The iterative nature of design and development
• Advanced Figma design techniques

Conclusion

The portfolio project showcases my ability to create a comprehensive, visually appealing, and performant web application. It demonstrates my skills in front-end development, design, and continuous improvement through iteration.

• PLATFORMWeb
• STACKAstro.js, SASS, Tailwind, GSAP