Interactive Globe Developer for Financial Site

I’m looking for a Webflow developer who specialises in interactive sections / WebGL to build a single high-impact section for an existing marketing site (finance/trading niche).

What I need

A reusable “Worldwide Earnings” section in Webflow where:

  1. 3D / pseudo-3D globe background

  • Dark space background with a glowing orange planet horizon.

  • Slow continuous rotation on desktop (smooth easing).

  • Country markers/pins rendered from a provided list (code, lat, lng).

  1. Horizontal country slider / cards

  • Each card shows: flag, country name, total earnings.

  • Auto-plays through countries on a timer.

  • When the active card changes (autoplay or click):

  • The globe rotates to bring that country to the front.

  • The country marker highlights in orange with a soft glow.

  • The card gets an “active” state (e.g. subtle scale/glow).

  1. Two-way interaction

  • Clicking a card in the slider:

  • Centers that card.

  • Rotates the globe and highlights that country.

  • (Nice to have) Clicking a globe marker focuses the matching card.

  1. Data setup

  • Accepts data from:

  • A static JSON object embedded in the page, or

  • A simple API endpoint returning countryCode, countryName, earningsUsd, lat, lng.

  • Easy for me to add / remove countries later without touching core JS.

  1. Responsive & performance

  • Desktop: full 3D experience using canvas/WebGL.

  • Mobile / low-power devices: graceful fallback (static or lightly animated globe image; slider still works).

  • Respect prefers-reduced-motion for users who disable heavy animations.

Tech expectations

  • Strong Webflow experience (custom code embeds, working with sliders/collection lists).

  • Solid JavaScript and animation experience.

  • Experience with Three.js or similar (or a lightweight globe library like globe.gl), plus GSAP or similar for easing/tweens.

  • Comfortable matching an existing dark, premium design (I’ll provide reference screens).

Deliverables

  1. A working Webflow section (in my project or a clonable) with:

  • Globe background.

  • Country slider.

  • All interactions described above.

  1. Configurable data source (clear example JSON / API integration).

  1. Short README or Loom explaining:

  • How to update the data list.

  • How to tweak animation timings/easing.

  • How the mobile fallback is handled.

  1. Basic cross-device QA (Chrome/Safari desktop, iOS/Android).

If this is in your wheelhouse, please send:

  • 2–3 links to interactive sections you’ve built (ideally Webflow + WebGL/maps/complex animations).

  • A rough estimate of cost and timeline for this one section.

Job Qualifications

  • A static JSON object embedded in the page, or
  • Name, earningsUsd, lat, lng
  • Easy for me to add / remove countries later without touching core JS
  • Desktop: full 3D experience using canvas/WebGL
  • Mobile / low-power devices: graceful fallback (static or lightly animated globe image; slider still works)
  • Respect prefers-reduced-motion for users who disable heavy animations
  • Strong Webflow experience (custom code embeds, working with sliders/collection lists)
  • Solid JavaScript and animation experience
  • Experience with Three.js or similar (or a lightweight globe library like globe.gl), plus GSAP or similar for easing/tweens
  • All interactions described above
  • Configurable data source (clear example JSON / API integration)
  • Short README or Loom explaining:

Job Benefits

  • Dark space background with a glowing orange planet horizon
  • Slow continuous rotation on desktop (smooth easing)
  • Country markers/pins rendered from a provided list (code, lat, lng)
  • Horizontal country slider / cards
  • Each card shows: flag, country name, total earnings
  • Auto-plays through countries on a timer
  • The country marker highlights in orange with a soft glow
  • Rotates the globe and highlights that country
  • Data setup
  • A simple API endpoint returning country

Job Responsibilities

  • The card gets an “active” state (e.g. subtle scale/glow)
  • Two-way interaction
  • Comfortable matching an existing dark, premium design (I’ll provide reference screens)
  • How to tweak animation timings/easing
  • How the mobile fallback is handled
  • 2–3 links to interactive sections you’ve built (ideally Webflow + WebGL/maps/complex animations)
  • A rough estimate of cost and timeline for this one section