Swift Web Studio
Diseña SwiftUI en el navegador. Conserva el código Swift.
Edición visual, un editor de código Swift y una vista previa interactiva en dispositivos en un solo espacio de trabajo. Empieza con una plantilla o con tus propios archivos Swift, perfecciona el diseño y exporta un proyecto para desarrollo nativo.
La mayoría de las herramientas de diseño dibujan imágenes de apps. Swift Web Studio edita la propia app: cada cambio en el lienzo es un cambio en el código fuente Swift, así que lo que se entrega es el código.
Lo más destacado.
Una herramienta de diseño que habla Swift.
Ediciones que conservan el código fuente. Los cambios visuales se aplican sobre el Swift subyacente; lo que el lienzo no puede editar sigue siendo editable en el código.
Componentes. Entradas de instancia, variantes guardadas y colores, espaciados y estilos de texto compartidos.
Colecciones. Registros con un diseño de fila compartido y escenarios de vista previa para probar contenido.
Vista previa en dispositivos. Una vista previa interactiva con distintos tamaños de dispositivo, aspectos y tamaños de texto.
Comprobaciones. Señala posibles problemas de contraste, de objetivos táctiles y de desbordamiento.
Presentación. Muestra pantallas o exporta PNG y hojas de contactos.
Deshacer compartido. Organiza pantallas y capas, con deshacer y rehacer en ambas.
Imágenes. Importa PNG y JPEG, con variantes oscuras opcionales.
Guardado automático y archivos comprimidos. Los proyectos se guardan en el navegador; descarga un archivo editable cuando quieras.
Bajo el capó.
Los paquetes del compilador, el intérprete y la maquetación son independientes de React y del DOM. La vista previa se ejecuta en un Web Worker.
apps/webEspacio de trabajo Next.js, editor, cuadros de diálogo y host del workerswift-syntaxAnalizador léxico, analizador sintáctico, árbol de sintaxis y ediciones del código fuenteswift-semaResolución de nombres, análisis semántico y ediciones de diseñoswift-runtimeUn intérprete de Swiftswiftui-runtimeEstado de SwiftUI, composición de vistas e interaccionesswiftui-layoutMaquetación y medición de textoswiftui-render-domPresentación del árbol de renderizadoproject-modelProyectos, archivos, plantillas, persistencia y uso compartidoexporterEstructura base de proyectos e importación y exportación ZIPshared · sim-shellTipos compartidos y especificaciones de dispositivosLa vista previa interpreta un subconjunto compatible de Swift y SwiftUI. No ejecuta el compilador de Apple ni el iOS Simulator, así que las apps exportadas se compilan y revisan en Xcode antes de publicarlas.
Seis formas de exportar.
El código fuente Swift se conserva en todos los formatos.
Especificaciones técnicas
- Tecnologías
- TypeScript; un espacio de trabajo Next.js con paquetes independientes de lenguaje, ejecución y maquetación
- Vista previa
- Un intérprete de Swift y SwiftUI en un Web Worker, que cubre un subconjunto documentado
- Almacenamiento
- Guardado automático en el navegador (IndexedDB); archivos
.swiftstudio.zipeditables - Exportación
- Proyecto de Xcode, app de Swift Playgrounds, paquete Swift, especificación de XcodeGen
- Prompts
- Creación opcional a partir de prompts, con tu propia clave de proveedor
- Calidad
- CI con comprobación de tipos, lint y pruebas unitarias; pruebas de extremo a extremo con Playwright; un límite de tamaño del bundle
- Pruébalo
- Demo en vivo, o en local con Node.js 22 y npm 11 · GitHub