Introducción
Easelt Builder es un diseñador visual para interfaces dx de MTA:SA — dibuja tu HUD o menú, conecta su lógica y exporta un recurso listo para ejecutar.
Easelt Builder es un diseñador visual basado en navegador para crear GUIs dxDraw de MTA:SA — HUDs, menús, paneles, pantallas de inicio de sesión, tiendas y flujos de varias ventanas. Dibujas sobre un lienzo, aplicas estilo a cada elemento en el inspector, conectas la lógica en Blueprint, lo pruebas en vivo a cualquier resolución y exportas un recurso de MTA listo para ejecutar — todo sin salir de tu navegador.
¿Nuevo por aquí? Ve directamente al Inicio rápido para crear y exportar tu primer HUD en unos minutos, y luego vuelve a esta página para tener la visión completa.
Qué es Easelt Builder
Easelt Builder convierte las partes tediosas del trabajo de UI con dxDraw — calcular a mano las posiciones en píxeles, adivinar la escala, volver a probar en distintas resoluciones — en un flujo de trabajo directo y visual. Todo lo que normalmente escribirías a mano con dxDrawRectangle, dxDrawText y dxDrawImage lo dibujas, arrastras y estilizas en un lienzo en vivo, y luego lo exportas como un recurso ejecutable.
Toda la aplicación se ejecuta en tu navegador. Tu trabajo se guarda localmente y se cifra en reposo — no se sube nada a un servidor. Tus diseños permanecen en tu máquina.
Dado que los proyectos residen en el almacenamiento local de tu navegador, están vinculados al navegador que uses. Exporta tu recurso para mover un diseño entre máquinas.
Responsivo por fracciones
La idea central detrás de Easelt Builder es responsivo por fracciones: cada posición y tamaño se almacena como una fracción de la pantalla, un número entre 0 y 1 — exactamente como el código dxDraw bien escrito. Un elemento en x = 0.40 se sitúa al 40% del ancho de la pantalla en *cualquier* resolución, de modo que tu UI mantiene su disposición ya sea que un jugador use 1080p, 1440p o ultrawide.
Para la vista previa, Easelt Builder renderiza a una resolución elegida. Convierte cada fracción almacenada en un valor real de píxeles y escala el texto y el espaciado para que lo que ves coincida con lo que los jugadores obtienen en el juego.
| Concepto | Cómo funciona |
|---|---|
| Valor almacenado | Cada x, y, width, height es una fracción de 0 a 1. |
| Conversión a píxeles | pixel = fraction * gameWidth — una fracción se convierte en un píxel real en pantalla a la resolución de vista previa. |
| Factor de escala | S = gameHeight / 1080 — el texto y el espaciado se escalan respecto a una referencia de 1080p. |
| Ejemplo | x = 0.40 se renderiza al 40% del ancho de la pantalla en todas las resoluciones. |
Pensar en fracciones significa que diseñas una sola vez y se ve bien en todas partes — sin ajustes por resolución.
Qué puedes crear
El flujo de trabajo
- Dibuja en el lienzoColoca y organiza tus elementos visualmente en el lienzo en vivo.
- Aplica estilo en el inspectorEstablece colores, tamaños, fuentes y otras propiedades para el elemento seleccionado.
- Añade lógica en BlueprintConecta la interactividad — clics, estado y flujo de ventanas — usando el editor visual Blueprint.
- Prueba en vivoPrevisualiza tu GUI ejecutándose a una resolución elegida para confirmar la disposición y el comportamiento.
- Exporta un recursoGenera un recurso de MTA:SA ejecutable que puedes colocar en tu servidor.
Cómo está organizada esta guía
La documentación está dividida en cinco partes para que puedas encontrar lo que necesitas en cada etapa de un proyecto:
Idiomas
Easelt Builder está disponible en cinco idiomas, para que puedas trabajar en el que te resulte más cómodo:
- Inglés
- Árabe
- Francés
- Portugués
- Español
© Easelt · C4