design-polish
Design polish (Flutter)
You polish screens in a Flutter mobile app — improving visual hierarchy, readability, and section clarity so a user instantly knows how to use the app. The work is opinionated, evidence-driven, and bounded: every round ends with an independent evaluator's verdict, not your own self-assessment.
Setup
If the user didn't specify screens, ask:
- "Which screens should I polish? Provide route names (e.g.
/settings,/profile) or component file paths underlib/."
The app must be running on an Android emulator. Use the android-emulator skill — every screenshot, tap, swipe, and accessibility-tree dump in this workflow goes through it:
scripts/emu.sh health # confirm device, AVD, foreground app
scripts/emu.sh boot # if not running
scripts/emu.sh run # build & install in background
scripts/emu.sh wait-run # block until attached
More from chunkytofustudios/flutter-skills
android-emulator
Run, debug, screenshot, and interact with a Flutter app on a running Android emulator via adb and the qemu console — boot/shut down an AVD, launch `flutter run` in the background, capture compact 360px-wide JPEG screenshots, dump the Android accessibility tree to find addressable widgets, tap by label or coordinates, long-press, swipe, and pinch-zoom (multi-touch). Use this skill whenever the user wants to launch, test, QA, take screenshots of, reproduce a bug in, verify a layout on, or otherwise interact with a Flutter app on Android — even when they don't say "emulator", "adb", or "screenshot" explicitly (e.g. "see what the home screen looks like", "try the new button", "check the layout on Pixel"). Auto-detects the project's applicationId, AVD, and `fvm flutter` vs `flutter`; falls back to ANDROID_EMU_* env vars.
13preview-widget
Preview a single Flutter widget in isolation using the built-in Flutter Widget Previewer (`flutter widget-preview`) — wires up a project-specific `previewWrapper` so the widget renders against the app's real theme and providers, launches the local preview server, and lets the agent take headless-Chrome screenshots of the live preview while a human follows along in their own browser. Use whenever the user wants to design, iterate on, dogfood, share, audit, or sanity-check a standalone Flutter widget — even when they don't say "previewer" (e.g. "let me see the new button", "show me dark mode for this card", "throw this widget on a preview", "iterate on the empty state", "preview just the badge", "what does this look like at tablet width"). For full-screen design polish on a running app, use `design-polish` + `android-emulator` instead. Skips — non-Flutter UIs, full-app QA flows, projects on Flutter < 3.35.
10symbolize-android-stacktrace
De-obfuscate (symbolize) an Android crash or ANR stacktrace exported from the Google Play Console for a Flutter app whose release build came from Codemagic CI/CD — fetches the matching `android_native_debug_symbols.zip` and `<AppName>_<N>_artifacts.zip` from Codemagic, then resolves every `pc 0x…` native frame and obfuscated Flutter frame to file:line via `llvm-addr2line`. Use whenever the user has a stacktrace (.txt/.log/pasted text) and wants to know which line of code crashed, even if they don't say "symbolize" — e.g. "what's causing this ANR?", "debug this Play Console crash", "translate this stack", "resolve these pc 0x… frames", "Codemagic build N crashed, here's the trace". Skips — iOS/dSYM symbolication, non-Codemagic builds (no symbol upload step), Crashlytics-only Dart exceptions with no native or Flutter frames.
10