I'll build this premium "Drawer" prototype for you! Let me start by installing the animation library and generating design inspiration to nail that native iOS feel.
Now I'll update the globals.css with a dark, warm theme and build the Drawer app with all the premium animations and interactions.
Now let me create the card components and the main drawer app:
The "Drawer" prototype is complete. I've built a premium, iOS-like save-for-later app with:
Layout & Design:
- Full-screen dark background with subtle warmth and grain texture
- A drawer panel that slides up from the bottom with a springy Framer Motion animation (85% screen height)
- Frosted glass top edge with rounded corners and soft shadows
- Drag handle pill at the top
Navigation:
- 4 preset drawers: "All", "Coffee", "Wedding Invites", "Shoe Brands"
- Swipe left/right (touch), arrow keys, or click arrows to navigate
- Animated drawer name transitions and smooth pagination dots
Card Types:
- Image cards — with optional notes below
- Link cards — thumbnail, title, description, domain preview
- Voice notes — animated waveform, play/pause button, transcript snippet
- Text notes — clean typography with proper formatting
Interactions:
- Cards have scale-on-hover and tap-down micro-animations
- Floating "+" button opens a modal with 4 options to add fake/sample cards
- All animations use spring physics for that native iOS feel