Caso de estudio · Escritorio nativo · Tauri 2 · Solo + IA

EngiBoard.

Un SaaS de escritorio para ingenieros. Lanzado en 4 semanas. Captura, anota, haz seguimiento — en un solo binario.

Cero contrataciones. Público en GitHub.

ProductoUX / UITauri 2 · RustNext.js · Supabase
Tablero principal de EngiBoard en el tema oscuro
Editor de anotaciones con flecha, rectángulo y texto sobre el plano de un álabe de ventilador
Lista principal de tareas de EngiBoard con capturas de antes/después por tarea
44
versionesetiquetadas, todas públicas
Cmd + Shift + GCaptura
6días, 7 horas
44versiones etiquetadas
98commits
4instaladores, Mac + Windows
18pantallas, un binario
0contrataciones
Resumen en 20 segundosDesarrollo del estudio · usado por 2 equipos de clientes
Qué
Un tracker de escritorio nativo para los informes fotográficos de antes/después de los ingenieros, en Mac y Windows.
Por qué
Los informes de obra pasaban por cuatro apps pegadas con cinta (carrete → Telegram → Word), y cada traspaso perdía contexto.
Mi rol
Producto, UX/UI e ingeniería, en solitario con IA: Tauri 2, Next.js, Supabase.
Resultado
44 versiones etiquetadas · 4 instaladores · 0 contrataciones
Explora el caso ↓
Resumen

Un tracker nativo para ingenieros que elaboran informes fotográficos de antes/después en obras y plantas de producción.

Tauri 2Shell nativamacOS · WindowsInstaladoresv0.1.44En vivo
ProyectoEngiBoard Desktop
StackTauri 2 · Next.js · Supabase
Cronología28 abr → 4 may · 4 semanas, 7 h
Estadov0.1.44 · en producción
Lee la historia completa

Tauri 2 + Next.js + Supabase. Instaladores para macOS y Windows. 44 versiones etiquetadas. 98 commits. Cero contrataciones. Público en GitHub.

Un tracker de escritorio nativo para ingenieros que elaboran informes fotográficos de antes/después en obras y plantas de producción. Construido primero para el propio fundador, y después para dos clientes reales solo con Windows, en QA de producción.

Todas las pantallas

18 pantallas. Un binario.

Login → proyectos → captura → anotación → seguimiento → revisión → exportación. Sin páginas de configuración, sin «avanzado».

18
pantallasclaro + oscuro, Mac + Windows
Las 18 pantallas

Cada pantalla está diseñada para una sola cosa que el ingeniero está haciendo en ese momento. Sin configuración, sin páginas de ajustes, sin «avanzado».

  • 01 · Login
  • 02 · Tablero principal
  • 03 · Selector de proyecto
  • 04 · Dashboard
  • 05 · Presentación + pines
  • 06 · Editor de anotaciones
  • 07 · Comparación deslizante
  • 08 · Modo oscuro
  • 09 · Dashboard oscuro
  • 10 · Selector oscuro
  • 11 · Login oscuro
  • 12 · Modal de fuera de alcance
  • 13 · Estado vacío
  • 14 · Perfil
  • 15 · Overlay Sniper
  • 16 · Modo pegar
  • 17 · Menú de estados
  • 18 · Selección múltiple
Problema & solución

Carrete → Telegram → Word. Listo.

Cada visita a obra perdía contexto: fotos extraviadas en chats, anotaciones lejos de la lista de tareas.

Carrete›Telegram›Hoja de cálculo›Word›PDF→EngiBoard
01 · Tarea

Captura, marca, adjunta.

Velocidad de captura nativa, tareas al estilo Linear.

02 · Problema

Cuatro apps pegadas con cinta.

Cada traspaso pierde contexto.

03 · Solución

Un binario.

Fija un comentario a un píxel, no a una marca de tiempo.

Lee la historia completa

