> ## Documentation Index
> Fetch the complete documentation index at: https://docs.bloomy.casa/llms.txt
> Use this file to discover all available pages before exploring further.

# Edición Manual

> Editá tus imágenes con precisión usando anotaciones e instrucciones en lenguaje natural.

export const Bloomy = () => <span class="bg-gradient-to-r from-[#c36c78] via-[#ef8292] to-[#c36c78] bg-clip-text px-0 font-bold font-sans text-lg text-transparent">
    bloomy
  </span>;

La **Edición Manual con IA** te permite modificar imágenes de forma precisa indicando exactamente qué cambios querés hacer y dónde. A diferencia de Alma (que rediseña un espacio completo), la edición manual te da control total sobre cada detalle que querés modificar.

\[Placeholder: Interfaz de edición manual mostrando imagen con anotaciones y panel de instrucciones]

## ¿Qué es la edición manual?

Es un editor visual que combina:

* **Anotaciones espaciales**: Marcá puntos específicos en la imagen
* **Instrucciones en lenguaje natural**: Escribí qué querés cambiar en cada punto
* **Inteligencia artificial**: La IA interpreta tus instrucciones y aplica los cambios

**Casos de uso:**

* 🎨 Cambiar colores de paredes, pisos o muebles
* 🪟 Agregar o remover elementos (ventanas, puertas, objetos)
* 🛋️ Modificar mobiliario existente
* ✨ Ajustar detalles decorativos específicos
* 🌳 Editar elementos de jardines o exteriores
* 🔧 Hacer correcciones puntuales en fotos

***

## Acceso al editor

Desde cualquier imagen de tu proyecto:

1. **Abrí el proyecto** que contiene la imagen
2. **Hacé clic en la imagen** para ver sus detalles
3. \*\*Buscá el botón **"Edición manual"**
4. Se abre la interfaz del editor con dos paneles principales

<img src="https://mintcdn.com/bloomy/7BCCFd7bn5NLaKeQ/assets/edicion-imagenes.webp?fit=max&auto=format&n=7BCCFd7bn5NLaKeQ&q=85&s=633ffb0c05f87204a074817836a7aa60" alt="Edición manual de Bloomy" class="rounded-3xl" width="900" height="720" data-path="assets/edicion-imagenes.webp" />

***

## Interfaz del editor

La pantalla está dividida en dos áreas principales:

### Panel izquierdo - Área de trabajo

Muestra tu imagen original con todas las anotaciones que agregues. Este es tu lienzo de edición donde:

* Visualizás la imagen actual
* Colocás marcadores de anotación
* Ves el resultado generado
* Comparás antes/después

### Panel derecho - Instrucciones

Panel lateral donde:

* Gestionás todas tus anotaciones
* Escribís las instrucciones para cada punto
* Ves el estado de cada anotación
* Accedés a los controles de generación

<img src="https://mintcdn.com/bloomy/7BCCFd7bn5NLaKeQ/assets/edicion-manual.webp?fit=max&auto=format&n=7BCCFd7bn5NLaKeQ&q=85&s=617782e182c7498c5d0215fa423adcd9" alt="Edición manual de Bloomy" class="rounded-3xl" width="900" height="720" data-path="assets/edicion-manual.webp" />

***

## Crear anotaciones

### Agregar una nueva anotación

1. **Hacé clic en "Nueva anotación"** en la parte superior del panel izquierdo
2. El cursor cambia a **modo crosshair** (cruz de puntería)
3. **Hacé clic en la imagen** exactamente donde querés hacer el cambio
4. Aparece un **marcador numerado** en ese punto
5. El panel derecho se expande automáticamente para que escribas la instrucción

<video src="https://mintcdn.com/bloomy/2kn1ff42ticEu3zb/assets/videos/anotaciones.webm?fit=max&auto=format&n=2kn1ff42ticEu3zb&q=85&s=f228b8345f420e78739bf51bb9a121da" alt="Crear una anotación en la imagen" class="rounded-3xl" autoPlay muted loop playsInline data-path="assets/videos/anotaciones.webm" />

**Consejos para colocar anotaciones:**

* Hacé clic lo más cerca posible del elemento que querés modificar
* Si querés modificar un área grande, podés agregar varias anotaciones
* Cada anotación puede tener una instrucción diferente

***

