Andrés Ochoa
Designing holistic digital experiences with Webflow 🖥️
Profile in progress
Andrés is building their profile!
Interactive U.S. Map — CMS-Driven Locations in Webflow
This project pushed Webflow's boundaries by building a fully interactive SVG map of the United States, where each state is dynamically connected to the CMS. Clicking a highlighted state navigates to its dedicated location page — all powered by Webflow's CMS with custom JavaScript to bridge SVG elements with CMS data.
The challenge was making SVG paths, interactive buttons, and CMS collection items work together seamlessly — something Webflow doesn't support natively. Custom JS handled the connection between the map's visual layer and the CMS-driven content.
Highlights:
— Fully interactive SVG map with hover states and click navigation
— Each state's SVG path stored as a CMS custom field
— Custom JavaScript connecting SVG elements to CMS collection pages
— Tooltip position flip logic for edge-of-screen states
— Scalable: adding a new location is as simple as creating a CMS item
Tech stack: Webflow · CMS · Custom JavaScript · SVG · Figma
Client name and branding have been changed for confidentiality.
1
12
Yabank is a personal concept project — a digital banking website designed and developed to showcase a modern, clean fintech UI. The goal was to explore how a next-gen bank would present its services: accounts, cards, loans, and international transfers.
Built entirely in Webflow using the Lumos Framework for a fully responsive, breakpointless layout, with custom GSAP animations and a light/dark mode toggle for a polished interactive experience.
Highlights:
— Clean fintech UI with a focus on clarity and conversion
— Light/dark mode with seamless theme switching
— Custom GSAP animations and scroll-based interactions
— Breakpointless responsive layout with Lumos Framework
— Designed and developed end-to-end: from concept to live site
Tech stack: Webflow · Lumos Framework · GSAP · Figma
This project was an exercise in designing for trust and usability in the financial space — two things that make or break a banking product.
1
2
33
Designed and developed a custom website for Xerbero Studios, a professional sound production studio. Built entirely in Webflow using the Lumos Framework for a fully responsive, breakpointless layout.
Key highlights:
— Custom GSAP animations including an interactive fader background and smooth scroll transitions
— Lottie-based SVG scroll indicator designed in Figma
— Performance-optimized for mobile with bfcache and viewport rotation fixes
— Full icon and vector design system created from scratch
Tech stack: Webflow · Lumos Framework · GSAP · Lottie · Figma
The goal was to create an immersive experience that reflects the studio's premium sound quality through motion and visual storytelling.
1
36