Flywheel v0.18.0
A Complete Facelift
A complete visual redesign—from concept to production in just two weeks, powered by AI-driven architecture.
Most design overhauls take months. We shipped ours in two weeks.
Flywheel v0.18.0 represents a complete visual transformation—new landing page, redesigned components, refined color palette, and updated workflows across the entire application. This level of change typically requires months of careful implementation. We did it in two weeks, thanks to an architecture built for AI collaboration.
Built for AI from Day One
We didn't just make Flywheel work with AI—we designed it for AI collaboration. Every pattern, convention, and architectural decision was made with AI-assisted development in mind.
Connection and service configuration registries make adding new integrations predictable and repeatable.
CLAUDE.md files provide AI assistants with context-specific instructions for every part of the codebase.
Catalyst UI components with clear APIs enable rapid iteration without sacrificing consistency.
Naming conventions, file structures, and coding patterns that AI can understand and replicate.
With Claude Code as our development partner, we rapidly prototyped designs, implemented components, and iterated on styling across hundreds of files—all while maintaining code quality and architectural consistency. What traditionally requires weeks of manual implementation took days.
Landing Page
Glass-morphism panels, animated backgrounds, and gradient accents create a modern, professional first impression.
Login Experience
A refined, minimalist design with soft backgrounds sets the tone for the entire application.
Import Management
Refined cards with vibrant status indicators make it easier to monitor your data flows at a glance.
Field Conflict Resolution
Complex workflows now feature gradient icons and improved visual hierarchy for clearer guidance.
What Changed
Refined Color Palette
Soft grays with subtle transparency. Vibrant gradients used exclusively for icons and accents—never backgrounds.
Glass Morphism
Backdrop blur and subtle transparency create depth and visual interest without heaviness.
Micro-Interactions
Smooth transitions and purposeful animations provide feedback without being distracting.
Visual Hierarchy
Refined shadows, borders, and spacing create clear information hierarchy for complex data.
The Technical Foundation
The redesign is powered by Tailwind CSS v4 with a comprehensive design system built on Catalyst UI components. But the real enabler was our architecture: registry patterns for connections and services, structured documentation in CLAUDE.md files, and consistent conventions that AI tools can understand and replicate.
This approach doesn't just accelerate development—it ensures consistency. When AI implements a new component, it follows the same patterns as existing code, maintaining architectural integrity across rapid changes.
See it in action
Experience the refined interface yourself. Sign in to explore the new design.