Isometric House Builder — dibuja tu casa para el widget « Vista de la casa »
El widget Vista de la casa de Gladys v5 ofrece cuatro ilustraciones prediseñadas, y acepta sobre todo tu propia imagen, sobre la cual luego colocas tus etiquetas de dispositivos. Quería la mía, con mi verdadera huella, mi techo real y mi portal — así que hice una pequeña herramienta para eso.
Abrir la herramienta · 
Guía de inicio rápido
Nada que instalar, todo se hace en el navegador, es gratis y libre (MIT).
Qué hace
- Dibujas la huella en el plano, sobre una cuadrícula de 1 m o 0,50 m — cada pared muestra su longitud, por lo que puedes ajustar las dimensiones reales.
- Techo: cimbra, dos vertientes, cobertizo, techo plano, con inclinación y voladizo ajustables. Las canaletas entre dos alas se calculan.
- Aperturas: ventanas, postigos, puertas, puerta de garaje, colocadas con un clic en cualquier pared.
- Varios cuerpos de edificio: el cobertizo tiene su techo plano y su revestimiento mientras la casa mantiene sus tejas.
- Alrededores: piscina, terraza, camino, setos, árboles, coche — y muro + portal/portillo, el portal abre automáticamente el muro donde lo colocas.
- Materiales: tejas, tejas canal mezcladas, pizarra, chapa de acero, ladrillo, revestimiento, piedra, entramado de madera.
- Cámara libre: haces girar la casa con el ratón 360°, desde la vista rasante hasta la casi vertical.
Lo más útil para un tablero de control
Una vista general no sirve de mucho para controlar un dispositivo: el portal ocupa unos pocos píxeles. Por lo tanto, puedes enmarcar una zona dibujada en el plano — lo que está fuera desaparece, lo que la atraviesa se corta netamente, y la cámara ajusta lo que queda. Una casa, tantas imágenes como widgets.
Cada encuadre se guarda como vista nombrada, y un botón las reexporta todas de una vez cuando la casa cambia.
También hay un modo noche, con las ventanas encendidas.
Para que se integre bien
Tres ajustes que marcan la diferencia:
- Mantén la paleta « Horizontes » (la predeterminada): reproduce los colores exactos de las ilustraciones de Gladys v5.
- Exporta en PNG, fondo transparente, tamaño Gladys — 2560 × 1600. (Gladys reduce cualquier imagen a 2560 px de lado más largo: exportar en 4× da una imagen menos nítida, no más.)
- En Gladys: widget Vista de la casa → sube la imagen → haz clic en ella para colocar tus etiquetas.
Privacidad
Ninguna solicitud de red, ninguna cuenta, ninguna medición de audiencia: tu proyecto se queda en el almacenamiento local de tu navegador. El botón Guardar produce un archivo .house.json que guardas en tu casa.
Única excepción a conocer: el botón Compartir copia un enlace que contiene todo el proyecto en su dirección. Está hecho para enviar tu casa a alguien — no es el enlace para difundir si no quieres mostrar la tuya.
Qué no es
No pretendo hacer una herramienta de modelado ultra avanzada ni un renderizado realista. El objetivo es modesto y asumido: producir una bonita ilustración isométrica, reconocible, que se integre correctamente en un tablero de control. Sin texturas fotográficas, sin interiores, sin terreno en pendiente.
En cambio, los comentarios sobre los errores son muy bienvenidos. Ya he corregido un buen número de ellos al usarlo en mi propia casa, pero tus casas no se parecen a la mía — frontones, techos de una sola vertiente, formas en U, grandes voladizos: seguramente quedan casos que no se ven bien.
Si te encuentras con algo extraño, lo más eficaz es:
- hacer clic en Guardar para recuperar tu archivo
.house.json, - hacer una captura de lo que falla,
- y abrir un problema aquí: Issues · guim31/isometric-house-builder · GitHub
Con el archivo, el defecto se reproduce en unos segundos — sin él, es adivinanza.
¡Buen dibujo! 
— Tan pronto como un cuerpo tiene más de un piso, el panel Cuerpo ahora propone una altura por nivel. Tu « entre-deux » es el piso bajo el desván: dos niveles completos + un último nivel bajo (por ejemplo, 2,50 / 2,50 / 1,20 m), y el techo comienza encima.
Bueno, es un detalle, no importa si no es posible…