La cadena de herramientas habitual en cada visita a obra era lenta y perdía información. Las fotos desaparecían en los chats, las anotaciones vivían en una app distinta a la de la lista de tareas y los informes perdían contexto en cuanto se reenviaban.

  • 01 · Tarea — un escritorio con un solo propósito. Captura, marca, adjunta. Velocidad de captura nativa, estructura de tareas al estilo Linear, conversaciones ancladas a la imagen. Los ingenieros se quedan en una sola app, en lugar de pegar cuatro.
  • 02 · Problema — cuatro apps pegadas con capturas y rezos. Carrete → Telegram → hoja de cálculo → Word → PDF. Cada traspaso pierde contexto. Las herramientas de anotación viven en otro sitio, lejos de la lista de tareas.
  • 03 · Solución — un binario. Captura, anota, haz seguimiento. Un overlay nativo de Tauri captura cualquier región. Editor con seis herramientas. Tareas agrupadas por proyecto, ocho estados con código de color. Fija un comentario a un píxel, no a una marca de tiempo.
Tablero principal de EngiBoard: tareas agrupadas por semana con capturas de antes/después y chat en línea
«La primera herramienta que cubre el ciclo real que hago en obra, en lugar de tres herramientas a medias que tengo que pegar entre sí».
Alex Stepikin · fundador, diseñador, ingeniero
Flujo de captura

Región. Anotar. Adjuntar.

Cmd+Shift+G desde cualquier sitio lanza un overlay transparente. Arrastra, anota y guarda en el hueco de antes/después.

01

Captura

Captura de región nativa en macOS / Windows.

Overlay Sniper: arrastra una región sobre cualquier ventana
02

Anotar

Seis herramientas, siempre en primer plano.

Editor de anotaciones con seis herramientas
03

Adjuntar

De vuelta a la tarea, antes o después.

Modo pegar: elige el hueco de antes o de después
FlechaRect.LápizTextoDifuminarResaltar
Lee la historia completa

Cmd+Shift+G desde cualquier sitio lanza un overlay transparente a pantalla completa. Arrastra un rectángulo. Captura nativa en macOS / Windows. El editor se abre con el PNG listo y seis herramientas activas: flecha, rectángulo, lápiz, texto, difuminar y resaltar. Al guardar, la imagen anotada vuelve al hueco de antes/después que elegiste.

El tablero

Donde vive el trabajo.

Tareas agrupadas por proyecto y escritas en línea: sin modal, sin doble clic, sin rodeos.

Tablero con tareas seleccionadas en bloque y una barra de acciones flotante
8
estadoscon código de color
  1. 01
    Entrada de tareas en líneaPor grupo, sin rodeos.
  2. 02
    Varias capturasVarias imágenes por tarea.
  3. 03
    Renombrar, reordenarSin salir del tablero.
Lee la historia completa

La barra lateral agrupa las tareas por proyecto. Entrada de tareas en línea por grupo: sin modal, sin doble clic, sin rodeos. Ocho estados con código de color. Varias capturas por tarea. Renombra y reordena sin salir del tablero.

Revisión anclada a la imagen

Fija al píxel, no a la marca de tiempo.

Las revisiones viven en la imagen. Haz clic en un píxel, deja un pin, escribe: en hilos, con varios revisores.

Lightbox · pines
Presentación en lightbox con pines de comentarios sobre la imagen de un álabe de ventilador

Los pines parpadean en naranja mientras no se leenLuego se vuelven azules con un número.

Comparación deslizante
Comparación deslizante: antes y después apilados con un único control para arrastrar

Arrastra la líneaMira la diferencia, sin alternar.

Lee la historia completa

Las revisiones viven en la imagen, no en un hilo aparte. Abre una captura en el lightbox, haz clic en cualquier píxel, deja un pin naranja y escribe un comentario. Varios revisores, en hilos. Control deslizante de comparación para antes/después: arrastra para revelar.

Lightbox · pines — haz clic en un píxel y escribe un comentario. Los pines parpadean en naranja mientras no se leen y se vuelven azules con un número una vez vistos. El panel derecho lista cada comentario con autor, hora y opción de borrar. Varios revisores, con hilos completos.

Comparación deslizante — arrastra la línea y mira la diferencia. Dos capturas apiladas, un único control para arrastrar. Sin parpadeos, sin alternar, sin «cambiar de pestaña»: pura memoria muscular. Funciona en cualquier tarea que tenga adjuntos el antes y el después.

