Crear una aplicación interactiva de coloreado simple con las siguientes características:

Descripción del Proyecto
Desarrolla una aplicación que permita a los usuarios colorear áreas dentro de una imagen de forma interactiva. El usuario selecciona o captura una imagen, y la aplicación la procesa para habilitar el coloreado dentro de los contornos detectados.

Diseño UI/UX y Flujo
1. Primera Pantalla: Mostrar un botón destacado 'Seleccionar Imagen'. Al hacer clic, abrir un explorador de archivos para seleccionar una imagen.
2. Después de la Selección: Mostrar la imagen seleccionada centrada. Proporcionar un botón 'Comenzar a Colorear' debajo de la imagen.
3. Pantalla de Coloreado: Tras hacer clic en 'Comenzar a Colorear', analizar la imagen para identificar contornos coloreables. Usar un diseño vertical de pantalla completa con controles:
   - Esquina superior izquierda: botón 'Atrás' para regresar a la primera pantalla y botón 'Guardar' para descargar la imagen coloreada.
   - Esquina superior derecha: un gran círculo indicador del color seleccionado actual, por defecto un azul brillante. Al tocar el círculo, se abre una paleta de colores a pantalla completa con 24 colores vibrantes.

Funcionalidad y Lógica Principal
- Detectar al menos dos áreas distintas en la imagen aptas para colorear.
- Mecánica de Relleno: el usuario toca dentro de un área para rellenarla con el color seleccionado.
- Formatos soportados incluyen JPEG, PNG, y otros.

Manejo de Errores
- Si el análisis de la imagen encuentra menos de dos áreas coloreables, mostrar un error: "¡Vaya! No se encontraron áreas para colorear en esta imagen. Por favor, prueba con otra imagen con contornos más claros."
- Si la detección de contornos falla, solicitar al usuario elegir otra imagen.

Mejores Prácticas
- Asegurar transiciones fluidas entre pantallas.
- Proveer elementos de diseño responsivos para entornos de escritorio y móviles.
- Garantizar que la selección de la paleta de colores y el procesamiento de la imagen sean intuitivos y eficientes.
- Utilizar mensajes de error claros y mantener una experiencia amigable para el usuario.

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.