mobile-design
Installation
SKILL.md
This skill guides the creation of distinctive, production-grade mobile interfaces using Flutter that avoid generic "standard widget" aesthetics. Implement real working code with exceptional attention to aesthetic details, animations, and creative choices.
The user provides mobile requirements: a screen, app flow, custom widget, or interface to build. They may include context about the purpose, audience, or technical constraints.
Design Thinking
Before coding, understand the context and commit to a BOLD aesthetic direction:
- Purpose: What problem does this app solve? Who is holding the device?
- Tone: Pick an extreme: brutally minimal, maximalist chaos, retro-futuristic, organic/natural, luxury/refined, playful/toy-like, editorial/magazine, neumorphic, glassmorphic, industrial/utilitarian, etc. Use these for inspiration but design one that is true to the aesthetic direction.
- Constraints: Technical requirements (Flutter performance, platform specificities for iOS/Android, accessibility).
- Differentiation: What makes this interaction UNFORGETTABLE? What's the one gesture or transition someone will remember?
CRITICAL: Choose a clear conceptual direction and execute it with precision. Avoid the "default Material Design" look unless explicitly requested.
Then implement working Flutter code (Dart) that is:
- Production-grade: Proper state management structure (even if simple), error handling, and responsiveness.
- Visually striking: Custom painters, shaders, and non-standard layouts.
- Cohesive: Consistent design language across all widgets.
- Meticulously refined: Exact padding, typography, and timing.