Comic-Themed Portfolio Website

A dynamic and interactive portfolio website with a comic book/manga aesthetic, featuring animated elements, sound effects, and a unique visual style.

🔗 Live Demo: View the Portfolio

🎨 Features

• Comic Book Aesthetics

  • Comic panel layouts
  • Speech bubble headers
  • Manga-style gutters
  • Impact lines and visual effects
  • Ink splatter cursor

• Interactive Elements

  • Hover sound effects
  • Animated skill bars
  • Dynamic project showcases
  • Responsive design
  • Custom cursor effects

• Sections

  • Character Profile (About)
  • Story Arcs (Projects)
  • Skill Arsenal
  • Contact Form

🛠️ Technologies Used

• HTML5
• CSS3 (with custom animations and effects)
• JavaScript
• Google Fonts:
  • Bangers
  • Permanent Marker
  • Kalam
  • Short Stack

📋 Project Structure

├── index.html          # Main HTML file
├── style.css          # Styles and animations
├── script.js          # Interactive features
└── README.md          # Project documentation

🚀 Getting Started

1. Clone the repository
2. Open index.html in your web browser
3. Customize the content in index.html:
   • Replace [YOUR ARTIST NAME] with your name
   • Update project descriptions and images
   • Modify skill levels and categories
   • Add your contact information

🎯 Customization

Personal Information

• Update the artist name in the title and header
• Replace the profile image placeholder
• Modify the bio text in the Character File section

Projects

• Add your own projects to the Story Arcs section
• Update project thumbnails and descriptions
• Modify project links and CTAs

Skills

• Adjust skill levels using the --skill-power CSS variable
• Change skill colors using --skill-color
• Add or remove skills as needed

Contact Information

• Update email address
• Add your social media links
• Modify contact section text

🎨 Styling

The project uses a combination of custom CSS classes and Google Fonts to create the comic book aesthetic. Key styling features include:

• Comic panel layouts with angled corners
• Speech bubble headers
• Handwritten text effects
• Dynamic hover states
• Responsive design for all screen sizes

📱 Responsive Design

The portfolio is fully responsive and works on:

• Desktop computers
• Tablets
• Mobile devices

🔧 Browser Support

• Chrome (recommended)
• Firefox
• Safari
• Edge

📄 License

This project is open source and available under the MIT License.

👥 Contributing

Feel free to fork this project and customize it for your own use. If you find any bugs or have suggestions for improvements, please open an issue or submit a pull request.

📞 Contact

For any questions or suggestions, please open an issue in the repository.

---

Made with ❤️ and lots of comic book inspiration by Rc Guevarra and John Clyde Kaindoy!