CONTROL A WEBSITE WITH YOUR HAND — THE PROMPTS novitckii.com/resources/hand-gesture-website Three prompts, three tools. Swap in your own photo / object anywhere it says so. ================================================================ 1. IMAGE PROMPT → ChatGPT (Image 2) Upload a clear photo of your face first, then paste this. ================================================================ Using this person's appearance, generate a folded photo facial sculpture filter—an origami-like portrait made from a single photo, in an editorial art style. Transform the face into a 3D form physically folded from a tangible photo, with distinct creases, indentations, and bending marks. It belongs to a photo origami effect rather than geometric CGI, with soft distortion at the crease bends and slight misalignment in the folded areas. The composition is limited to the head, a floating bust with no shoulders, using a slight 3/4 profile perspective to showcase the depth of the creases. There are clear creases on the eyes, nose, and cheeks, and the image is slightly distorted along the creases, featuring fine paper texture and minor imperfections. Pure white studio background, minimalist and clean. Uses directional studio lighting to highlight the creases, with soft highlights on the paper edges and distinct shadows. Retain natural skin tone but with slightly low saturation. Sharp focus, shallow depth of field. The overall presentation delivers an artistic, sculptural, experimental, and editorial atmosphere. Ultra-high resolution, no watermark. White background, but keep the hairstyle, looking at the camera. ================================================================ 2. VIDEO PROMPT → image-to-video tool (Kling 3.0 recommended) Upload the origami image from step 1, then paste this. ================================================================ Create an animation showing the original portrait made from a folded photograph gradually transforming into a cramped, crumpled origami-like paper form. The video begins with the neatly folded photo facial sculpture from the original prompt. Then, the face is gradually compressed inward, as if an invisible pair of hands is squeezing and folding the paper. The face bends, collapses, wrinkles, and shrinks. It eventually becomes a smaller, more twisted paper sculpture, with dense sharp creases, overlapping folds, distorted facial features, and the texture of paper that has been squeezed and crumpled. Keep the pure white minimalist studio background, head-only composition, 3/4 side angle, editorial magazine-style lighting, and the original photo's natural skin-tone texture. The motion should feel like a smooth, physical paper-folding process. No camera zoom, no new objects, no visible hands, no text, and no watermark. ================================================================ 3. CODE PROMPT → Codex (or any AI coding tool) Drop in your video from step 2, then paste this. ================================================================ Design a white-themed homepage Hero Section for a designer named Master AI Websites. Create a separate folder and page for it. Use a full-screen layout with no scrolling. The overall style should be minimal, premium, spacious, and clean, with lots of white space. All text should be black on a white background. Buttons should be black with white text. At the top navigation bar, place the logo or name AI Coach on the left. In the center, add navigation links: Home, Work, About, Contact. On the right, place two buttons: "View Work" and "Say Hello". In the upper-left area of the page, add a small tagline with a diamond-shaped icon: Design & Creative Direction Make the word Design italic. In the main visual area, display a bold, eye-catching headline on the left: Crafting digital experiences, one fold at a time. Make the final line larger and use an italic serif font to create a strong visual focus. In the bottom-left area, add a short subtitle describing AI Coach's design direction and creative expression. Add a white pill-shaped button that says: View Work On the right side of the screen, display a looping video clip with a water-ripple mirror-flip effect as the main visual. Only keep the animation from the video. Remove the video background and make it transparent. On the left side of the page, include a camera window showing the live webcam feed. Overlay MediaPipe Hands / Gesture Recognition hand-tracking skeleton lines on top of the webcam feed. The camera should recognize the state of one hand in real time and use gestures to control the progress of the folded-paper character video: - When the hand is open, the video should move backward, and the crumpled paper ball should unfold back into a human portrait. - When the hand closes, makes a fist, or pinches, the video should move forward, and the portrait should be crumpled into a paper ball. The playback should feel smooth, fluid, and free of lag. When no hand is detected, the video should stay on the current frame and should not autoplay. Use handCloseProgress to map the hand gesture to the video timeline: 0 = hand open 1 = hand closed / fist / pinch Make video.currentTime update in real time based on the gesture, creating an interactive effect where the user can drag through the video timeline using hand movement.