$ show gskinnerTeam/flutter-wonderous-app
Wonderous is a cross-platform Flutter application that serves as an interactive educational showcase of the New7Wonders of the World. It provides richly animated editorial content (history, construction, location), photo galleries, artifact browsing with search (using pre-loaded data from the Metropolitan Museum of Art), a timeline of historical events, and a gamified collectible discovery system. The app features custom layered illustrations for each wonder with parallax effects, an iOS widget showing collection progress, and support for multiple platforms including Android, iOS, Web, macOS, and Windows. Architecturally, it is a monolithic client-side application using GetIt for dependency injection, GoRouter for navigation, and custom state management with ValueNotifier/ChangeNotifier. All data is either hardcoded in Dart files or fetched from external APIs (MET Museum, Unsplash) with self-hosted image caching. The codebase is notable for its high craftsmanship in UI animations, a consistent design system, and several reusable widget patterns that could be extracted for other projects.
The LLM identified 4 files worth highlighting for reuse:
A generalized layered illustration framework that composes background, midground, and foreground layers with configurable parallax, scaling, and animation effects. Each wonder's illustration is defined by a WonderIllustrationConfig specifying layers (IllustrationPiece) and animations (AnimatedClouds, etc.). This pattern is self-contained and could be reused for any scene-based parallax UI in Flutter, demonstrating strong separation of concerns and customizable animation.
A concise, well-structured debounce utility class that delays function execution until a specified duration of inactivity. It handles cancellation and disposal cleanly, and can be easily extracted into any Dart/Flutter project for input throttling, search queries, or resize handling.
A reusable widget that wraps a child and applies scale and opacity animations based on its scroll position. It uses a visibility detection mechanism to create a smooth entrance effect as items come into view. This pattern is decoupled from any specific content and can be reused for list views, grids, or cards in any Flutter project requiring scroll-triggered animations.
A custom painter that renders a time range selector with two draggable handles, a filled range bar, and tick marks. It demonstrates advanced Canvas drawing techniques (clipping, gradients, hit testing) for a specialized two-thumb slider widget. The logic is self-contained and could be adapted for any timeline or range selection UI in Flutter, showcasing non-trivial use of CustomPainter and gesture detection.