Expert Framer / Gumroad—Bug fixes, 3D effects on maps & new page for focuswhale.com

## 🐋 Framer / Gumroad Expert Needed — Bug Fixes, 3D Hover Effects & New Page for focuswhale.com **Fixed budget: $100 USD | Timeline: 3 to 7 days | Platform: Framer + Gumroad** --- ### 🎯 About the Project FocusWhale (focuswhale.com) is a premium Notion templates and productivity systems store, built on Framer and integrated with Gumroad for payments. The site has an email list of 19,000 subscribers and targets students, freelancers, and productivity-focused professionals. I am looking for an experienced Framer developer to complete 3 priority tasks within a strict 3 to 7 day deadline, for a fixed budget of $100 USD. A complete technical brief with screenshots will be provided upon contractor selection. --- ### 🛠️ Task 1 — Fix White Corner Triangle Artifacts on Best Seller Badges The “BEST SELLER” badges currently display visible white triangle artifacts at all 4 corners. This is a visual bug caused by child elements overflowing outside the badge’s rounded pill shape. **Fix required:** - Add `overflow: hidden` on the badge wrapper element - Apply `border-radius: 999px` on the wrapper AND every child element inside it (shimmer div, overlay, pseudo-elements) - Result: zero visible artifacts on all 5 affected cards, at all times **Affected cards:** Notion Finance Tracker OS / Notion CRM Pro System / Notion Business Expense / Notion Knowledge Manager / Notion Finance Tracker ($5) --- ### ✨ Task 2 — Apply 3D Tilt Hover Effect to ALL Product Cards Currently, the 3D tilt hover effect (card tilts toward the cursor in real time) is only applied to Best Seller cards. Every other product card on the site must receive the exact same effect. **Expected behavior:** - On hover: card tilts in 3D toward cursor direction (max 8° on X and Y axes), scale(1.02) - Spring physics: stiffness 150, damping 20, mass 0.5 - Shadow shifts in the opposite direction of the tilt - Subtle specular highlight (white radial gradient at 6% opacity) follows cursor across card surface - On mouse leave: card returns FULLY flat — rotateX(0) rotateY(0) scale(1) — 400ms ease-out - Explicit reset via rotateX.set(0) / rotateY.set(0) / scale.set(1) on onMouseLeave - Desktop only — completely disabled on touch/mobile - Must be implemented as a Framer Code Override — do NOT rebuild existing card components --- ### 🤖 Task 3 — Create New Page: “AI Agents for Notion” Create a new dedicated page for AI automation products for Notion, accessible from the main navigation bar between “Templates” and “Testimonials”. **Page content:** - Hero section: title “AI Agents for Notion” + short subtitle (placeholder text, editable) - Product grid: 7 product cards (2 or 3-column responsive layout) - Each card: placeholder image, name, short description, price, CTA button linked to Gumroad - All text fields must be directly editable in the Framer editor (not hardcoded) - Layout must match the existing Templates page design exactly - Mobile responsive required - URL: /ai-agents-notion **Important:** Final content (names, descriptions, real prices, Gumroad links, visuals) will be provided by the client after delivery. Placeholder text and images are expected for now. --- ### 📄 What the Client Provides - Framer project editor access - Complete technical brief with screenshots (PDF) - Confirmed placeholder content for the AI Agents page - Final Gumroad links and visuals provided after delivery --- ### ✅ Who I’m Looking For - Proven experience with **Framer** — please share a portfolio including at least one e-commerce or landing page project - Strong command of **Framer Code Overrides** and interactions / animations - Familiarity with **Gumroad** integration is a plus - Clear communication and responsiveness throughout the project - Strict respect of the 3 to 7 day deadline - Solid **CSS** skills (overflow, border-radius, box-shadow, transform) - Knowledge of **Framer Motion** (useSpring, useMotionValue) --- ### ❌ Out of Scope - Full redesign of the site’s visual identity or design system - Building actual Notion templates or AI automation workflows - Back-end development - Writing final marketing copy or product descriptions --- ### 💰 Budget & Terms - **Fixed budget: $100 USD** (non-negotiable) - **Timeline: 3 to 7 business days** from contractor selection - **3 days of revisions included** after final delivery - Any request outside this scope will be quoted separately - Payment via Upwork only --- ### 💬 How to Apply Please begin your proposal with **“I’ve checked FocusWhale”** to confirm you have visited the site before applying. Include in your application: 1. A link to a Framer project you have built (e-commerce or similar) 2. Your time estimate for each of the 3 tasks 3. Any questions or suggestions about the project Applications without a Framer portfolio will not be considered.