Workshop
Overview
I explored Workshop - Framer’s AI Component Generator to see how prompts could spark component ideas and speed up UI design. The experiment was about curiosity—testing how generative tools could help translate concepts into tangible UI pieces while leaving room for hands-on refinement.
Componenet Generation via Prompts
I started by describing what I wanted in words, letting AI generate initial designs. Each prompt produced multiple variations, which I then refined, adjusted and iterated on directly in Framer. The process became a loop: prompt → generate → adapt → repeat—turning ideas into components faster than I could have manually.
Splash screen with interactive particles
A splash page component that displays “Hello” in multiple languages sequentially with animated glitter particles that react to mouse movement.
Bento box
This is a responsive Bento Box grid layout component that displays 7-8 cards of varying sizes in an asymmetric masonry-style arrangement, featuring two card types: link cards with images that show a dark overlay with title and description text on hover and solid color cards for aesthetic purposes. The component automatically adjusts from a multi-column grid on desktop/tablet to a single-column layout on mobile (where solid cards are hidden), with customizable padding, gaps, colors, typography and the ability to link cards to pages.
Interactive Progress/Path Explorer
This is an interactive path explorer component that displays a customizable sequence of connected nodes (horizontal or vertical) with expandable detailed content, designed for showcasing product design workflows or project timelines.
🔍
Research
💡
Ideation
🎨
Prototype
✅
Testing
🚀
Launch