Crea una semplice applicazione interattiva per il coloramento con le seguenti funzionalità:

Panoramica del progetto
Sviluppa un'applicazione che permetta agli utenti di colorare interattivamente le aree all'interno di un'immagine. L'utente seleziona o scatta una foto e l'app la elabora per abilitare il coloramento nelle zone rilevate.

Design e flusso UI/UX
1. Schermata iniziale: Visualizza un pulsante ben visibile 'Seleziona immagine'. Al clic, apri un file browser per selezionare un'immagine.
2. Dopo la selezione: Mostra l'anteprima centrale dell'immagine selezionata. Fornisci un pulsante 'Inizia a colorare' al di sotto dell'immagine.
3. Schermata di colorazione: Dopo aver cliccato su 'Inizia a colorare', analizza l'immagine per rilevare le aree da colorare. Utilizza un layout a schermo intero verticale con i seguenti controlli:
   - In alto a sinistra: pulsante 'Indietro' per tornare alla schermata iniziale e pulsante 'Salva' per scaricare l'immagine colorata.
   - In alto a destra: un grandissimo cerchio indicatore del colore attualmente selezionato, impostato di default su un blu brillante. Toccando il cerchio si apre una palette a schermo intero con 24 colori vibranti.

Funzionalità principali e logica
- Rileva almeno due aree distinte nell'immagine adatte al coloramento.
- Meccanismo di riempimento: l'utente tocca all'interno di un'area per riempirla con il colore selezionato.
- Formati supportati: JPEG, PNG e altri.

Gestione degli errori
- Se l'analisi dell'immagine trova meno di due aree da colorare, mostra un errore: "Ops! Non sono state trovate aree da colorare in questa immagine. Prova un'altra immagine con contorni più chiari."
- Se il rilevamento dei contorni fallisce, invita l'utente a scegliere un'altra immagine.

Migliori pratiche
- Assicurare transizioni fluide tra le schermate.
- Fornire elementi di design responsive per desktop e mobile.
- Assicurarsi che la selezione della palette e l'elaborazione dell'immagine siano intuitive ed efficienti.
- Utilizzare messaggi di errore chiari per garantire un'esperienza utente amichevole.

Create a simple interactive coloring application:

First screen:
- Display a prominent button labeled "Select Image" (select/take photo if on mobile).
- Upon clicking, open file browser to let the user select an image.

After selecting an image:
- Show a preview of the chosen image centered on the screen.
- Below the preview, display a button labeled "Start Coloring."

After clicking "Start Coloring":
- Attempt to parse the image to detect at least two distinct areas suitable for coloring.
- If successful, display the image fullscreen vertically with detected boundaries.

Top-left corner:
- "Back" button: returns to first screen.
- "Save" button: downloads the colored image.

Top-right corner:
- Large red circle indicating the current selected color (default bright blue).
- On click, open fullscreen palette with 24 vibrant colors arranged in circles. Close palette upon selection.

Coloring interaction:
- Detect boundaries automatically.
- On tap/click within boundaries, fill the area with the selected color.

Error handling:
- If fewer than two colorable areas are detected, display an error message:
  "Oops! We couldn't find areas to color in this image. Please try another image with clearer outlines."

Q: What image formats should be supported for selection?
A: JPEG, PNG, and other.

Q: What should happen if the user selects an image but the boundary detection fails?
A: Return to the image selection with a prompt to try another image.