Motion Depth by Sinto WahidMotion Depth | Contra
Motion Dept is a portfolio template for film and motion studios whose work moves. Every thumbnail on the home page is a sheet of fabric. Hover and it billows, click and drag to pinch it and pull it across the page, let go and it springs back flat. Switch to Index and the same projects become a list you can browse with the arrow keys, while the preview image on the left behaves like cloth too.
It suits film studios, directors, cinematographers, editors and motion designers who want visitors to touch the work before they press play.
What makes it different
The cloth is a real physics simulation, not a looping animation. Each image is a grid of points held together by springs, rendered in WebGL with light and shading on the folds, so a pinch in one corner pulls the rest of the sheet with it. It runs only while someone interacts and hands the image back to plain HTML when it settles. Visitors on touch devices or with reduced motion turned on see the images as normal, without the effect.
The Index view has its own motion. A white bar wipes across each column in blocky steps when a row becomes active. Click a row to select it, hover to peek at others, or step through with ↑ ↓, Tab and Enter.
The header clock shows each visitor's own city and local time, looked up once per visit.
What's included
You get two pages: a Grid home page and an Index page, linked by a Grid / Index toggle in the header. Both read from one Projects CMS collection with title, index number, category, year and thumbnail, and 15 sample projects with images, so the site looks finished the moment you open it.
Both pages have desktop, tablet and phone layouts. The template ships with 5 color styles and 3 text styles, set in JetBrains Mono with a Silkscreen wordmark.
Easy to make your own
The effects are three code components, and every setting is in the properties panel. Cloth Image has intensity, speed, shading, a drag on/off switch and Follow Index, which makes the preview swap to the active row. Index Row lets you change the text, highlight and active text colors. Live Clock can show the visitor's location or a fixed city and time zone of your choice, in 12 or 24 hour time. Change the color styles once and the whole site follows, components included.
Need a portfolio built around your own work instead? I take on custom Framer projects for studios and creatives. Tell me what you have in mind at hey@critain.com.
Get it for$20.00
Tags
Figma
Framer
3D
Creative Agency,
Framer Template
Interactive
Product created by
Sinto Wahid South Tangerang, Indonesia
1
Followers
Sinto's other products
Stillhouse Studio — Framer Template
$32.00
Get it for$20.00
Tags
Figma
Framer
3D
Creative Agency,
Framer Template
Interactive
Motion Dept is a portfolio template for film and motion studios whose work moves. Every thumbnail on the home page is a sheet of fabric. Hover and it billows, click and drag to pinch it and pull it across the page, let go and it springs back flat. Switch to Index and the same projects become a list you can browse with the arrow keys, while the preview image on the left behaves like cloth too.
It suits film studios, directors, cinematographers, editors and motion designers who want visitors to touch the work before they press play.
What makes it different
The cloth is a real physics simulation, not a looping animation. Each image is a grid of points held together by springs, rendered in WebGL with light and shading on the folds, so a pinch in one corner pulls the rest of the sheet with it. It runs only while someone interacts and hands the image back to plain HTML when it settles. Visitors on touch devices or with reduced motion turned on see the images as normal, without the effect.
The Index view has its own motion. A white bar wipes across each column in blocky steps when a row becomes active. Click a row to select it, hover to peek at others, or step through with ↑ ↓, Tab and Enter.
The header clock shows each visitor's own city and local time, looked up once per visit.
What's included
You get two pages: a Grid home page and an Index page, linked by a Grid / Index toggle in the header. Both read from one Projects CMS collection with title, index number, category, year and thumbnail, and 15 sample projects with images, so the site looks finished the moment you open it.
Both pages have desktop, tablet and phone layouts. The template ships with 5 color styles and 3 text styles, set in JetBrains Mono with a Silkscreen wordmark.
Easy to make your own
The effects are three code components, and every setting is in the properties panel. Cloth Image has intensity, speed, shading, a drag on/off switch and Follow Index, which makes the preview swap to the active row. Index Row lets you change the text, highlight and active text colors. Live Clock can show the visitor's location or a fixed city and time zone of your choice, in 12 or 24 hour time. Change the color styles once and the whole site follows, components included.
Need a portfolio built around your own work instead? I take on custom Framer projects for studios and creatives. Tell me what you have in mind at hey@critain.com.
Sinto's other products
Stillhouse Studio — Framer Template
$32.00
$20.00
Buy