Acceso a proyectos y repositorios
Abre una carpeta que contenga un proyecto web existente o clona un repositorio desde una URL de Git. Las herramientas Explorer, apertura rápida y búsqueda del proyecto permiten navegar por el código.
Shape
Freemium
Shape es un IDE de escritorio que reúne edición de código, flujos de trabajo locales, inspección visual del diseño, herramientas de Git y chat con IA para diseñadores y programadores.
¿Qué es Shape?
Shape es un IDE de escritorio para trabajar en proyectos web con código, diseño visual, desarrollo local, Git y asistencia de IA en un único entorno de trabajo. Puedes abrir una carpeta existente o clonar un repositorio, inspeccionar los archivos del proyecto, instalar dependencias, ejecutar scripts de paquetes y previsualizar una aplicación local en una pestaña Browser integrada.
Su propósito principal es permitir que diseñadores y programadores pasen de los archivos fuente a una página local en ejecución, los diagnósticos del proyecto, los cambios del control de versiones y la edición asistida por IA sin cambiar de entorno de desarrollo. El flujo de trabajo documentado prioriza el uso local: los proyectos se ejecutan mediante el gestor de paquetes y el servidor de desarrollo del usuario, mientras Shape proporciona las superficies de edición, previsualización, inspección del diseño y chat.
¿Qué puede hacer Shape?
Terminal integrada y ejecución de scripts
Instala dependencias con npm, pnpm, yarn o bun y ejecuta scripts del proyecto desde la terminal o el menú Scripts de la barra de título. Un servidor de desarrollo local puede exponer la aplicación para su previsualización.
Previsualización en Browser con modo de diseño
Abre una URL local en la pestaña Browser integrada y usa el modo de diseño para inspeccionar la página activa. Puedes usar la paleta y los controles de diseño para aplicar cambios de disposición o color al código fuente.
Chat con IA con modos Ask y Code
El modo Ask ofrece respuestas de solo lectura sobre el proyecto abierto. En el modo Code, el agente puede buscar, editar y ejecutar comprobaciones; puedes adjuntar archivos, carpetas, el código base o una selección, y revisar las ediciones con Keep o Undo.
Edición de código y diagnósticos
Edita y guarda archivos del proyecto con comandos conocidos de navegación y búsqueda, y consulta los informes de TypeScript o ESLint en el panel Problems. La guía de inicio rápido también documenta el formato al guardar y la configuración del editor.
Herramientas para el flujo de trabajo de Git
Prepara fragmentos individuales de un diff desde una pestaña de diferencias y usa Git Manager para solicitudes de incorporación de cambios y comprobaciones, manteniendo las tareas habituales del repositorio junto con la edición y la previsualización.
Casos de uso
“Modificar un proyecto web existente”
Abre una carpeta o un repositorio clonado, instala sus dependencias, inicia el script de desarrollo y realiza un pequeño cambio en el código fuente mientras ves el resultado en la pestaña Browser.
“Inspeccionar un código base con IA antes de editar”
Usa el modo Ask para preguntar qué hace un archivo de entrada u otra parte del proyecto y recibir una respuesta sin aplicar cambios. Esto resulta útil para comprender código desconocido antes de modificarlo.
“Ajustar visualmente una página mientras trabajas en el código fuente”
Ejecuta el proyecto localmente, abre su URL local en Browser y usa el modo de diseño para inspeccionar la página renderizada y aplicar cambios de disposición o color compatibles al código fuente subyacente.
“Revisar cambios de código generados por IA”
Usa el modo Code para buscar en el proyecto, realizar ediciones y ejecutar comprobaciones en una misma conversación; después, revisa los cambios propuestos con Keep o Undo antes de conservarlos.
“Preparar y revisar cambios del repositorio”
Usa el editor y los diagnósticos durante el desarrollo; después, prepara fragmentos seleccionados del diff y accede a Git Manager para gestionar solicitudes de incorporación de cambios y comprobaciones.
Preguntas frecuentes
¿Qué tipo de aplicación es Shape?
Shape es un IDE de escritorio para diseñadores y programadores. Combina edición de código, desarrollo local, inspección visual del diseño, herramientas de Git y chat con IA.
¿Cómo inicio un proyecto en Shape?
Desde la pantalla de bienvenida, elige Open Project o File → Open Folder y selecciona una carpeta que contenga el proyecto. También puedes elegir Clone Repository, pegar una URL de Git y seleccionar una carpeta principal.
¿Puede Shape ejecutar un proyecto web local?
Sí. Abre la terminal, instala las dependencias con el gestor de paquetes que requiera el proyecto y ejecuta un script como npm run dev. Introduce la URL local resultante en la pestaña Browser de Shape.
¿Puede la IA hacer cambios en mis archivos?
Sí. En el modo Code, el agente puede buscar, editar y ejecutar comprobaciones en el mismo hilo. Puedes revisar las ediciones propuestas con Keep o Undo. El modo Ask es de solo lectura y no aplica ediciones.
¿Qué planes ofrece Shape?
La página de precios muestra los planes Free, Plus, Pro y Max. Free incluye el modelo Auto, una reserva mensual de tokens Auto y un editor de escritorio que prioriza el uso local; los planes de pago indican créditos mensuales, acceso a todos los modelos y beneficios adicionales específicos de cada plan.
Datos rápidos
- Categoría
- Herramienta para desarrolladores; herramienta de diseño; chat con IA
- Plataforma
- IDE de escritorio
- Usuarios principales
- Diseñadores y programadores
- Flujo de trabajo principal
- Abrir o clonar un proyecto, ejecutarlo localmente, editar el código fuente, previsualizarlo y usar el chat con IA
- Planes
- Free, Plus, Pro y Max
- Dominio de origen
- useshape.org
Análisis de tráfico de Shape
Los datos de tráfico son solo como referencia.
- Valoración del dominio
- 2
Alternativas a Shape
Nowa
nowa.dev
Crea aplicaciones para iOS, Android, web y escritorio con un creador de apps Flutter basado en IA, edición visual y acceso al código fuente.
CybeDefend
www.cybedefend.com
CybeDefend es una plataforma de seguridad de código diseñada para flujos de trabajo de programación con IA. Su capa VibeDefend revisa los prompts de los agentes y los diffs, aplica reglas de proyecto y de negocio, protege frente a acciones riesgosas y combina análisis de código, dependencias, secretos, infraestructura y CI/CD antes de una pull request.
GitHub Next
githubnext.com
GitHub Next es el sitio de investigación de GitHub para crear prototipos de futuras herramientas y flujos de trabajo de desarrollo de software, incluida la automatización de repositorios mediante lenguaje natural en GitHub Actions.
Label Studio
labelstud.io
Plataforma de código abierto para etiquetado de datos y evaluación de IA, con flujos de trabajo de anotación, revisión humana y evaluación de modelos.
Inception
inceptionlabs.ai
Inception desarrolla modelos de lenguaje grandes basados en difusión bajo la marca Mercury, como Mercury 2 para razonamiento y Mercury Edit 2 para edición de código, orientados a equipos que necesitan modelos rápidos y controlables para aplicaciones basadas en API, flujos de desarrollo, voz, agentes y búsqueda.
Agent Plugin Marketplace
www.cosmicjs.com
Un marketplace para instalar plugins de proveedores en el agente Cosmic responsable de una tarea. Está pensado para equipos que utilizan agentes Cosmic, herramientas MCP y flujos de trabajo relacionados con contenido u operaciones.