## Escribir instrucciones

### ¿Qué son las instrucciones?

Las instrucciones son descripciones en **lenguaje natural** (español) que le decís a la IA sobre qué cambio querés hacer en cada punto marcado.

### Cómo escribir buenas instrucciones

**Estructura recomendada:**

1. **Acción**: Qué querés hacer (cambiar, agregar, remover, modificar)
2. **Elemento**: Qué objeto o área (pared, mueble, ventana, color)
3. **Detalle**: Cómo lo querés (color específico, estilo, tamaño)

**Ejemplos de instrucciones efectivas:**

<Icon icon="check" color="green" /> **Buenas instrucciones:**

* "Cambiar el color de la pared a azul cielo"
* "Agregar una ventana grande con marco blanco"
* "Remover el sillón rojo"
* "Cambiar el piso a madera clara"
* "Agregar una planta grande en maceta"
* "Modificar el color del sofá a gris oscuro"
* "Agregar cortinas blancas en la ventana"
* "Remover todos los cuadros de la pared"

<Icon icon="close" color="red" /> **Instrucciones poco claras:**

* "Hacer más lindo" (demasiado vago)
* "Arreglar" (no especifica qué)
* "Mejorar la decoración" (muy general)
* "Cambiar todo" (sin detalles)

### Campo de texto de instrucción

Para cada anotación:

1. **Hacé clic en el marcador numerado** o en su tarjeta en el panel derecho
2. La tarjeta se **expande** mostrando un campo de texto
3. **Escribí tu instrucción** con claridad
4. Presioná fuera del campo o hacé clic en otro lado para guardar
5. Verás un **check verde** ✓ indicando que la instrucción está guardada

**Límite de caracteres:**

* Podés escribir instrucciones detalladas
* Recomendado: entre 5 y 50 palabras
* Sé específico pero conciso

***

## Estados de las anotaciones

Cada anotación tiene un estado visual que te ayuda a identificar su condición:

### 🔴 Sin instrucción

* **Color**: Rojo
* **Significa**: La anotación no tiene instrucción todavía
* **Acción**: Escribí una instrucción para poder generar

### 🟢 Con instrucción

* **Color**: Verde con check ✓
* **Significa**: La instrucción está guardada y lista
* **Acción**: Ninguna, está lista para generar

### 🔵 Seleccionada

* **Color**: Azul/Primario (más grande)
* **Significa**: Estás editando esta anotación actualmente
* **Acción**: Escribí o modificá la instrucción

***

## Gestionar anotaciones

### Ver todas las anotaciones

El panel derecho lista todas tus anotaciones en orden:

* Numeradas del **1** al **N**
* Muestra un preview de la instrucción
* Indica si está completa o vacía
* Permite expandir/colapsar cada una

### Editar una instrucción existente

1. **Hacé clic en la tarjeta** de la anotación en el panel derecho
2. Se expande el campo de texto
3. **Modificá el texto** como necesites
4. Hacé clic fuera para guardar los cambios

### Eliminar una anotación

Si colocaste una anotación por error o ya no la necesitás:

1. **Expandí la anotación** haciendo clic en ella
2. **Hacé clic en "Eliminar"** en la parte inferior
3. La anotación se borra inmediatamente

**No hay confirmación**, así que asegurate antes de eliminar.

### Agregar múltiples anotaciones

Podés tener tantas anotaciones como necesites en una misma imagen:

* No hay límite de cantidad
* Cada una puede tener una instrucción diferente
* Todas se procesan juntas al generar
* Se muestran numeradas en orden de creación

<Tip>**Consejo:** Es mejor hacer varias anotaciones específicas que una sola muy general.</Tip>

***

## Generar imagen editada

### Requisitos para generar

Antes de poder generar, asegurate de:

* <Icon icon="check" color="green" /> Tener al menos **una anotación** creada
* <Icon icon="check" color="green" /> Que todas las anotaciones tengan **instrucciones escritas**
* <Icon icon="check" color="green" /> No estar en modo preview de una generación anterior

Si falta algún requisito, el botón "Generar imagen editada" estará deshabilitado.

### Proceso de generación

1. **Revisá tus anotaciones** para verificar que todo esté correcto
2. **Hacé clic en "Generar imagen editada"**
3. El botón muestra "Generando..." con una animación de carga
4. **Esperá entre 5-15 segundos** (depende de la complejidad)
5. La imagen editada aparece en el panel izquierdo

