Este es el segundo artículo sobre SDD, Spec Driven Development, instrumentalizado sobre OpenSpec. Pero esta vez nos acercaremos usando softwere gratuito. Por un lado OpenCode en lugar de ClaudeCode y usando el modelo gratuito Gemma4 de Google en lugar de otros de pago.
Índice de contenidos
- 1. SDD con OpenSpec y OpenCode
- 2. Instalando OpenCode, LM Studio y Gemma4
- 3. Conectar OpenCode con Gemma4
- 4. Indicar a OpenSpec que vamos a usar OpenCode
- 5. Mismo ejemplo de la tabla periódica
- 6. Propuesta: separar ficheros
- 7. Propuesta: añadir modo oscuro
- 8. Conclusiones
- 9. Enlaces y referencias
1. SDD con OpenSpec y OpenCode
En el artículo anterior ya vimos la potencia de SDD con OpenSpec y ClaudeCode usando el modelo Sonnet. Pero comenzamos a vislumbrar que vamos a gastar tokens a mansalva. ¿Hacen falta los modelos más avanzados para hacer estas codificaciones? No. Yo creo que no. Diría que podemos usar modelos menos potentes a cambio de hacer unas especificaciones más precisas.
Tengo la teoría de que si las especificaciones son lo suficientemente buenas y las tareas se dividen en pequeños cambios atómicos, el SDD casi con cualquier modelo será un éxito.
En este artículo, vamos a instalarnos Gemma4 en local. Para ello instalaremos LM Studio, que nos permite descargar modelos de lenguaje y descargaremos Gemma4. También descargaremos OpenCode y aprenderemos como conectarlo para que use ese modelo. Y por últipo haremos uso de openspec para usarlo con OpenCode.
2. Instalando OpenCode, LM Studio y Gemma4
La instalación es muy sencilla.
curl -fsSL https://opencode.ai/install | bash
Con eso ya tenemos instalado opencode. Lo único que tenemos que hacer es ir en nuestra terminal hasta un directorio donde queramos usarlo y ejecutar el comando opencode. Pero antes debemos conectarlo a un modelo.
Como tengo un Mac, la mejor solución es instalarse LM Studio. En su página web dice que «LM Studio is free for home and work use». Nos descargamos el software y nos lo instalamos.
Una vez tenemos instalado LM Studio vamos al buscador de modelos y buscamos Gemma4. Como tengo 32 GB de RAM, busco el modelo Gemma 4 26b. Si tienes menos RAM es mejor el modelo Gemma 4 12b.
Hay muchísimos modelos de Gemma 4 26b ¿cuál debo bajar para mi ordenador? Pues aquí depende de tu procesador, tarjeta gráfica y memoria compartida. Hasta hace dos días no había escuchado la palabra cuantización refirie´ndose a la forma de comprimir las representaciones numéricas con tipos de menor precisión en los modelos locales, y está muy vinculado con la memoria VRAM de tu equipo.
En mi caso, me interesa el modelo Gemma 4 26b con cuantización Q4_K_M o Q4_K_S.
Ahora, nos vamos a Settings > Hardware y activamos la GPU with metal. Eso hará que LM Studio aproveche la GPU de la tarjeta gráfica.
Ahora, nos vamos a la pestaña de developer y activamos el servidor local que correrá en http://127.0.0.1:1234
3. Conectar OpenCode con Gemma4
En el punto anterior nos hemos descargado LM Studio y el modelo de Gemma4. Lo bueno es que esto lo haces una vez y luego ya puedes usarlo muchas veces.
Nos queda un último paso engorroso, que es connectar OpenCode con nuestro modelo local.
Desde la terminal vamos al directorio en el que queremos trabajar y abrimos opencode con el comando OpenCode. Nos saldra la pantalla de OpenCode y nos sugiere que conectemos al modelo. Le indicamos que use las APIs tipo openai la URI del servidor, sin api-key, etc…
/connect openai --url http://localhost:1234/v1 --api-key lm-studio
Y aprovechamos también para decirlo que use el modelo
model gemma-4-26b-a4b-it
Le he pedido que me lo grabe en la configuración global de opencode, para que no tenga que hacerlo para cada proyecto. Ahora debo reiniciar opencode para que se apliquen los cambios.
4. Indicar a OpenSpec que vamos a usar OpenCode
Antes de arrancar opencode vamos a indicarle que queremos usar openspec con opencode.
openspec init
Ahora debemos seleccionar la herramienta (opencode) que vamos a usar para hacer SDD.
Con eso nuestro proyecto ya ha quedado preparado para hacer SDD con OpenCode y OpenSpec usando el modelo local Gemma4.
Vamos a ver qué tal funciona este modelo local, y para ello vamos a compararlo con el que hicimos con ClaudeCode.
5. Mismo ejemplo de la tabla periódica
Vamos a usar la misma propuesta para poder comparar una y otra
El resultado de la propuesta ha tardado 4m 16″. Más o menos lo mismo que con Claude.
Vamos a aplicar la propuesta y a ver el resultado.
Ha tardado 5n 40″. Seguimos estando en el mismo orden de magnitud. Vamos a ver si el código generado funciona similar a la prueba que hicimos con ClaudeCode.
Bien, el resultado es bastante agradable. Veo cosas que no me han gustado, como que los lantánidos están separados de los actínidos, y por otro cosas que sí que me han gustado, como que los detalles de un elemento salgan en una ventana modal.
Sin embargo, hay algo que creo que es peor, y es que lo ha hecho todo en un único fichero HTML. El JavaScript, los estillos CSS y los datos de los elementos todo junto en el mismo fichero. Me doy cuenta que es culpa mía, porque no se lo he indicado en la propuesta. Y todo lo que no indiquemos los LLMs se lo inventan.
6. Propuesta: separar en ficheros
Vamos a hacer la nueva propuesta.
/opsx-propose Quiero que separes el javascript en un fichero llamado app.js, que los elementos estén en un fichero llamado elements.js, que los estilos css estén en un fichero llamado styles.css y que el html en eel index.html. Por otro lado quiero que los lantánidos y actínidos estén separados de la tabla periódica, pero no entre sí. Ellos deben ser dos filas.
Es esta propuesta ha tardado 1m 32″
Y en su aplicación 2m 18s
Vamos a ver el aspecto de la web
La verdad es que lo ha hecho muy rápido y es vistosa.
7. Propuesta: añadir modo oscuro
Bien, para que la prueba sea igual que la de ClaudeCode vamos a añadir el modo oscuro
/opsx-propose quiero añadir un botón arriba que alterne entre modo oscuro y modo claro
Le ha llevado 1m 11s hacerme la propuesta.
Vamos a aplicarla.
Y ha tardado 1m 12s.
He visto el resultado y no me gusta porque el fondo está en oscuro, pero los colores siguen siendo pastel. Vuelve a ser culpa mía por no habérselo pedido explícitamente. Voy a iterar hasta que me salga como yo quiero
/opsx-propose quiero que en el modo oscuro los colores de los elementos sea mucho más saturados y que contraten con el color blanco del texto que aparece para cada elemento. La ventana modal quiero que tenga con fondo oscuro y texto blanco.
El resultado han sido 38,2s. Vamos a ver si nos gusta cómo queda.
8. Conclusiones
Estamos ante herramientas súmamente potentes, pero no por eso debemos olvidar nuestro trabajo.
- Piensa bien lo que quieres antes de escribir.
- Piensa lo que NO quieres y escríbelo.
- ¿Puede haber alguna malinterpretación?
- Añade ejemplos.
- Sé concreto
A mí, me ha sorprendido mucho la calidad de un modelo local como Gemma4. Es decir, estamos en condiciones de poder hacer SDD con un modelo gratuito que corre en cuentro ordenador. Debo reconocer que estoy impresionado.
9. Enlaces y referencias
- El código fuente de este tutorial en GitHub
https://github.com/eContento/lab/tree/main/tablaperiodica-openspec-opencode-gemma4 - Esta tabla periódica funcionando
- OpenCode
- LM Studio
- Gemma 4
2 respuestas
Excelente artículo. Aún no he podido probar OpenSpec, pero con tu artículo ya me has metido el gusanillo dentro.
No me esperaba ver tan pronto artículos hablando de IA Local. Ha sido una grata sorpresa. Realmente creo que el mix de modelos online SOTA, con ligeros en tu propia máquina, es lo mejor actualmente y puede que para siempre. Así puedes aprovechar la potencia de los mejores modelos para orquestar, investigar, o planificar, y a la vez reducir mucho los costes con modelos IA locales. Debería ser política de empresa.
En este sentido, el mejor proyecto que he encontrado se llama oh-My-Openagent. Lo uso con OpenCode, pero también se puede integrar con Claude y otros. Este proyecto define varios agentes orquestados de manera que cada uno se encarga de tareas más o menos complejas, permitiendo asignar a cada uno un modelo y proveedor diferente, con diferentes configuraciones. Funciona excelentemente.
https://github.com/code-yeongyu/oh-my-openagent
PD: En mi experiencia Gemma-4-12b-it-qat tiene la misma calidad que gemma-4-26b-a4b-it, incluso funciona mejor con Hermes Agent, aunque más lento al ser Dense. En macOS suelo usar siempre variantes MXL y no GGUF: por lo general dan mejor rendimiento. Y siempre modelos MoE en Mac, y Dense para GPU.
Sí, he visto que Google acaba de sacar Gemma co QAT donde la cuantización se hace antes y, por tanto, no tiene la pérdida posterior. La verdad, no te voy a engañar, hasta hace dos semanas no sabía nada de GGUF ni demás historias.
En cuanto a OpenSpec le he hecho varias pruebas interesantes tras varias iteraciones. He borrado en ambos proyectos el código generado, quedándome solo con las specs y he iniciado sesión para que no tuviera nada de contexto.
he pedido en ambos que revise las specs y regenere el código
Con Gemma 4 (modelo gratuito local)
revisar specs y preparar propuesta: 3′ 35″
aplicar propuesta: 3′ 07″
Con Claude – Sonnet 4.6
revisar specs y preparar propuesta: 3′ 37″
aplicar propuesta: 11′ 16″
2. he copiado las specs generadas con un modelo en la carpeta del otro y le he pedido que regenere el código
– en ambas direcciones ha ido bien. Luego los modelos son intercambiables
Me está gustando bastante OpenSpec.