50:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/2560d2n15vwt0.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/139qrzcz9lv4a.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/382a8k30zyobj.js","/creators-assets/_next/static/immutable/chunks/29nnfbif7huoh.js","/creators-assets/_next/static/immutable/chunks/0wtdx5gy0autr.js","/creators-assets/_next/static/immutable/chunks/228u8o-g1d1_g.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/1jp3s4ouxoyr3.js","/creators-assets/_next/static/immutable/chunks/2ghns2teubdvo.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3ogkzi2dwy7m5.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/2hnfu5uxkt8n0.js","/creators-assets/_next/static/immutable/chunks/0hkuwyfzgyt29.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/0_fhuyoczujnr.js","/creators-assets/_next/static/immutable/chunks/0b95zai6bhh8l.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/1fkcqskfw4hol.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2qhn_o-66b-q9.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3lqafyeq6rldt.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/2di2v55rtz-8i.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/1zvmc9yy7z5jg.js"],"S"] 51:T449,

Exploring scroll-driven storytelling through 3D.

I built an independent JioBlackRock-inspired landing page concept featuring a custom 3D coin that rotates between brand states as you scroll. Created with Framer and Blender, this experiment explores the intersection of interaction design, motion, and immersive web experiences.

This is an independent concept project, not an official JioBlackRock website.

Available for freelance projects: I help startups, brands, and agencies build premium Framer websites with custom interactions, scroll-driven animations, and immersive 3D experiences. If you're looking for a designer and developer for your next web project, let's connect.

🔗 https://sartisticway.in/jbr

🌐 https://sartisticway.in

52:T6d5,

JioBlackRock — 3D Interactive Landing Page Concept

An independent design exploration reimagining JioBlackRock's digital presence through immersive 3D, scroll-driven interactions, and cinematic visual storytelling.

At the heart of the experience is a custom 3D coin representing the Jio and BlackRock brands. As users scroll through the landing page, the coin rotates, transitions between brand states, shifts in scale, and moves through carefully choreographed visual phases. The interaction transforms scrolling from a simple navigation action into a more engaging storytelling device.

Designed and developed as an experimental web experience, the project explores the intersection of interaction design, 3D visualization, motion design, and creative development. Built with Framer and custom 3D assets created in Blender, the concept investigates how motion and spatial transitions can bring greater depth to a financial brand's digital experience.

The goal is to move beyond conventional landing-page layouts and explore a more immersive approach to brand communication, combining a distinctive visual identity with scroll-led narrative, purposeful animation, and a contemporary web aesthetic.

Project focus:

3D web design, interactive landing pages, scroll-driven animation, motion design, Framer development, and immersive brand experiences.

This is an independent concept project created for design exploration and portfolio purposes. It is not an official JioBlackRock project and is not affiliated with the brand.

Available for freelance collaborations on immersive websites, interactive brand experiences, and custom Framer projects.

53:T55e,

🎮 I turned my portfolio into a game.

Instead of another static “Skills” section, I wanted to make people experience it.

So I built a small interactive arcade where you can:

🚀 Pick a ship 💥 Dodge & blast ✦ Collect my skills 🎯 Try to beat your high score

The idea was simple: don’t just show what I can design — make the portfolio itself part of the experience.

I wanted to explore what happens when product design, interaction design, creative technology, and gameplay come together.

Built with Framer, React Three Fiber, Three.js, GSAP, and AI-assisted workflows.

It’s a small experiment, but it reflects the kind of designer I’m becoming — someone who doesn’t just design interfaces, but designs experiences.

🎮 Play it → sartisticway.in

Would you play through a portfolio instead of scrolling through one?

#Framer #InteractionDesign #ProductDesign #CreativeTechnology #UXDesign #ThreeJS #WebDesign #DesignPortfolio

54:T947,

Virtual Screen Fold Pro connects your interface to the physical movement of a laptop screen.

Inspired by Apple Duo’s fold interaction concept, this experimental Framer component uses camera-based tracking to create a progressive 3D fold with blur and dimming.

How it works

Enable Camera Fold, allow camera access, and keep your face visible during automatic calibration. Slowly lower your laptop lid to fold the interface, then raise it to return to the open state. Tracking estimates movement through the camera rather than measuring the hinge angle.