<Warning>
  **Importante:** No cierres ni refresques la página mientras se genera.
</Warning>

***

## Revisar el resultado

### Vista previa del resultado

Una vez generada la imagen, aparece un **banner de decisión** en la parte superior:

**"¿Te gusta?"** con dos opciones:

* <Icon icon="check" color="green" /> **Aceptar**: Guardás la imagen editada
* 🗑️ **Descartar**: Eliminás el resultado y volvés a la original

### Comparar antes y después

Mientras el banner está visible:

* Podés **ver la imagen generada** en pantalla completa
* Comparala con tu memoria de la original
* Evaluá si los cambios cumplen con tus instrucciones

<Tip>**Consejo:** Hacé zoom para ver detalles finos y verificar la calidad.</Tip>

***

## Aceptar o descartar

### Opción 1: Aceptar el resultado

Si te gusta el resultado:

1. **Hacé clic en "Aceptar"** en el banner
2. La imagen generada reemplaza a la actual
3. El banner desaparece
4. **Podés seguir editando** agregando nuevas anotaciones sobre esta versión
5. Se muestra un mensaje de confirmación

**¿Qué pasa después de aceptar?**

* La nueva versión se convierte en tu imagen "base"
* Podés hacer más ediciones sobre ella
* Las anotaciones anteriores se borran (ya están aplicadas)
* Se guarda en tu proyecto como una nueva versión

### Opción 2: Descartar el resultado

Si el resultado no te convenció:

1. **Hacé clic en "Descartar"** en el banner
2. Se elimina la imagen generada
3. Volvés a ver la imagen original
4. **Tus anotaciones e instrucciones se mantienen**
5. Podés ajustar las instrucciones y regenerar

**¿Cuándo descartar?**

* El resultado no coincide con tus expectativas
* Querés probar con instrucciones diferentes
* Notás errores o artefactos en la generación
* Preferís mantener la imagen original

***

## Ediciones iterativas

Una de las funcionalidades más poderosas: **podés seguir editando después de aceptar**.

### Flujo de trabajo iterativo

1. **Primera ronda**: Agregás anotaciones, generás, aceptás
2. **Segunda ronda**: Sobre la imagen aceptada, agregás nuevas anotaciones
3. **Tercera ronda**: Y así sucesivamente...

**Ejemplo práctico:**

* **Ronda 1**: "Cambiar color de pared a blanco" → Aceptar
* **Ronda 2**: "Agregar ventana en la pared blanca" → Aceptar
* **Ronda 3**: "Agregar cortinas en la ventana nueva" → Aceptar

### Ventajas de editar en pasos

* <Icon icon="check" color="green" /> **Mayor control**: Hacés un cambio a la vez y verificás
* <Icon icon="check" color="green" /> **Menos errores**: La IA se enfoca en una tarea por vez
* <Icon icon="check" color="green" /> **Reversible**: Si un paso sale mal, solo perdés ese paso
* <Icon icon="check" color="green" /> **Experimentación**: Probás diferentes opciones en cada etapa

<Tip>**Consejo:** Para cambios complejos, mejor hacerlos en pasos que todo junto.</Tip>

***

## Consejos y mejores prácticas

### Para obtener mejores resultados

**📍 Colocación de anotaciones:**

* Marcá exactamente el centro del área a modificar
* Para objetos grandes, podés usar varias anotaciones
* Evitá marcar en bordes o esquinas imprecisos

**✍️ Escritura de instrucciones:**

* Sé específico: "azul marino" mejor que "azul"
* Usa verbos claros: cambiar, agregar, remover
* Menciona materiales cuando importa: "madera clara", "vidrio"
* Incluye tamaños relativos: "ventana grande", "planta pequeña"

**🎯 Complejidad adecuada:**

* Instrucciones simples dan mejores resultados
* Evitá pedir múltiples cambios en una sola instrucción
* Si querés cambiar dos cosas, usá dos anotaciones

**🔄 Proceso iterativo:**

* Hacé cambios estructurales primero (ventanas, puertas)
* Luego cambios de color y texturas
* Finalmente detalles decorativos
* Aceptá cada paso antes de seguir

**⚡ Eficiencia:**

