🏠 ¿Qué es esta aplicación?
- Es un editor de dibujo técnico (tipo CAD) donde trabajas sobre un canvas (lienzo).
- Un proyecto puede tener varias hojas (como páginas). Cada hoja es un canvas.
- Todo lo que añadas (textos, flechas, líneas, figuras, imágenes, símbolos) son objetos que puedes mover, escalar, rotar, colorear y ordenar por capas.
🚀 Tu primera vez (5 minutos para arrancar)
- Abrir una hoja
A la izquierda verás navegación de Hojas. Puedes crear, duplicar o renombrar una.
- (Opcional) Insertar un fondo
Panel derecho → Insertar fondo. Útil si quieres dibujar encima de un plano o imagen.
También se permite hacer un recorte de pantalla y pegar directamente con Ctrl + V.
- Añadir una leyenda
Panel derecho → Insertar leyenda. Te sirve para explicar símbolos o notas del dibujo.
- Dibujar algo básico
- Pulsa T (Texto) y haz clic en el canvas → escribe un título.
- Pulsa F (Flecha) → clic para origen, suelta para la punta.
- Pulsa P (Polilínea) → varios clics para segmentos rectos → Enter para terminar.
- Mover y ajustar
Pulsa S (Selección). Haz clic en un objeto para moverlo (arrastrar), escalarlo (tirando de sus esquinas) o rotarlo (tirando del control superior).
- Cambiar color rápidamente
Selecciona un objeto → pulsa . (punto) para abrir la consola → escribe r (rojo) → Enter.
- Guardar y Exportar
- Panel izquierdo → Proyecto (Guardar / Cargar).
- Panel izquierdo → Exportar (hoja actual o todas).
💡 Atajo de seguridad: si te lías, pulsa ESC y vuelves a Selección.
🖥️ La interfaz, sin enredos
Panel izquierdo (gestión y navegación)
- Hojas: cambiar de hoja, añadir/duplicar/eliminar, renombrar (doble clic), reordenar (arrastrar miniaturas). Siempre debe quedar al menos 1 hoja.
- Proyecto: Guardar y Cargar proyectos.
- Exportar: exporta la hoja actual o todas.
- Ayuda: abre la guía integrada.
Panel derecho (herramientas y propiedades)
- Fondo: insertar / eliminar imagen de fondo.
- Leyenda: insertar un bloque de leyenda.
- Zoom: usa la rueda del ratón para acercar/alejar el canvas. Haz clic con la rueda o pulsa el botón para restablecer el zoom al 100% y centrar el canvas. El indicador de zoom muestra el nivel actual y resalta si está en la vista original.
- Herramientas: Selección, Texto, Flecha, Stickers (símbolos), Polilínea, Círculo, Rectángulo, Polígono, Imagen. Puedes cambiar rápidamente de herramienta con su atajo de teclado (ver sección Atajos).
- Propiedades (con objetos seleccionados): Tipo de línea, Color, Orden de capas, Deshacer/Rehacer.
Menú contextual (clic derecho)
- Permite copiar, cortar, pegar, cambiar tamaño de texto, editar polilíneas/flechas y ordenar objetos según el tipo seleccionado.
Herramientas fuera de panel (solo teclado)
- Historial: Deshacer (Ctrl+Z), Rehacer (Ctrl+Y).
- Portapapeles: Copiar (Ctrl+C), Cortar (Ctrl+X), Pegar (Ctrl+V).
- Eliminar Objetos: Eliminar selección (Supr o Backspace).
🔧 Qué puedes hacer con cada herramienta
Todas tienen botón en el Panel derecho. Entre paréntesis verás su atajo.
⚙️ Propiedades y acciones comunes (con objetos seleccionados)
- Color: desde el botón de color o con comandos (ver consola).
- Tipo de línea: cambia el estilo de trazo (línea continua, etc.).
- Orden de capas: trae al frente o manda al fondo cuando hay solapes.
- Orden global — O: ordena todos los objetos del canvas por prioridad. También disponible desde el menú contextual (clic derecho).
- Deshacer/Rehacer: botones o Ctrl+Z / Ctrl+Y.
💻 Consola de comandos (rápida y potente)
Cómo usarla
- Pulsa . (punto) para abrir la consola.
- Escribe el comando.
- Pulsa Enter para ejecutarlo.
Comandos de color (selecciona uno o varios objetos antes):
r → rojo
a → azul
v → verde
n → negro
ci → cian
m → morado
Otros
st → abre el menú de Stickers (si está habilitado).
Escribe el nombre de un símbolo (por ejemplo, cpm, cgp, etc.) y pulsa Enter para insertarlo directamente sin abrir el menú.
✅ También puedes cambiar colores desde la UI. La consola es una vía rápida si prefieres el teclado.
⌨️ Atajos de teclado (los imprescindibles)
Navegación y edición
Rueda Zoom in/out
Clic rueda Restablecer zoom
ESC Salir de edición y volver a Selección
E Entrar/salir de edición (flechas/polilíneas)
Enter Terminar polilínea/polígono
O Ordenar Objetos
Herramientas
SSelección
TTexto
FFlecha
PPolilínea
CCírculo
GPolígono
IImagen
RRectángulo
⚠️ L (Línea) existe pero no usar (deshabilitada)
Historial y portapapeles
Ctrl+Z / Ctrl+Y Deshacer / Rehacer
Ctrl+C / Ctrl+X / Ctrl+V Copiar / Cortar / Pegar
Delete / Backspace Eliminar selección
Ctrl+A Seleccionar todo
Ctrl+D Limpiar el canvas (¡cuidado!)
⚠️ Importante:
• Cuando una polilínea está en edición, los atajos con Ctrl (copiar, cortar, pegar, deshacer, rehacer, seleccionar todo) y el borrado quedan bloqueados. Solo puedes editar vértices.
• El menú contextual (clic derecho) permite copiar, cortar, pegar, cambiar tamaño de texto, editar polilíneas/flechas y ordenar objetos según el tipo seleccionado.
• Usa ESC o E para salir del modo edición y recuperar los atajos globales.
📝 Ejemplos prácticos (paso a paso)
A) Anotar un plano con flechas y textos
- Insertar fondo (plano o imagen).
- Textos Predefinidos → Busca el texto en el buscador y dale clic al que quieras colocar. Haz clic en el canvas para insertarlo.
- F → crea una flecha señalando un punto de interés.
- O → Ordena todos los elementos en sus capas correspondientes automáticamente.
B) Dibujar un recorrido con polilínea ortogonal
- P → clic en el origen.
- Mantén Ctrl para asegurar segmentos rectos.
- Clics en cada cambio de dirección.
- Enter para terminar.
- S → . →
r → Enter (color rojo).
C) Usar stickers (símbolos) para una leyenda rápida
- Botón Stickers → elige un símbolo.
- Haz clic varias veces para poner varios.
- S para recolocar y rotar.
- Leyenda → inserta bloque y añade textos explicativos.
✅ Buenas prácticas que te ahorran dolores de cabeza
- Sal siempre de modos de edición con ESC antes de usar atajos globales.
- Para precisión en polilíneas, usa Ctrl y el encaje a cualquier punto de la polilínea, para cerrar formas limpias.
- Si "algo no responde", prueba ESC (vuelve a Selección) y reintenta.
🔧 Problemas comunes y cómo resolverlos
El canvas se ve demasiado grande (o demasiado pequeño)
→ Cambia el zoom de tu navegador para que el canvas encaje bien entre las barras laterales.
No puedo borrar / no funcionan atajos Ctrl o copiar/pegar
→ Estás editando una polilínea. Mientras dure la edición, los atajos globales y el portapapeles están bloqueados. Pulsa ESC o E para salir del modo edición y recuperar los atajos.
No encuentro un objeto
→ Puede estar detrás de otro. Usa Orden de capas (enviar al frente).
El zoom se fue muy lejos
→ Clic en rueda o botón Restablecer.
No puedo rotar un texto predefinido
→ Es normal. Solo puedes cambiar ancho/alto.
La flecha no apunta donde quiero
→ Selecciónala → E → arrastra origen o punta.
📖 Referencia rápida (para imprimir)
Herramientas:
S Selección · T Texto · F Flecha · P Polilínea · C Círculo · G Polígono · I Imagen
Edición:
E editar flecha/polilínea · Doble clic edita texto/polilínea · ESC vuelve a Selección
Zoom:
Rueda in/out · Clic rueda restablecer
Consola:
. abrir · escribir comando · Enter ejecutar
Colores: r rojo · a azul · v verde · n negro · ci cian · m morado
Stickers: st (si está habilitado)
Historial/Clipboard:
Ctrl+Z / Y · Ctrl+C / X / V · Ctrl+A · Ctrl+D (limpiar)
Notas:
- El portapapeles y los atajos globales se desactivan durante la edición de polilíneas. Usa ESC o E para salir.
- El menú contextual (clic derecho) permite copiar, cortar, pegar, cambiar tamaño de texto, editar polilíneas/flechas y ordenar objetos.
- L (Línea) no usar