Seguimiento

Ocho estados. Dos vistas.

Cada color sobrevivió a diez rechazos: ninguno es decoración.

HechoProblemaEn cursoRevisiónInfo requeridaPróximoNo relevanteInfo
Dashboard: recuento de proyectos y distribución por estado
Menú de estados abierto sobre una tarea
1
clicpara mover una tarea o varias
Lee la historia completa

Hecho, Problema, En curso, Revisión, Info requerida, Próximo, No relevante, Info: ocho estados, y cada uno se ganó su color. El dashboard resume los totales de todos los proyectos; el menú de estados permite cambiar una o varias tareas con un solo clic.

Dashboard — un resumen, no pasar lista. Recuento de proyectos, distribución por estado, principales bloqueos. Una sola pantalla responde: ¿dónde se atasca el equipo? Sin profundizar antes de haber visto todo el panorama.

Menú de estados — un clic para mover cualquier cosa. Clic derecho en cualquier tarea y cambia su estado. Selecciona filas en bloque y cámbialas todas a la vez. Ocho colores que sobrevivieron a diez rechazos: cada uno tiene un significado, ninguno es decoración.

Claro — obra a pleno solOscuro — oficina, tarde-noche, OBS
Tablero principal en el tema claro
Tablero principal en el tema oscuro
Multiplataforma

La misma UX, en cualquier plataforma.

Mac serie MMac IntelWindows EXEWindows MSI
Lee la historia completa

Mac serie M, Mac Intel, Windows EXE, Windows MSI. Frontend compartido en HTML/CSS/JS, shell nativa de Tauri 2. El modo oscuro se activa por pantalla, no por app. Las quejas de los testers vuelven a la siguiente versión etiquetada.

Tema claro — obra a pleno sol. Superficie por defecto. Mayor contraste sobre las fotos y más cómodo con la luz del mundo real. La vista previa de impresión coincide con lo que ves.

Tema oscuro — oficina, tarde-noche, overlay de OBS. Pensado para triajes nocturnos y recorridos grabados en pantalla. El mismo contenido, un lienzo más profundo, y los colores de estado conservan su significado en ambos temas.

Lenguaje de diseño

Geist para el producto. Mono para el sistema. Cielo, ámbar, negro profundo.

Tipografía
Aa
{ }

Geist 400–700 para la UI; Geist Mono para marcas de tiempo, versiones y atajos de teclado.

Paleta
Cielo#0EA5E9
Cielo claro#7DD3FC
Ámbar#FFC940
Negro#0A0A0C
Regla

El ámbar vive en un solo estado, «en curso», porque se lo ganó.

UI kit
UI kit de EngiBoard: paleta de color, tipografía, etiquetas de estado
Tipografía y paleta al detalle

Tipografía. Geist Sans en toda la app: una sans moderna y limpia, afinada para superficies de producto de alta densidad. Geist Mono para las partes en las que el sistema responde: marcas de tiempo, tamaños de archivo, etiquetas de versión, sugerencias de atajos.

  • Geist · 400 / 500 / 600 / 700 — UI principal. Tracking ajustado, esqueleto neutro. Del texto pequeño (10 px) al display (96 px).
  • Geist Mono · 400 / 500 — marcas de tiempo, etiquetas de versión, rutas de archivo, sugerencias de línea de comandos. Allí donde el sistema es preciso.
  • Instrument Serif · cursiva — acento editorial, solo en el caso de estudio: frases destacadas, citas, momentos lentos. No está en la app.

Paleta. El azul cielo lleva la marca y los estados activos. El ámbar vive en un único estado, «en curso», porque se lo ganó. El negro profundo asienta el lienzo; todo lo demás es blanco de sistema sobre ruido.

  • Engineer Sky #0EA5E9 — marca, estados activos, acciones principales, enlaces.
  • Sky Light #7DD3FC — hover, resplandor de foco, ligero realce en los degradados del hero.
  • In-Progress Amber #FFC940 — una única etiqueta de estado ganada. Se usa con moderación, nunca como decoración.
  • Studio Black #0A0A0C — el lienzo. Se apagan las luces. Cada captura empieza aquí.