* Agrupar cambios similares en una ronda
* No regeneres si solo falta ajustar una instrucción
* Revisá todas las instrucciones antes de generar

***

## Tipos de ediciones soportadas

### <Icon icon="check" color="green" /> Lo que funciona muy bien

**Cambios de color:**

* Paredes, pisos, techos
* Muebles y textiles
* Elementos decorativos

**Agregar elementos:**

* Ventanas y puertas
* Muebles nuevos
* Plantas y decoración
* Cuadros y espejos
* Iluminación

**Remover elementos:**

* Muebles no deseados
* Objetos decorativos
* Manchas o imperfecciones
* Elementos distractores

**Modificar texturas:**

* Cambiar tipo de piso
* Modificar revestimientos
* Actualizar materiales

### ⚠️ Limitaciones

**Lo que puede no funcionar perfectamente:**

* Cambios arquitectónicos complejos
* Perspectivas muy distorsionadas
* Áreas muy oscuras o sobreexpuestas
* Elementos muy pequeños (\< 5% de la imagen)
* Reflejos en vidrios o espejos

**No soportado:**

* Cambiar estructura completa del edificio
* Agregar pisos o niveles nuevos
* Modificar dimensiones físicas del espacio
* Cambios que requieren replanteo arquitectónico

***

## Resolución de problemas

### El resultado no es lo que esperaba

**Posibles causas y soluciones:**

<Icon icon="close" color="red" /> **Instrucción poco clara**
→ Editá la instrucción con más detalles específicos
→ Descartá y regenerá

<Icon icon="close" color="red" /> **Anotación mal ubicada**
→ Eliminá la anotación
→ Creá una nueva en el lugar correcto

<Icon icon="close" color="red" /> **Demasiados cambios juntos**
→ Descartá el resultado
→ Dividí en varias rondas más simples

<Icon icon="close" color="red" /> **Imagen original de baja calidad**
→ Usá una foto con mejor resolución y luz
→ La IA funciona mejor con imágenes claras

### El botón generar está deshabilitado

Verificá que:

* <Icon icon="check" color="green" /> Tengas al menos una anotación creada
* <Icon icon="check" color="green" /> Todas las anotaciones tengan instrucciones escritas
* <Icon icon="check" color="green" /> No estés en modo preview (aceptá o descartá primero)
* <Icon icon="check" color="green" /> No haya un proceso de generación en curso

### La generación tarda mucho

**Tiempos normales:**

* Edición simple: 5-10 segundos
* Edición compleja: 10-20 segundos
* Múltiples anotaciones: 15-25 segundos

**Si tarda más de 30 segundos:**

* No cierres la página, podría estar procesando
* Si supera 1 minuto, refrescá la página
* Intentá nuevamente con menos anotaciones

***

## Casos de uso profesionales

### 🏠 Inmobiliarias

**Preparación de propiedades:**

* Remover muebles personales del propietario
* Cambiar colores desactualizados o personalizados
* Agregar muebles faltantes para staging
* Eliminar imperfecciones menores

**Ejemplo:** Sacás foto de una casa con paredes verdes y muchos muebles. Removés los muebles y cambiás las paredes a blanco neutro.

### 🎨 Diseñadores de Interiores

**Propuestas de cambio:**

* Mostrar cómo se vería un cambio de color
* Probar diferentes muebles en el espacio
* Agregar elementos decorativos propuestos
* Demostrar mejoras sin hacer la obra

**Ejemplo:** Mostrás al cliente cómo se verá su living con la pared azul que sugeriste, antes de pintar.

### 🏗️ Arquitectos y Renovadores

**Visualización de reformas:**

* Mostrar cómo se verá una ventana nueva
* Visualizar cambio de pisos
* Proponer nuevas distribuciones
* Presentar diferentes opciones de terminación

**Ejemplo:** Mostrás al cliente cómo se vería agregar una ventana en esa pared sólida.

### 📷 Fotógrafos Inmobiliarios

**Mejora de fotos:**

* Remover elementos temporales (basura, carteles)
* Ajustar colores de paredes mal iluminadas
* Eliminar reflejos no deseados
* Limpiar imperfecciones visuales

**Ejemplo:** Eliminás cables, manchas o elementos que distraen de fotos de un proyecto.

***

## Diferencias con Alma