Camera or Manual

Use camera tracking for the physical interaction, or choose a manual slider to control the fold without camera access.

Features

Automatic calibration and recalibration • Face and upper-body tracking
Progressive 3D folding, layered blur, and dimming
Tracking pauses offscreen and in hidden tabs
Reduced-motion support and static canvas preview
Multiple fixed nodes with individual positioning

Customization

An organized property panel lets you edit button text, fonts, colors, labels, spacing, positioning, and fold effects. Adjust slider width, track height, and thumb size. Place camera or slider labels above, below, left, or right.

Connect your content

Connect your page frame through Content. Use Fixed Nodes and Node Layouts for navigation or other elements that stay anchored during scrolling and fold with the interface.

Try it

Camera tracking is inactive on the Framer canvas. Click Show Preview. If camera access is restricted, open the published site in a new tab.

Requirements

HTTPS or localhost, camera permission, and a compatible browser and camera. Best with a laptop’s built-in camera, good lighting, and one person in view. Sudden movement or low light can interrupt tracking.

Frames are processed locally. No recording or microphone is requested.

Built with Framer · React · TypeScript · MediaPipe

4f:["$","$L50",null,{"value":{"fallback":{"$inf$activity-creator-7a5166cf-d531-42d0-b5cf-ad6fe35c2e91-all:/unified/creator/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/activity/":[{"data":[{"id":"01a138f3-ee13-751c-a711-aafba01c985a","type":"creator.followed","target":{"type":"creator","id":"ffa09057-21bc-47ab-8deb-9028e0a74be1","preview":"Outumn","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/ffa09057-21bc-47ab-8deb-9028e0a74be1/t0nog86g","slug":"outumn","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-14T05:47:52.719Z","latestAt":"2026-10-14T05:47:52.719Z"},{"id":"01a136d5-49d6-776b-aac0-67c4988200cf","type":"creator.followed","target":{"type":"creator","id":"6e4f8380-d6cb-4655-93f2-b81f15adf506","preview":"Apex Interactive","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/6e4f8380-d6cb-4655-93f2-b81f15adf506/c4a9hfpi","slug":"apex-interactive","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-13T19:55:10.161Z","latestAt":"2026-10-13T19:55:10.161Z"},{"id":"01a134e6-17a2-77be-a4e7-402ab2e6d9ff","type":"site.created","target":{"type":"site","id":"18362","preview":"3D Interaction","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a134eb-24a1-766c-9f3d-10ad08488efc.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"site","visibility":"public","startedAt":"2026-10-13T10:54:16.994Z","latestAt":"2026-10-13T10:54:16.994Z"},{"id":"01a13078-f9da-70df-82a2-132b80cb5ece","type":"site.created","target":{"type":"site","id":"18328","preview":"3D Portfolio","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a13068-e0b1-7445-876d-847cf51913ad.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"site","visibility":"public","startedAt":"2026-10-12T14:16:37.082Z","latestAt":"2026-10-12T14:16:37.082Z"},{"id":"01a0f73b-48e8-70fe-8af6-a2665bc7b944","type":"comment.reply","target":{"type":"post","id":"01a0f086-7c22-757d-9c47-9c9650ed6531","preview":"🎮 I turned my portfolio into a game.\nInstead of another static “Skills” section, I wanted to make people experience it.\nSo I built a small interactive arcade where you can:\n🚀 Pick a ship 💥 Dodge & blast ✦ Collect my skills 🎯 Try to beat your high score\nThe idea was simple: don’t just show what I can design — make the portfolio itself part of the experience.\nI wanted to explore what happens when product design, interaction design, creative technology, and gameplay come together.\nBuilt with Framer, React Three Fiber, Three.js, GSAP, and AI-assisted workflows.\nIt’s a small experiment, but it reflects the kind of designer I’m becoming — someone who doesn’t just design interfaces, but designs experiences.\n🎮 Play it → sartisticway.in\nWould you play through a portfolio instead of scrolling through one?\n#Framer #InteractionDesign #ProductDesign #CreativeTechnology #UXDesign #ThreeJS #WebDesign #DesignPortfolio","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"🎮 I turned my portfolio into a game."}]},{"type":"paragraph","content":[{"type":"text","text":"Instead of another static “Skills” section, I wanted to make people "},{"type":"text","text":"experience","marks":[{"type":"bold"}]},{"type":"text","text":" it."}]},{"type":"paragraph","content":[{"type":"text","text":"So I built a small interactive arcade where you can:"}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}},{"type":"text","text":" Pick a ship "},{"type":"emoji","attrs":{"name":"boom","emoji":"💥"}},{"type":"text","text":" Dodge & blast ✦ Collect my skills "},{"type":"emoji","attrs":{"name":"dart","emoji":"🎯"}},{"type":"text","text":" Try to beat your high score"}]},{"type":"paragraph","content":[{"type":"text","text":"The idea was simple: "},{"type":"text","text":"don’t just show what I can design — make the portfolio itself part of the experience.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"I wanted to explore what happens when "},{"type":"text","text":"product design, interaction design, creative technology, and gameplay","marks":[{"type":"bold"}]},{"type":"text","text":" come together."}]},{"type":"paragraph","content":[{"type":"text","text":"Built with "},{"type":"text","text":"Framer, React Three Fiber, Three.js, GSAP, and AI-assisted workflows.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"It’s a small experiment, but it reflects the kind of designer I’m becoming — "},{"type":"text","text":"someone who doesn’t just design interfaces, but designs experiences.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"🎮 "},{"type":"text","text":"Play it → ","marks":[{"type":"bold"}]},{"type":"text","text":"sartisticway.in","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"http://sartisticway.in","target":"_blank"}},{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Would you play through a portfolio instead of scrolling through one?"}]},{"type":"paragraph","content":[{"type":"text","text":"#Framer #InteractionDesign #ProductDesign #CreativeTechnology #UXDesign #ThreeJS #WebDesign #DesignPortfolio"}]}]},"thumbnail":"https://image.mux.com/lUmsAryQ5s1kuFFAhAB1x601I00vkC1tVrknjE7tLHwKo/thumbnail.webp?time=45.567","targetDeleted":false,"owned":true,"actions":{"postId":"01a0f086-7c22-757d-9c47-9c9650ed6531","like":{"count":10,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":{"type":"comment","id":"01a0f73b-48a6-705a-bdb1-de02385b4540","preview":"Thanks, Pavlo! I used AI as a coding partner, but the interaction architecture, game logic and R3F structure were directed by me. The interesting part was figuring out how to make the AI-generated pieces work together as an actual interactive experience.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Thanks, Pavlo! I used AI as a coding partner, but the interaction architecture, game logic and R3F structure were directed by me. The interesting part was figuring out how to make the AI-generated pieces work together as an actual interactive experience."}]}]},"thumbnail":null,"targetDeleted":false,"owned":true,"actions":{"postId":"01a0f086-7c22-757d-9c47-9c9650ed6531","like":{"count":0,"liked":false},"reply":{"parentCommentId":"01a0f648-2a69-743c-8ef1-f56c77c6c30c"},"repost":null}},"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-01T11:30:52.776Z","latestAt":"2026-10-01T11:30:52.776Z"},{"id":"01a0f73b-15ae-71b9-ab37-7ae0fcf82593","type":"comment.liked","target":{"type":"comment","id":"01a0f648-2a69-743c-8ef1-f56c77c6c30c","preview":"The arcade framing is doing real work here. Curious how you kept the R3F canvas from eating scroll and pointer events on the non-game UI bits.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"The arcade framing is doing real work here. Curious how you kept the R3F canvas from eating scroll and pointer events on the non-game UI bits."}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"01a0f086-7c22-757d-9c47-9c9650ed6531","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a0f648-2a69-743c-8ef1-f56c77c6c30c"},"repost":null}},"context":{"type":"post","id":"01a0f086-7c22-757d-9c47-9c9650ed6531","preview":"🎮 I turned my portfolio into a game.\nInstead of another static “Skills” section, I wanted to make people experience it.\nSo I built a small interactive arcade where you can:\n🚀 Pick a ship 💥 Dodge & blast ✦ Collect my skills 🎯 Try to beat your high score\nThe idea was simple: don’t just show what I can design — make the portfolio itself part of the experience.\nI wanted to explore what happens when product design, interaction design, creative technology, and gameplay come together.\nBuilt with Framer, React Three Fiber, Three.js, GSAP, and AI-assisted workflows.\nIt’s a small experiment, but it reflects the kind of designer I’m becoming — someone who doesn’t just design interfaces, but designs experiences.\n🎮 Play it → sartisticway.in\nWould you play through a portfolio instead of scrolling through one?\n#Framer #InteractionDesign #ProductDesign #CreativeTechnology #UXDesign #ThreeJS #WebDesign #DesignPortfolio","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"🎮 I turned my portfolio into a game."}]},{"type":"paragraph","content":[{"type":"text","text":"Instead of another static “Skills” section, I wanted to make people "},{"type":"text","text":"experience","marks":[{"type":"bold"}]},{"type":"text","text":" it."}]},{"type":"paragraph","content":[{"type":"text","text":"So I built a small interactive arcade where you can:"}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}},{"type":"text","text":" Pick a ship "},{"type":"emoji","attrs":{"name":"boom","emoji":"💥"}},{"type":"text","text":" Dodge & blast ✦ Collect my skills "},{"type":"emoji","attrs":{"name":"dart","emoji":"🎯"}},{"type":"text","text":" Try to beat your high score"}]},{"type":"paragraph","content":[{"type":"text","text":"The idea was simple: "},{"type":"text","text":"don’t just show what I can design — make the portfolio itself part of the experience.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"I wanted to explore what happens when "},{"type":"text","text":"product design, interaction design, creative technology, and gameplay","marks":[{"type":"bold"}]},{"type":"text","text":" come together."}]},{"type":"paragraph","content":[{"type":"text","text":"Built with "},{"type":"text","text":"Framer, React Three Fiber, Three.js, GSAP, and AI-assisted workflows.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"It’s a small experiment, but it reflects the kind of designer I’m becoming — "},{"type":"text","text":"someone who doesn’t just design interfaces, but designs experiences.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"🎮 "},{"type":"text","text":"Play it → ","marks":[{"type":"bold"}]},{"type":"text","text":"sartisticway.in","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"http://sartisticway.in","target":"_blank"}},{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Would you play through a portfolio instead of scrolling through one?"}]},{"type":"paragraph","content":[{"type":"text","text":"#Framer #InteractionDesign #ProductDesign #CreativeTechnology #UXDesign #ThreeJS #WebDesign #DesignPortfolio"}]}]},"thumbnail":"https://image.mux.com/lUmsAryQ5s1kuFFAhAB1x601I00vkC1tVrknjE7tLHwKo/thumbnail.webp?time=45.567","targetDeleted":false,"owned":true,"actions":{"postId":"01a0f086-7c22-757d-9c47-9c9650ed6531","like":{"count":10,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-01T11:30:39.657Z","latestAt":"2026-10-01T11:30:39.657Z"},{"id":"01a0f739-d9a8-7778-8368-66a2e5f8d062","type":"creator.followed","target":{"type":"creator","id":"968eff1d-454e-43fd-bed5-a47dac6d92cf","preview":"Pavlo Zhydkykh","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/364632/avatar-Wss7Akqr96XCEmFiZdCcxsoKSx8sS0.jpg","slug":"paulo-zhh","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-01T11:29:18.737Z","latestAt":"2026-10-01T11:29:18.737Z"},{"id":"01a0ae87-5779-72b1-8b6c-855f2148daef","type":"creator.followed","target":{"type":"creator","id":"09bc3e24-752b-4a1b-97c2-ab8d755f63b8","preview":"Tauhid Hasan","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/09bc3e24-752b-4a1b-97c2-ab8d755f63b8/4taurhlo","slug":"tauhiduiux","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-09-17T08:41:40.467Z","latestAt":"2026-09-17T08:41:40.467Z"},{"id":"01a0ae87-539c-71ad-aeec-36c992f662d6","type":"creator.followed","target":{"type":"creator","id":"d7b633f0-85d0-4e75-b61f-08c45984e34b","preview":"PixlForm®","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d7b633f0-85d0-4e75-b61f-08c45984e34b/pdzpgzrh","slug":"pixl-form","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-09-17T08:41:39.472Z","latestAt":"2026-09-17T08:41:39.472Z"},{"id":"01a0aa54-c51c-71d5-a6ac-5f7160bca9c4","type":"component.created","target":{"type":"component","id":"25vMKF7xR13Su4KCgKlj","preview":"Apple Duo's effect","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a0aa3e-20cf-7166-b947-fb4f2cc9beb9.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","slug":"sartisticway","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-09-16T13:07:57.340Z","latestAt":"2026-09-16T13:07:57.340Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:7a5166cf-d531-42d0-b5cf-ad6fe35c2e91:/unified/posts/?creator=7a5166cf-d531-42d0-b5cf-ad6fe35c2e91&with=reposts":[{"data":[{"id":"01a134e6-1519-75c6-a519-8805ae614771","title":null,"body":"$51","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Exploring scroll-driven storytelling through 3D."}]},{"type":"paragraph","content":[{"type":"text","text":"I built an independent JioBlackRock-inspired landing page concept featuring a custom 3D coin that rotates between brand states as you scroll. Created with Framer and Blender, this experiment explores the intersection of interaction design, motion, and immersive web experiences."}]},{"type":"paragraph","content":[{"type":"text","text":"This is an independent concept project, not an official JioBlackRock website."}]},{"type":"paragraph","content":[{"type":"text","text":"Available for freelance projects:","marks":[{"type":"bold"}]},{"type":"text","text":" I help startups, brands, and agencies build premium Framer websites with custom interactions, scroll-driven animations, and immersive 3D experiences. If you're looking for a designer and developer for your next web project, let's connect."}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"link","emoji":"🔗"}},{"type":"text","text":" "},{"type":"text","text":"https://sartisticway.in/jbr","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://sartisticway.in/jbr","target":"_blank"}}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"globe_with_meridians","emoji":"🌐"}},{"type":"text","text":" "},{"type":"text","text":"https://sartisticway.in","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://sartisticway.in","target":"_blank"}}]}]}]},"author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[],"resources":[{"id":"18362","resolved":true,"title":"3D Interaction","body":"$52","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"JioBlackRock — 3D Interactive Landing Page Concept","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"An independent design exploration reimagining JioBlackRock's digital presence through immersive 3D, scroll-driven interactions, and cinematic visual storytelling."}]},{"type":"paragraph","content":[{"type":"text","text":"At the heart of the experience is a custom 3D coin representing the Jio and BlackRock brands. As users scroll through the landing page, the coin rotates, transitions between brand states, shifts in scale, and moves through carefully choreographed visual phases. The interaction transforms scrolling from a simple navigation action into a more engaging storytelling device."}]},{"type":"paragraph","content":[{"type":"text","text":"Designed and developed as an experimental web experience, the project explores the intersection of interaction design, 3D visualization, motion design, and creative development. Built with Framer and custom 3D assets created in Blender, the concept investigates how motion and spatial transitions can bring greater depth to a financial brand's digital experience."}]},{"type":"paragraph","content":[{"type":"text","text":"The goal is to move beyond conventional landing-page layouts and explore a more immersive approach to brand communication, combining a distinctive visual identity with scroll-led narrative, purposeful animation, and a contemporary web aesthetic."}]},{"type":"paragraph"},{"type":"paragraph","content":[{"type":"text","text":"Project focus:","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"3D web design, interactive landing pages, scroll-driven animation, motion design, Framer development, and immersive brand experiences."}]},{"type":"paragraph","content":[{"type":"text","text":"This is an independent concept project created for design exploration and portfolio purposes. It is not an official JioBlackRock project and is not affiliated with the brand."}]},{"type":"paragraph","content":[{"type":"text","text":"Available for freelance collaborations on immersive websites, interactive brand experiences, and custom Framer projects."}]}]},"introduction":"","slug":"3d-interaction","author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a134eb-24a1-766c-9f3d-10ad08488efc.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1877,"height":1086}},{"type":"video","url":"https://stream.mux.com/olhYdqzrRe3LlKeEMCgy96qlaty00i02wU5RxPPnoWp5M.m3u8","metadata":{"posterUrl":"https://image.mux.com/olhYdqzrRe3LlKeEMCgy96qlaty00i02wU5RxPPnoWp5M/thumbnail.webp?time=8.1","aspectRatio":"4:3","duration":15.109333}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a134e0-496e-76ca-8aa6-f7817a50cbc6.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1877,"height":1082}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a134e0-489f-724c-ba83-e5b240cdcb9b.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1877,"height":1082}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a134e0-48a8-750d-a1eb-c6a2116f5e5c.png","metadata":{"tint":{"h":240,"s":50,"l":6},"width":1876,"height":1082}}],"post":null,"createdAt":"2026-10-13T10:54:15.639Z","updatedAt":"2026-10-13T11:01:03.448Z","publishedAt":"2026-10-13T10:54:15.635Z","featuredAt":null,"approvedAt":null,"type":"site","attributes":{"url":"https://sartisticway.in/jbr/","categories":[{"id":"b65821c4-e205-4861-a28b-1623536037f7","name":"Landing Page","slug":"landing-page"},{"id":"ddd39099-5b17-42e0-b333-7b7c480a114f","name":"Business","slug":"business"}],"mainCategory":null,"styles":[],"tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":4,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-10-13T10:54:16.349Z","updatedAt":"2026-10-13T10:54:16.349Z"},{"id":"01a13078-f69d-746b-a837-dffaaa20f161","title":null,"body":"

Exploring the possibilities of Framer through 3D visuals, scroll-driven interactions, and cinematic motion.

This portfolio project combines interaction design, Blender, and custom code to create a more immersive web experience.

I'm continuing to push my skills in Framer and creative development. Feedback and suggestions are welcome!

#Framer #InteractionDesign #3DWebDesign

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Exploring the possibilities of Framer through 3D visuals, scroll-driven interactions, and cinematic motion."}]},{"type":"paragraph","content":[{"type":"text","text":"This portfolio project combines interaction design, Blender, and custom code to create a more immersive web experience."}]},{"type":"paragraph","content":[{"type":"text","text":"I'm continuing to push my skills in Framer and creative development. Feedback and suggestions are welcome!"}]},{"type":"paragraph","content":[{"type":"text","text":"#Framer #InteractionDesign #3DWebDesign"}]}]},"author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[],"resources":[{"id":"18328","resolved":true,"title":"3D Portfolio","body":"

An immersive portfolio experience combining interaction design, 3D visuals, and scroll-driven storytelling. Built with Framer, Blender, and custom code, the project explores cinematic 3D animations, interactive elements, and smooth transitions to create a distinctive digital experience. Designed to push the boundaries of what’s possible on the web while balancing visual impact, usability, and performance.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"An immersive portfolio experience combining interaction design, 3D visuals, and scroll-driven storytelling. Built with Framer, Blender, and custom code, the project explores cinematic 3D animations, interactive elements, and smooth transitions to create a distinctive digital experience. Designed to push the boundaries of what’s possible on the web while balancing visual impact, usability, and performance."}]}]},"introduction":"","slug":"3d-portfolio","author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/ESHGfz01021snj2AXrZAgx5ifVo9Mz01wPF4YJUU1RCpZw.m3u8","metadata":{"posterUrl":"https://image.mux.com/ESHGfz01021snj2AXrZAgx5ifVo9Mz01wPF4YJUU1RCpZw/thumbnail.webp?time=1.781","aspectRatio":"30:53","duration":20.657178}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a13068-e0b1-7445-876d-847cf51913ad.png","metadata":{"tint":{"h":240,"s":17,"l":19},"width":1895,"height":1093}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a13067-5a8f-7258-9d94-5e500d965781.png","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1881,"height":1026}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a1306a-2393-7189-a404-2a8514902bcb.png","metadata":{"tint":{"h":0,"s":53,"l":66},"width":1881,"height":1088}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a1306a-be91-7619-b19b-05905e3c8374.png","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1882,"height":1097}}],"post":null,"createdAt":"2026-10-12T14:16:35.579Z","updatedAt":"2026-10-12T14:27:31.265Z","publishedAt":"2026-10-12T14:16:35.577Z","featuredAt":null,"approvedAt":null,"type":"site","attributes":{"url":"https://sartisticway.in/","categories":[{"id":"6a730e3d-bdf2-42a2-ab42-eee5ef39b694","name":"Portfolio","slug":"portfolio"},{"id":"cb1ce5d0-8749-428e-b0d8-917786928ffd","name":"Personal","slug":"personal"},{"id":"ddd39099-5b17-42e0-b333-7b7c480a114f","name":"Business","slug":"business"}],"mainCategory":{"id":"0b134cec-b821-43a1-bf83-bd40505d9685","name":"Design","slug":"portfolio-design"},"styles":[{"id":"2940d298-d28f-4433-86ea-79ab7f17264b","name":"Futuristic","slug":"futuristic"}],"tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":7,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-10-12T14:16:36.253Z","updatedAt":"2026-10-12T14:16:36.253Z"},{"id":"01a0f086-7c22-757d-9c47-9c9650ed6531","title":null,"body":"$53","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"🎮 I turned my portfolio into a game."}]},{"type":"paragraph","content":[{"type":"text","text":"Instead of another static “Skills” section, I wanted to make people "},{"type":"text","text":"experience","marks":[{"type":"bold"}]},{"type":"text","text":" it."}]},{"type":"paragraph","content":[{"type":"text","text":"So I built a small interactive arcade where you can:"}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}},{"type":"text","text":" Pick a ship "},{"type":"emoji","attrs":{"name":"boom","emoji":"💥"}},{"type":"text","text":" Dodge & blast ✦ Collect my skills "},{"type":"emoji","attrs":{"name":"dart","emoji":"🎯"}},{"type":"text","text":" Try to beat your high score"}]},{"type":"paragraph","content":[{"type":"text","text":"The idea was simple: "},{"type":"text","text":"don’t just show what I can design — make the portfolio itself part of the experience.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"I wanted to explore what happens when "},{"type":"text","text":"product design, interaction design, creative technology, and gameplay","marks":[{"type":"bold"}]},{"type":"text","text":" come together."}]},{"type":"paragraph","content":[{"type":"text","text":"Built with "},{"type":"text","text":"Framer, React Three Fiber, Three.js, GSAP, and AI-assisted workflows.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"It’s a small experiment, but it reflects the kind of designer I’m becoming — "},{"type":"text","text":"someone who doesn’t just design interfaces, but designs experiences.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"🎮 "},{"type":"text","text":"Play it → ","marks":[{"type":"bold"}]},{"type":"text","text":"sartisticway.in","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"http://sartisticway.in","target":"_blank"}},{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Would you play through a portfolio instead of scrolling through one?"}]},{"type":"paragraph","content":[{"type":"text","text":"#Framer #InteractionDesign #ProductDesign #CreativeTechnology #UXDesign #ThreeJS #WebDesign #DesignPortfolio"}]}]},"author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/lUmsAryQ5s1kuFFAhAB1x601I00vkC1tVrknjE7tLHwKo.m3u8","metadata":{"posterUrl":"https://image.mux.com/lUmsAryQ5s1kuFFAhAB1x601I00vkC1tVrknjE7tLHwKo/thumbnail.webp?time=45.567","aspectRatio":"16:9","duration":58.276}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":10,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-30T04:15:40.582Z","updatedAt":"2026-09-30T04:15:40.582Z"},{"id":"01a0aa54-c2e7-74d8-8e42-0818a053ce9d","title":null,"body":"

Your laptop lid just became an interaction.

Introducing Apple Duo Fold — a camera-powered Framer component inspired by Apple Duo’s fold interaction concept.

🖥 Move the lid → the interface follows

📷 Camera tracking → physical movement becomes digital input

🎚 Manual control → precise fallback when camera isn't available

Built for portfolios, landing pages, product showcases, and experimental web experiences.

Try the interaction → https://camera-fold-sp.framer.website/

Available for $19.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Your laptop lid just became an interaction."}]},{"type":"paragraph","content":[{"type":"text","text":"Introducing Apple Duo Fold — a camera-powered Framer component inspired by Apple Duo’s fold interaction concept."}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"desktop_computer","emoji":"🖥"}},{"type":"text","text":" Move the lid → the interface follows"}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"camera","emoji":"📷"}},{"type":"text","text":" Camera tracking → physical movement becomes digital input"}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"level_slider","emoji":"🎚"}},{"type":"text","text":" Manual control → precise fallback when camera isn't available"}]},{"type":"paragraph","content":[{"type":"text","text":"Built for portfolios, landing pages, product showcases, and experimental web experiences."}]},{"type":"paragraph","content":[{"type":"text","text":"Try the interaction → "},{"type":"text","text":"https://camera-fold-sp.framer.website/","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://camera-fold-sp.framer.website/","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"Available for $19."}]}]},"author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[],"resources":[{"id":"25vMKF7xR13Su4KCgKlj","resolved":true,"title":"Apple Duo's effect","body":"$54","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Virtual Screen Fold Pro","marks":[{"type":"bold"}]},{"type":"text","text":" connects your interface to the physical movement of a laptop screen."}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Inspired by Apple Duo’s fold interaction concept, this experimental Framer component uses camera-based tracking to create a progressive 3D fold with blur and dimming."}]},{"type":"paragraph"},{"type":"customHeading","content":[{"type":"text","text":"How it works","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Enable Camera Fold, allow camera access, and keep your face visible during automatic calibration. Slowly lower your laptop lid to fold the interface, then raise it to return to the open state. Tracking estimates movement through the camera rather than measuring the hinge angle."}]},{"type":"paragraph"},{"type":"customHeading","content":[{"type":"text","text":"Camera or Manual","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Use camera tracking for the physical interaction, or choose a manual slider to control the fold without camera access."}]},{"type":"paragraph"},{"type":"customHeading","content":[{"type":"text","text":"Features","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Automatic calibration and recalibration • Face and upper-body tracking "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Progressive 3D folding, layered blur, and dimming"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Tracking pauses offscreen and in hidden tabs "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Reduced-motion support and static canvas preview "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Multiple fixed nodes with individual positioning"}]},{"type":"paragraph"}]}]},{"type":"customHeading","content":[{"type":"text","text":"Customization","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"An organized property panel lets you edit button text, fonts, colors, labels, spacing, positioning, and fold effects. Adjust slider width, track height, and thumb size. Place camera or slider labels above, below, left, or right."}]},{"type":"paragraph"},{"type":"customHeading","content":[{"type":"text","text":"Connect your content","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Connect your page frame through Content. Use Fixed Nodes and Node Layouts for navigation or other elements that stay anchored during scrolling and fold with the interface."}]},{"type":"customHeading","content":[{"type":"text","text":"Try it","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Camera tracking is inactive on the Framer canvas. Click Show Preview. If camera access is restricted, open the published site in a new tab."}]},{"type":"paragraph"},{"type":"customHeading","content":[{"type":"text","text":"Requirements","marks":[{"type":"bold"}]}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":" HTTPS or "},{"type":"text","text":"localhost","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"http://localhost","target":"_blank"}}]},{"type":"text","text":", camera permission, and a compatible browser and camera. Best with a laptop’s built-in camera, good lighting, and one person in view. Sudden movement or low light can interrupt tracking."}]},{"type":"paragraph","content":[{"type":"text","text":"Frames are processed locally. No recording or microphone is requested.","marks":[{"type":"italic"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Built with Framer · React · TypeScript · MediaPipe"}]}]},"introduction":"Camera-Controlled Fold Interaction","slug":"apple-duo-s-effect","author":{"framerUserId":"7a5166cf-d531-42d0-b5cf-ad6fe35c2e91","name":"Sarthak Prakash","slug":"sartisticway","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/t0xfsgjv","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7a5166cf-d531-42d0-b5cf-ad6fe35c2e91/01a0aa3e-20cf-7166-b947-fb4f2cc9beb9.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1448,"height":1086}}],"post":null,"createdAt":"2026-09-16T13:07:56.180Z","updatedAt":"2026-09-18T07:45:13.838Z","publishedAt":"2026-09-16T13:07:56.177Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://camera-fold-screen.framer.website/camera-mode","price":"19","paymentUrl":"https://contra.com/payment-link/NISlgRp9-virtual-screen-fold-pro-framer-component","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"7QVs0YT64KQ5IpDvkrCZ","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-16T13:07:56.775Z","updatedAt":"2026-09-16T13:07:56.775Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L55"}]