My pixel-art style interactive portfolio website featuring a 2D game environment where visitors can explore and learn about my projects, background, and contact information.
- Interactive 2D Environment: Navigate through a cozy room using WASD or arrow keys
- Character Interactions: Meet NPCs representing different sections (Projects, About, Contact)
- Interactive Elements: Pet animals, play music on a gramophone
- Responsive Design: Clean modal system for content display
- Pixel Art Aesthetic: Custom sprites and animations throughout
- Frontend: HTML5, CSS3, JavaScript (ES6+)
- Graphics: HTML5 Canvas API for 2D rendering
- Audio: Web Audio API for background music
- Assets: Custom pixel art sprites and animations
- Fonts: Pixelify Sans for authentic pixel aesthetic
personal-website/
├── assets/
│ ├── audio/
│ │ ├── track1.wav
│ │ ├── track2.wav
│ │ ├── track3.wav
│ │ ├── track4.mp3
│ │ └── track5.wav
│ ├── documents/
│ │ └── Ryan_Huang RESUME.pdf
│ └── images/
│ ├── Adam_16x16.png
│ ├── Alex_idle_anim_16x16.png
│ ├── Amelia_idle_anim_16x16.png
│ ├── Bob_idle_anim_16x16.png
│ ├── bubble.png
│ ├── flower.png
│ ├── gramophone.png
│ ├── newcat.png
│ ├── newdog.png
│ └── room3.png
├── scripts/
│ └── game.js
├── styles.css
├── index.html
└── README.md
- Movement: Use WASD or arrow keys to move around
- Interactions: Press ENTER when near NPCs or interactive objects
- Content: Click on NPCs to view Projects, About, or Contact information
- Fun Elements: Pet the dog and cat, play music on the gramophone
- Visit ryanhuang.work
(or using local)
- Clone the repository
- Open
index.htmlin a web browser - Start exploring the interactive environment!
Feel free to reach out for collaborations, opportunities, or just to say hello!
- Email: ryanhuang1234567890@gmail.com
- LinkedIn: kerui-huang
Built with passion for interactive experiences and pixel art aesthetics 🎨