Sci-Fi Interactive Page Developer
🔹 Overview
We are seeking a highly skilled Webflow developer to build a cinematic, interactive landing page for our sci-fi project, Zero Point. The website’s core feature is the portal, which serves as the central storytelling element, leading users through an immersive scrolling journey into the main content page.
This project will include smooth scroll-triggered animations, portal effects, and subtle micro-interactions that make the website feel truly alive. The final page will showcase a book as the focal point, alongside subtle animations for merchandise, videos, a Substack link, and social icons
We have Webflow reference sites to streamline the process, and we expect high-quality execution that matches the futuristic theme.
📌 Scope of Work & Key Features
1️⃣ Hero Section: The Portal (Landing Page)
✅ Full-Screen Immersive Design:
Background featuring an astronaut, a dog, and a glowing portal.
The portal is the focal point and reacts dynamically to user interactions.
✅ Scroll-Triggered Portal Journey:
First Scroll:
The portal starts to brighten and subtly rotate.
A faint pulling motion effect (parallax scrolling).
Small energy particles and light distortions appear around the portal.
Second Scroll:
"Welcome to Zero Point" text emerges as if flying toward the user from the portal.
The portal grows brighter and emits a soft glowing pulse.
Third Scroll:
"The Portal Awaits" text appears with a Star Trek-style zoom-out effect.
The portal fully opens, leading the user into the next page.
✅ Cursor-Based Interactions:
Subtle distortion or glow effect near the portal as the cursor moves.
Slight "gravitational pull" effect when hovering close to the portal.
2️⃣ Portal Page: Main Content Focus
The second page centers around the book but includes interactive sections for merchandise, videos, Substack, and social links.
✅ Key Visual Layout (Provided Later):
Book Preview: The main focal point, with animated excerpts or CTA.
Merchandise Grid: Product images with hover-zoom effects.
Videos Section: Auto-play muted video previews or dynamic thumbnails.
Social Media: Floating, glowing social icons that slightly drift (zero-gravity effect).
Substack Link: Glowing CTA for email sign-up or newsletter.
✅ Subtle Background Animations:
Cosmic ripples or flowing energy waves (CSS or WebGL).
Portal glow continues subtly in the background, adding cohesion.
3️⃣ Additional Interactive Elements
✅ Floating Energy Particles:
Dynamic Lottie animations of small, glowing orbs drifting around the portal and across the second page.
✅ Parallax Layers:
Background stars and nebula clouds shift independently to create depth.
✅ Button Hover Effects:
All CTAs glow or pulse softly when hovered.
✅ Portal Continuity Animation:
As users scroll back up, the portal closes and fades back into its resting state.
🎥 Visual & Animation References
We’ll use Webflow references to guide some of the effects:
Text Mask Video (Webflow Site):
Smooth text reveal effects for “Welcome to Zero Point” and “The Portal Awaits.”
Trendy Circular Text (Webflow Site):
Hover & rotation animations for buttons and portal elements.
💰 Budget & Timeline
💲 Budget: $600 - $900 (Fixed Price).
⏳ Timeline: 2-4 weeks (background assets to be provided).
🔎 Ideal Candidate
✅ Expert in Webflow animations & interactions.
✅ Experience with scroll-triggered transitions and parallax effects.
✅ Able to handle advanced animation techniques (Lottie, GSAP, or WebGL).
✅ Strong eye for high-end, immersive design aesthetics.
📌 How to Apply
If you’re confident you can deliver a high-end, immersive Webflow experience, apply with:
Portfolio of similar interactive projects.
Estimated timeline for completion.
Any Webflow Showcase examples or animations you’ve worked on.
We’re looking to start this project ASAP and expect top-quality execution. 🚀
Hero Image attached for reference
Job Qualifications
- Cosmic ripples or flowing energy waves (CSS or WebGL)
- Portal glow continues subtly in the background, adding cohesion
- ✅ Expert in Webflow animations & interactions
- ✅ Experience with scroll-triggered transitions and parallax effects
- ✅ Able to handle advanced animation techniques (Lottie, GSAP, or WebGL)
Job Benefits
- 💲 Budget: $600 - $900 (Fixed Price)
- ⏳ Timeline: 2-4 weeks (background assets to be provided)
Job Responsibilities
- The portal is the focal point and reacts dynamically to user interactions
- The portal starts to brighten and subtly rotate
- A faint pulling motion effect (parallax scrolling)
- The portal fully opens, leading the user into the next page
- Subtle distortion or glow effect near the portal as the cursor moves
- Slight "gravitational pull" effect when hovering close to the portal
- Book Preview: The main focal point, with animated excerpts or CTA
- Merchandise Grid: Product images with hover-zoom effects
- Videos Section: Auto-play muted video previews or dynamic thumbnails
- Background stars and nebula clouds shift independently to create depth
- All CTAs glow or pulse softly when hovered
- As users scroll back up, the portal closes and fades back into its resting state
- Hover & rotation animations for buttons and portal elements