App Assets Configuration

Proper branding is essential for a professional mobile application. This guide covers how to generate high-quality app icons and splash screens using BowlerLaunch and Flutter's automated tooling.

BowlerLaunch

BowlerLaunch is BowlerKit's companion icon, splash-screen, and App Store / Play Store screenshot studio — no Figma required. Every BowlerKit license includes 1 year of BowlerLaunch free.

How to use it:

1. Open launch.bowlerkit.com and sign in with your BowlerKit license.
2. Upload your logo and pick your colors — the icon, adaptive icon, monochrome/tinted variants, and light/dark splash screens update live.
3. Export the Flutter bundle. It writes assets/icon-1024.png, assets/adaptive-foreground.png (plus assets/monochrome.png and assets/icon-tinted.png if you enabled a monochrome mark), assets/splash/splash.png, splash_dark.png, splash12.png, splash12_dark.png, and a ready-to-use flutter_launcher_icons.yaml + flutter_native_splash.yaml — already pointing at those exact filenames, matching the config this boilerplate ships with.

App Icons

We use the flutter_launcher_icons package to automate the generation of app icons for all platforms.

1. Prepare your assets

From BowlerLaunch's Flutter export, copy the following into the mobile-app/assets/ directory (flat, not assets/icon/):

• icon-1024.png: The standard icon for iOS and legacy Android.
• adaptive-foreground.png: The foreground image for Android adaptive icons.
• monochrome.png / icon-tinted.png: Only present if you enabled a monochrome mark in BowlerLaunch.

2. Configure flutter_launcher_icons.yaml

The boilerplate already ships flutter_launcher_icons.yaml at the project root, pre-wired for these exact filenames:

flutter_launcher_icons:
  android: true
  ios: true
  image_path: "assets/icon-1024.png"
  min_sdk_android: 21
  adaptive_icon_background: "#ffffff" # or copy the color BowlerLaunch shows you
  adaptive_icon_foreground: "assets/adaptive-foreground.png"
  adaptive_icon_foreground_inset: 16
  adaptive_icon_monochrome: "assets/monochrome.png"
  remove_alpha_ios: true

If you exported the bundle straight from BowlerLaunch, it also includes a ready flutter_launcher_icons.yaml — you can drop that in as-is instead of editing this one by hand.

3. Generate Icons

Run the following command from the mobile-app directory:

dart run flutter_launcher_icons

Splash Screen

We use the flutter_native_splash package to create native splash screens that appear immediately when the app is launched.

1. Prepare your assets

From BowlerLaunch's Flutter export, copy these into mobile-app/assets/splash/:

• splash.png / splash_dark.png: The central logo for the splash screen (light / dark mode).
• splash12.png / splash12_dark.png: The center-logo splash for Android 12+.

2. Configure flutter_native_splash.yaml

The boilerplate already ships flutter_native_splash.yaml pre-wired for these filenames:

flutter_native_splash:
  web: false
  color: "#ffffff"
  color_dark: "#141414"
  image: assets/splash/splash.png
  image_dark: assets/splash/splash_dark.png
  fullscreen: false

  android_12:
    color: "#FFFFFF"
    color_dark: "#141414"
    image: assets/splash/splash12.png
    image_dark: assets/splash/splash12_dark.png

As with icons, BowlerLaunch's export includes a ready flutter_native_splash.yaml you can drop in directly.

3. Generate Splash Screen

Run the following command from the mobile-app directory:

dart run flutter_native_splash:create

Troubleshooting

• Caching: If you don't see changes on Android, try cleaning the project: flutter clean then flutter run.
• iOS Icon Not Updating: Sometimes Xcode caches icons. Try cleaning the build folder (Cmd+Shift+K in Xcode) or deleting the app from the simulator.
• Android 12+ Splash: Android 12 introduced a new splash screen API. The android_12 section in the config is crucial for supporting newer devices properly.