Challenge
Needed a dynamic, full-screen photo slideshow that automatically pulls images from Google Drive and displays them in an eye-catching mosaic layout with brand styling.
🖼️ Solution
Built a full-screen slideshow with Google Drive integration:
- Auto-fetches images from Google Drive folder
- Responsive mosaic grid (2-5 columns based on screen size)
- Animated red/pink gradient overlay
- Custom "Manufacturing Consent" font branding
- Horizontal scanline background pattern
- Automatic image rotation and transitions
- Live deployment at serfdad.com
Tech Stack: HTML5, CSS3, Google Drive API, JavaScript
Status
✅ **Complete & Live**
- Deployed and running at serfdad.com
- Automatically updates when new images added to Drive folder
Next Steps
- [ ] Monitor performance and load times
- [ ] Optional: Add fade transitions between rotations
- [ ] Optional: Admin panel to control rotation speed/layout
- [ ] Future: Support for video content alongside images