Documentación / El IDE
La interfaz
Barra de título, rieles, chat, editor y panel inferior. Lo diario a la vista; lo demás, a un clic.
La interfaz de Yuli se organiza en tres zonas y pone primero lo que se usa a diario. Lo demás está a un clic, con nombre y una línea que dice para qué sirve.
┌──────────────────────── Barra de título ────────────────────────┐
├──────────────────────── Pestañas de proyecto ───────────────────┤
│ Riel │ Proyecto │ Chat │ Editor │ Riel │
│ izq. │ │ │ │ der. │
│ ├──────────┴───────────────┴──────────────────────┤ │
│ │ Panel inferior │ │
└──────────────────────── Barra de estado ────────────────────────┘
| Zona | Qué hay |
|---|---|
| Izquierda: el proyecto | Archivos, Git y la configuración del agente. |
| Centro: la conversación | El chat con la IA: Yuli Platform, Claude Code, Kiro, Codex o Antigravity. |
| Derecha: el trabajo | El editor y sus pestañas: archivos, Cambios IA, REST Client, Web Studio, diagramas y herramientas. |
Barra de título
| Parte | Contenido |
|---|---|
| Izquierda | El botón ☰ (Mostrar menú). Plegado, muestra el proyecto activo; desplegado, los menús Archivo, Editar, Ver, Proyecto, Agente, Git, Herramientas, Ventana y Ayuda. |
| Centro | La cápsula del agente. Cuando trabaja, dice qué hace («La IA está trabajando», «Tu Claude Code está trabajando», o cuántos agentes y tareas). Un clic te lleva al chat. |
| Derecha | Cambio de tema claro u oscuro, consumo de tokens y los botones de la ventana. |
Doble clic sobre la barra maximiza la ventana.
Pestañas de proyecto
Debajo, una pestaña por proyecto abierto. Desde ahí abres otro proyecto, lo pasas a una ventana nueva o usas Vista dividida: ver dos proyectos a la vez. Con Ctrl+Alt+PageDown y Ctrl+Alt+PageUp cambias de pestaña.
Riel izquierdo
| Botón | Para qué | Atajo |
|---|---|---|
| Proyecto | Muestra u oculta el panel de proyecto. | Alt+1 |
| Web Studio | Diseño, vista previa, arquitectura y app completa. | Alt+Shift+W |
| Base de datos | Conexiones, esquemas, SQL y PL/SQL. | Alt+Shift+D |
| Más herramientas | Abre la hoja con el resto. | — |
En Más herramientas:
| Herramienta | Para qué | Atajo |
|---|---|---|
| Repositorios remotos (MCP) | GitHub y GitLab conectados. | Alt+2 |
| Tareas en segundo plano | Lo que la IA hace mientras trabajas. | Alt+Shift+B |
| Requisitos | Trazabilidad regla → código → prueba. | Alt+Shift+R |
| Contenedores | Docker y Kubernetes. | Alt+Shift+K |
| Desarrollo remoto | WSL, SSH y contenedores de desarrollo. | Alt+Shift+O |
| CI/CD | Jenkins, GitHub Actions, GitLab CI y CloudBees. | Alt+Shift+J |
Abajo del riel, el botón para mostrar u ocultar el panel inferior.
Riel derecho
Arriba, la Columna del editor:
- Editor: muestra, oculta o enfoca el editor (
Ctrl+Shift+C). - Cambios IA: pendientes e historial (
Ctrl+Alt+R). Muestra un contador cuando hay cambios por revisar.
En Más herramientas:
| Herramienta | Para qué |
|---|---|
| REST Client | Prueba y depura peticiones HTTP (Alt+9). |
| Diagramas | Cómo se conecta el sistema (Ctrl+Alt+D). |
| Centro de Gobierno | Contrato de calidad, puertas, datos sensibles, diseño y entrega. |
| Centro de seguridad | Hallazgos y secretos. |
| Modernización | Migraciones y versiones. |
| Pruebas de caracterización | Pruebas que fijan el comportamiento actual antes de cambiarlo. |
| Entornos remotos | Variables y perfiles. |
| APIGEE | Token, llaves y contratos. |
Abajo del riel, el botón para mostrar u ocultar el chat (Ctrl+Alt+I).
Lo que abres desde «Más herramientas» sube al riel mientras lo usas. Así siempre ves dónde estás sin tener treinta iconos a la vista.
Panel inferior
| Pestaña | Para qué | Atajo |
|---|---|---|
| Terminal | Terminal integrada. | Alt+Shift+F12 |
| Ejecución | Salida de la aplicación, con enlaces al código. | Alt+4 |
| Problemas | Errores y avisos del proyecto. | Alt+6 |
| Tests | Explorador y resultados de pruebas. | Alt+5 |
| Calidad | Calificación, medición y métricas. | — |
En Más: Sincronización (Alt+8), Maven / Gradle / Ant (Alt+7), Code Intelligence (Alt+0), Spring, Inspecciones, Contenedores y JVM. La pestaña que abras desde «Más» se queda en la barra mientras la uses.
Alt+F12 muestra u oculta el panel; Shift+Esc lo oculta.
Pantalla de inicio
Con nada abierto, el editor pregunta «¿Qué quieres hacer?» y ofrece cuatro caminos:
- Pedir algo a la IA: lo planea, lo hace y lo verifica.
- Abrir un archivo: busca por nombre o elige uno del proyecto.
- Diseñar una pantalla: Web Studio dibuja la interfaz en vivo y la lleva a código.
- Ejecutar y probar: arranca la aplicación y muestra pruebas y problemas.
Barra de estado
Muestra el consumo de la sesión, los tokens de la tarea actual, el tamaño del proyecto, la calificación de calidad, el estado del motor Java, los recursos (RAM y CPU) y el estado de CI. Un clic la expande con el detalle.
Modo zen
Ctrl+Shift+F12 deja solo el editor. Vuelve a pulsarlo para recuperar los paneles.