Proceso

Siete días, treinta y ocho tags.

Cada tag compila binarios reales en CI. Un tester se queja por la mañana y recibe el arreglo después de comer.

Día 1 · 28 abrBase de Tauriv0.1.1 → v0.1.9
Día 2 · 29 abrOverlay Sniperv0.1.10
Día 3 · 30 abrEditor de anotacionesv0.1.11 → v0.1.12
Días 4–5Dogfooding del fundadorprueba de campo
Día 6 · 3 mayDía de sprintv0.1.13 → v0.1.24
Día 7 · 4 maySprint finalv0.1.25 → v0.1.44
PúblicoEn vivo44 versiones
Día a día

Cadencia por horas: cada tag dispara un pipeline de CI que genera binarios reales listos para distribuir: Mac serie M, Mac Intel, Windows EXE, Windows MSI. Un tester se queja por la mañana y recibe el arreglo después de comer.

  • Día 1 · 28 abr — Base de Tauri. Esqueleto y pipeline de GitHub Actions. El screencapture nativo cambia de rumbo antes del mediodía. v0.1.1 → v0.1.9.
  • Día 2 · 29 abr — Overlay Sniper. Pantalla completa transparente propia, captura por región arrastrando. Calidad nativa, control nuestro. v0.1.10.
  • Día 3 · 30 abr — Editor de anotaciones. Seis herramientas: flecha, rectángulo, lápiz, texto, difuminar, resaltar. Siempre en primer plano, sin robar el foco. v0.1.11 → v0.1.12.
  • Días 4–5 · 1–2 may — Dogfooding del fundador. Dos días de recorridos reales por obra. Quejas concretas, no vagas. Prueba de campo.
  • Día 6 · 3 may — Día de sprint. Doce versiones en 24 h. Tareas en línea, varias capturas, exportación a PDF, modo oscuro, RU/EN, pines en el lightbox. v0.1.13 → v0.1.24.
  • Día 7 · 4 may — Sprint final. Catorce versiones. Selector de proyecto, chat en línea, comparación deslizante, reintento de OAuth, clientes de Windows activados. v0.1.25 → v0.1.44.
  • Público — en vivo. Mac DMG · Mac Intel · Win EXE · Win MSI. Todo público en GitHub Releases. 44 versiones.
Construcción

Cómo se hizo.

De un repositorio vacío a v0.1.44 en producción. Fundador en solitario + compañeros de IA.

6 d 7 hdel repo a producción
8herramientas en el stack
  1. T
    Tauri 2 / RustShell nativa, deep-link, plugins
  2. N
    Next.js · ReactEspejo web, landing de OAuth
  3. S
    SupabaseAuth, Google OAuth, BD
  4. ★
    Claude CodeConstructor principal con IA
  5. G
    GitHub Actions · RailwayCI para 4 plataformas, despliegue web automático
Cronología y stack completo

Seis días y siete horas desde un repositorio vacío hasta v0.1.44 en producción. Fundador en solitario + compañeros de IA. Cada versión, pública en GitHub.

  • Día 1 — Base de Tauri + CI · 28 abr
  • Día 2 — Overlay Sniper · 29 abr
  • Día 3 — Editor de anotaciones · 30 abr
  • Días 4–5 — Dogfooding del fundador · 1–2 may
  • Día 6 — Sprint (12 versiones) · 3 may
  • Día 7 — Sprint final (14 versiones) · 4 may
  • Tauri 2 / Rust — shell nativa, deep-link, plugins
  • Next.js · React — espejo web, landing de OAuth
  • Supabase — auth, Google OAuth, BD
  • Claude Code — constructor principal con IA
  • GitHub Actions — CI para 4 plataformas, en cada tag
  • Railway — despliegue web automático en cada push
  • Figma — solo bocetos de arquitectura
  • Geist · Mono — sistema tipográfico

De un repositorio vacío a v0.1.44 — en 4 semanas.

Uno de los siete proyectos lanzados por Stepikin Studio en 2025–26, construido para poner a prueba al límite la tesis del estudio. La tesis se sostuvo.

Crea con audacia.
Entrega mejor.

Ver nuestro trabajoContacto