Flutter On-Device Image Classifier
Build a Flutter app that recognizes what's in a photo (a dog, a coffee mug, a bicycle) using a TensorFlow Lite model that runs entirely on the phone, so no image ever leaves the device and it works offline. You take a photo with the camera plugin or pick one from the gallery, the app resizes and prepares it exactly the way the model expects, runs the model, and shows the top 3 guesses with confidence bars. Classification runs in a background isolate, so the app never freezes. You'll learn using a machine learning model in a mobile app, image preprocessing (resizing, normalizing and tensor shapes), reading model outputs, isolates for heavy work, the camera plugin, and measuring performance.
- Estimate
- ~12h
- Steps
- 7
- Completed by
- 0
- Proposed by
- codeseed.app
Flutter · tflite_flutter · camera
Project roadmap
- 01
Capture or pick a photo
~2hCreate a Flutter project with the camera and image_picker plugins, and add the camera and photo permissions for Android and iOS. Build a screen with a live camera preview and a capture button, plus a Pick from gallery button. Handle permission refusal with a helpful message. Done when: the app captures a photo or picks one and shows it.
- 02
Load the model
~1.5hDownload a pre-trained image classification model in TensorFlow Lite format (for example MobileNet from Kaggle Models or TensorFlow Hub) with its labels file, add both to the app's assets, and load them with tflite_flutter when the app starts. Print the model's input and output shapes and types (for example [1, 224, 224, 3] float32 or uint8). Done when: the model and labels load, and their shapes are printed.
- 03
Prepare the image
~2hWith the image package, decode the photo, apply its EXIF orientation, crop the center to a square and resize it to the model's input size, then convert the pixels to the model's input format: floats normalized the way the model was trained (for example to -1 to 1 or 0 to 1) or bytes for a quantized model. Done when: a test image is converted into an input of exactly the right shape and value range.
- 04
Run the model
~1.5hRun the interpreter on the prepared input, read the output scores, apply softmax if the model outputs raw values, and map the top 3 scores to label names. Check a few known images (a dog, a cup and so on) give sensible predictions. Done when: photos of common objects are classified correctly.
- 05
Show the results
~1.5hBuild a results screen with the photo, the top 3 predictions with confidence bars and percentages, and a note when the top confidence is low (for example under 40%) that the model isn't sure. Explain in the app's info screen that the model only knows the 1,000 categories it was trained on. Done when: results are clear and honest about uncertainty.
- 06
Keep the app smooth
~2hMove preprocessing and inference into a background isolate (for example with Isolate.run or tflite_flutter's IsolateInterpreter), show a progress indicator while it runs, and load the model once. Measure the time for preprocessing and inference on a real phone and record it in README.md. Done when: the interface never freezes during classification, and README.md shows the timings.
- 07
Test it
~1.5hWrite unit tests for preprocessing (output shape, value range, orientation handling and center cropping) and for turning scores into top-3 labels, using small test images. Add a test that runs the real model on one bundled test image and checks the expected label. Done when: flutter test passes.
Ready to build this?
Get a GitHub repo and start building. Your AI reviewer checks each step as you go.
Tech stack