Build Blocks / Free edition
Let the image have a second side.
A cold-blue concertina image component with expandable folds, crop-focus control and a real reverse-side story. Editable Framer source and a working HTML edition included.
One editable Framer component · Three replaceable panels · Crop-focus control, reverse-side stories + offline HTML edition
A working example. Open the live demo to explore the interactions.
Inside the free edition.
01 / 1 independent editable Framer component, ApertureDeck
02 / A working offline HTML/CSS/JavaScript edition
03 / 3 original AI-assisted fictional nature-and-technology artworks
04 / Expandable concertina folds with visible optical depth
05 / Separate 0–100% image-focus settings for each fold
06 / A reverse side with story, materials, approach and destination link
07 / Keyboard selection, phone layout, motion pause, reset and reduced-motion support
08 / English setup guide and free license for multiple finished commercial websites
Give each image a second side.
01 / Add the component
Extract the ZIP and open index.html for the local edition. Use the insert link below to add ApertureDeck to a Framer page, or import ApertureDeck.tsx. Set the component to Fill width and Fit Content height.
02 / Fill the folds
Replace the three panel images, titles and summaries. Add a reverse-side story, materials, approach and destination link for each panel. Update the guide link as well. The included guide points to the exact property controls and HTML config.
03 / Try both sides
Select a fold by clicking or using the arrow, Home and End keys. Move its focus slider, turn it over and follow the story link. Check all three folds on a phone, and try Pause motion. Each fold remembers its own crop focus during the session.
Insert the Framer component.
Free for the work you finish.
Use and adapt this edition in multiple completed personal, commercial and client projects. Credit is optional. Keep the reusable source and assets inside your finished design rather than repackaging or redistributing them as another resource. The ZIP includes the full license and English guide.
Get the free files
Wuren Studio. Digital goods with a point of view.
Paid orders and delivery are handled by Lemon Squeezy.
For order or product issues, use the seller contact shown on your receipt.