<Bloomy /> ofrece dos herramientas de IA para imágenes. ¿Cuál usar?

### Alma (Diseño completo)

**Cuándo usar:**

* Querés transformar un espacio **completamente**
* Necesitás cambiar **todo el estilo** decorativo
* No te importa qué específicamente cambie
* Buscás **inspiración** y opciones

**Características:**

* Rediseño total automático
* 23 estilos predefinidos
* Rápido (3-5 segundos)
* Mantiene arquitectura, cambia todo lo demás

\[Placeholder: Ejemplo de resultado de Alma]

### Edición Manual (Control preciso)

**Cuándo usar:**

* Querés cambiar elementos **específicos**
* Necesitás **control total** sobre qué modificar
* Hacés cambios **puntuales**
* Querés preservar la mayor parte de la imagen

**Características:**

* Control punto por punto
* Instrucciones personalizadas
* Toma más tiempo (10-20 segundos)
* Cambios quirúrgicos precisos

\[Placeholder: Ejemplo de resultado de edición manual]

### Tabla comparativa

| Característica           | Alma              | Edición Manual        |
| ------------------------ | ----------------- | --------------------- |
| **Control**              | Bajo              | Alto                  |
| **Velocidad**            | Rápida            | Media                 |
| **Cambios**              | Todo el espacio   | Específicos           |
| **Curva de aprendizaje** | Fácil             | Media                 |
| **Casos de uso**         | Rediseño, staging | Ajustes, correcciones |
| **Instrucciones**        | Predefinidas      | Libres                |

<Tip>**Consejo:** Podés usar ambas en un mismo proyecto. Alma para el diseño inicial, luego edición manual para ajustes finos.</Tip>

***

## Preguntas frecuentes

<AccordionGroup>
  <Accordion title="¿Cuántas anotaciones puedo agregar?">
    No hay límite técnico, pero recomendamos máximo 5-8 por generación para mejores resultados.
  </Accordion>

  <Accordion title="¿Puedo editar la misma imagen varias veces?">
    Sí, podés hacer rondas ilimitadas de edición. Cada vez que aceptás, esa se convierte en la nueva base.
  </Accordion>

  <Accordion title="¿Qué pasa con mis anotaciones después de generar?">
    Si aceptás el resultado, las anotaciones se borran (ya están aplicadas). Si descartás, se mantienen para que las ajustes.
  </Accordion>

  <Accordion title="¿Puedo deshacer un cambio después de aceptar?">
    No hay función de deshacer. Por eso es importante revisar bien antes de aceptar. Recomendación: descargá la original antes de editar.
  </Accordion>

  <Accordion title="¿La imagen original se borra?">
    No, cuando aceptás una edición, <Bloomy /> guarda la nueva versión. La original permanece si la descargaste antes.
  </Accordion>

  <Accordion title="¿Puedo usar texto en mis instrucciones como 'más grande' o 'más claro'?">
    Sí, pero es más efectivo ser específico: "50% más grande" o "color azul claro #E3F2FD".
  </Accordion>

  <Accordion title="¿Funciona con fotos de exteriores?">
    Sí, funciona tanto con interiores como exteriores: jardines, fachadas, patios, etc.
  </Accordion>

  <Accordion title="¿Qué formato tienen las imágenes generadas?">
    Se mantiene el formato y resolución de tu imagen original.
  </Accordion>

  <Accordion title="¿Hay límite de uso mensual?">
    Depende de tu plan y los créditos disponibles. Verificá en tu configuración de cuenta.
  </Accordion>

  <Accordion title="¿Puedo descargar todas las versiones generadas?">
    Sí, te recomendamos descargar cada versión que te guste antes de seguir editando.
  </Accordion>
</AccordionGroup>

***

## Privacidad y almacenamiento

**¿Dónde se guardan las imágenes editadas?**

* Todas las versiones se guardan en tu proyecto de <Bloomy />
* Están asociadas a tu organización y proyecto
* Podés acceder a ellas desde la galería de imágenes
* Solo vos tenés acceso (y tu equipo si es proyecto compartido)

***

**La edición manual con IA te da control quirúrgico sobre tus imágenes.** Experimentá, iterá y transformá tus fotos exactamente como las imaginás, con la potencia de la inteligencia artificial y la precisión de tus instrucciones.
