Shirley De la Cruz

PortafolioMILELAB.

Diseño y desarrollo productos digitales, herramientas de IA y experiencias visuales para resolver necesidades concretas.

Explorar el archivo

Diseño · Desarrollo · IA · Experiencias

Proyectos destacados

Ideas en la práctica.

Productos con demos públicas, aplicaciones privadas y experimentos en desarrollo. Abre una carpeta para explorar el proyecto.

Ir directamente a un proyecto

7 proyectos · Desliza para explorar

Tobías

Ver fichaCerrar ficha

Una forma cercana de explorar la IA en el día a día: conversar, recoger ideas y preparar pequeñas acciones con revisión antes de guardarlas.

El punto de partida

Una necesidad concreta.

Acercar la inteligencia artificial a las rutinas cotidianas, con una identidad reconocible y herramientas para pasar de una conversación a una nota, un recordatorio o un registro útil.

Mi aportación

Del diseño al uso.

Configuración de la identidad del asistente e integración de OpenClaw y Telegram, junto a una interfaz de voz local y módulos propios para notas, recordatorios, diario y presupuesto.

Qué permite hacer

  • Conversación por texto en Telegram y por voz en una interfaz privada.
  • Preparación de notas y entradas de diario para revisar y guardar en Obsidian.
  • Recordatorios con fecha, repeticiones y avisos al móvil mediante ntfy.
  • Registro de gastos por voz, texto y foto de ticket, con revisión antes de guardar.
  • Modo invitado de podcast, con intervención por turnos y exportación de pistas.

Funciones e integraciones

  • OpenClaw
  • Telegram
  • Ollama
  • Whisper.cpp
  • Kokoro
  • Obsidian
  • ntfy

Proyecto de uso privado. Telegram y la interfaz de voz mantienen contextos y herramientas separados. El equipo local debe estar encendido para usar la voz y los avisos. El presupuesto no se conecta al banco.

Documento el proyecto; su acceso es privado.

Perfil de Tobías en Telegram, presentado como el asistente de Mile
Perfil de Tobías en Telegram, con su identidad visual como asistente de Mile. Captura compartida por Shirley. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de Tobías. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

AlignCue Restaurant

Ver fichaCerrar ficha

De la carta a la coordinación del servicio. Una misma experiencia para clientes, sala, cocina y barra.

Producto propio · Vídeo de MileLab

De la carta al servicio.

Un recorrido por AlignCue: la carta, Marco, Operaciones, Control y el módulo adicional de Administración. Una muestra de mi trabajo en producto, diseño de interfaces y creación de vídeo explicativo.

3 min 39 s · Audio y subtítulos en español. Recorrido por demostraciones del producto con restaurantes y pedidos ficticios.

Leer la transcripción

El punto de partida

Una necesidad concreta.

Conectar la información de la carta con lo que ocurre durante el servicio, sin obligar al equipo a saltar entre herramientas desconectadas.

Mi aportación

Del diseño al uso.

Diseño de producto, interfaces y desarrollo de los recorridos de carta, pedidos, operaciones y control. La identidad de cada restaurante se mantiene en la experiencia del comensal.

Qué permite hacer

  • Carta multiidioma con filtros, alérgenos, variantes y extras.
  • Pedidos y estados compartidos entre sala, cocina, barra y caja.
  • Edición, revisión y publicación de la carta desde Control.
  • Marco orienta mediante recorridos guiados a partir de la información de la carta.

Funciones e integraciones

  • Carta + operaciones
  • Control de contenido
  • Identidad por restaurante

Producto en beta. Las demos utilizan restaurantes y pedidos ficticios; no llegan a una cocina real. Administración es una ampliación del producto.

Operaciones de AlignCue con mesas y pedidos de demostración
Captura de la demo de operaciones con datos de ejemplo. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de AlignCue Restaurant. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

MileLab Smart Contact

Ver fichaCerrar ficha

Una presentación con tu identidad y un siguiente paso claro: descubrir tus servicios, guardar el contacto y preparar una consulta.

Producto propio · Vídeo de MileLab

De un encuentro a una conversación.

En poco más de un minuto: descubrir los servicios, guardar el contacto y preparar una consulta. Un recorrido por la tarjeta de MileLab y una muestra de cómo se adapta a otra marca.

1 min 03 s · Audio y subtítulos en español. MileLab es el ejemplo propio; UMBRAL es una demostración inmobiliaria ficticia.

Leer la transcripción

Ver la versión vertical

El punto de partida

Una necesidad concreta.

Hacer que un primer contacto sirva para comprender una propuesta, guardar los datos y continuar una conversación con contexto.

Mi aportación

Del diseño al uso.

Diseño de la experiencia móvil, identidad visual y organización de servicios; desarrollo de una base configurable por perfil y tres ediciones. También preparé el guion, la animación y las adaptaciones del vídeo explicativo.

  1. Descubrir los servicios
  2. Guardar el contacto
  3. Elegir una necesidad
  4. Revisar la consulta

Qué permite hacer

  • Presentación y servicios adaptados a la identidad de cada negocio.
  • Conecta reúne lo esencial; Showcase cuenta una historia con imágenes; Signature incorpora vídeo de marca.
  • Contacto descargable en formato vCard y tarjeta compartida mediante enlace, QR o un tag NFC.
  • Selección de una necesidad y mensaje editable antes de continuar en WhatsApp.

Funciones e integraciones

  • WhatsApp
  • vCard
  • Compartir enlace
  • QR
  • Acceso por NFC

MileLab es la muestra con contacto real. UMBRAL es una marca ficticia con medios generados para demostrar la personalización. El acceso NFC utiliza el mismo enlace.

Tarjeta Signature de MileLab con presentación, servicios y acciones de contacto
Consulta preparada en la tarjeta de MileLab, con un texto de ejemplo añadido. La persona revisa el mensaje antes de continuar; esta captura no representa un envío. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de MileLab Smart Contact. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

Tobias Study

Ver fichaCerrar ficha

Leer, escuchar y estudiar en un mismo espacio, con planes, notas y un tutor local que trabaja con las fuentes.

El punto de partida

Una necesidad concreta.

Dar continuidad al estudio: reunir materiales, recuperar el punto de lectura y conectar la práctica con lo que se está aprendiendo.

Mi aportación

Del diseño al uso.

Diseño de la experiencia y desarrollo de la aplicación, del lector y del sistema de planes. Integración de modelos locales, transcripción y herramientas de audio.

Qué permite hacer

  • Importación de PDF, EPUB, TXT y texto pegado.
  • Posición de lectura guardada, notas y vocabulario contextual.
  • Planes de idiomas, materias y lectura; repaso y seguimiento.
  • Tutor con fuentes y propuestas que requieren confirmación.
  • Práctica oral con transcripción y paquetes explícitos de texto sin conexión.

Funciones e integraciones

  • Ollama
  • whisper.cpp
  • StudyReader
  • Audiobookshelf opcional
  • SQLite
  • PWA

Aplicación privada en desarrollo. La transcripción no evalúa la pronunciación fonética. El audio opcional mediante Microsoft Speech/Edge requiere autorización para enviar texto; no todo el sistema funciona sin conexión.

Documento el proyecto; su acceso es privado.

Tobias Study: lector y herramientas de estudio con una lectura de muestra
Interfaz de la aplicación con una lectura creada para esta demostración; sin biblioteca personal. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de Tobias Study. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

Email · Atención y seguimiento

Ver fichaCerrar ficha

Reunir conversaciones, preparar propuestas con tarifas revisadas y recordar lo que queda pendiente, con aprobación humana antes de enviar.

El punto de partida

Una necesidad concreta.

Atender consultas sin perder el contexto del cliente, repetir búsquedas de precios o dejar seguimientos en el olvido.

Mi aportación

Del diseño al uso.

Diseño y desarrollo de una aplicación local que conecta buzones, clientes, documentos, tarifas, pedidos y reservas. Integración de Gmail y de IA local para apoyar la preparación de respuestas.

Qué permite hacer

  • Conversaciones y fichas de clientes entre varios buzones.
  • Borradores de propuestas basados en catálogos aprobados y fuentes consultables.
  • Reglas para prioridades y seguimientos que preparan mensajes revisables.
  • Pedidos y reservas vinculados al contexto de cada conversación.
  • Demostración con clientes ficticios y envíos simulados.

Funciones e integraciones

  • Gmail API
  • Ollama
  • FastAPI
  • React
  • SQLite

Piloto privado. La aprobación y el envío son decisiones humanas. La demo usa datos ficticios; la conexión de cada buzón requiere su propia validación. No es una herramienta de campañas masivas ni de facturación.

Documento el proyecto; su acceso es privado.

Gestor de correo con conversaciones y clientes ficticios en una demostración aislada
Captura real de una propuesta preparada para revisión, con clientes, conversaciones y tarifas ficticios. No se conecta a buzones reales ni se ha enviado el mensaje. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de Email · Atención y seguimiento. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

Instagram · Flujo editorial

Ver fichaCerrar ficha

Preparar carruseles y sus textos desde un flujo editorial que conserva las fuentes, organiza versiones y requiere revisar el resultado antes de compartirlo.

El punto de partida

Una necesidad concreta.

Dar continuidad a la creación de contenido para Instagram sin separar las imágenes, el texto, las fuentes y la versión que se ha revisado.

Mi aportación

Del diseño al uso.

Diseño y desarrollo de la mesa editorial, la generación de carruseles y el paquete de exportación. Organización del texto, categorías, atribuciones y descripciones de accesibilidad en una misma revisión.

  1. Preparar el material
  2. Generar el carrusel
  3. Revisar la versión
  4. Exportar para publicar

Qué permite hacer

  • Preparación de carruseles con imágenes numeradas y texto para Instagram.
  • Categorías editables, atribuciones y descripciones de accesibilidad.
  • Vista previa, comprobaciones editoriales y versiones conservadas.
  • Exportación del paquete aprobado para publicación manual.
  • Separación entre comprobaciones automáticas y aprobación humana.

Funciones e integraciones

  • Python
  • Ollama
  • SQLite
  • JPEG
  • ZIP

El flujo actual produce carruseles; la publicación en Instagram es manual. La conexión para publicar automáticamente sigue sin activarse. Las comprobaciones ayudan a revisar el contenido, pero no certifican su veracidad.

Documento el proyecto; su acceso es privado.

Ilustración conceptual de un archivo editorial con periódicos y acentos violetas
Ilustración conceptual generada con IA para representar el trabajo editorial; no es una captura de Instagram. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de Instagram · Flujo editorial. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

MILE · Exposición múltiple

Ver fichaCerrar ficha

Un pequeño estudio fotográfico en el móvil: superponer imágenes, ajustar cada capa y encontrar una nueva mirada. También puede reunir las dos caras de un documento en una composición.

El punto de partida

Una necesidad concreta.

Llevar la experimentación fotográfica al lugar donde nace una idea, con controles táctiles y procesamiento en el propio dispositivo.

Mi aportación

Del diseño al uso.

Diseño y desarrollo de una aplicación web móvil con mesa de luz, gestos, mezcla por capas, ajustes de imagen y exportación.

Uso descubierto en la práctica

Las dos caras de un documento en una sola página.

Al usar la app encontré una aplicación administrativa: reunir el anverso y el reverso de una tarjeta o documento, como una tarjeta de identidad, para poder ver ambas caras juntas.

Cómo lo hago

  1. Añadir una foto o un escaneo de cada cara desde la galería, o fotografiarlas con la cámara.
  2. Ajustar el tamaño, el giro y la posición de las imágenes para que ambas caras queden separadas y legibles dentro de la composición.
  3. Revisar el encuadre y la legibilidad, y exportar el resultado en JPG.

Qué aporta

Así puedo preparar una sola imagen con las dos caras y colocarla en una página para adjuntarla a un documento o imprimirla. Es un ejemplo de cómo una herramienta creativa puede resolver una tarea cotidiana de oficina.

La salida de MILE es una imagen JPG. Si necesito una hoja A4 o un PDF, preparo ese formato después en un editor de documentos.

Documento de muestra

AnversoDatos de ejemplo
ReversoInformación de ejemplo
Ejemplo ficticio de disposición; no es una captura de la app ni contiene datos personales.

Qué permite hacer

  • Composición de dos a seis fotos con modos de mezcla e intensidad.
  • Movimiento, escala y giro con gestos o controles por imagen.
  • Ajustes de exposición, contraste, sombras, luces, saturación y temperatura.
  • Cámara con guía de superposición y acceso a la galería.
  • Exportación JPG y recursos sin conexión tras completar la descarga.

Funciones e integraciones

  • Canvas
  • Cámara y galería
  • Service worker
  • @milecyber/ui

Aplicación web móvil de acceso privado. Los originales se conservan; las composiciones no se guardan entre sesiones. Los controles de cámara dependen del dispositivo.

Documento el proyecto; su acceso es privado.

MILE mostrando una composición de dos exposiciones en el móvil
Captura de la aplicación con el ejemplo ilustrado incluido. Puedes abrir la imagen para verla en detalle.
Hablemos de una idea similar

Puedo ayudarte a desarrollar una idea a partir de MILE · Exposición múltiple. Cuéntame qué te gustaría resolver.

Se abrirá un mensaje con el proyecto como referencia. Puedes editarlo antes de enviarlo.

Volver al archivo

Conoce más de mi trabajo

Tavi, la mascota de MileLab

7 líneas de exploración

Cuaderno de laboratorio.

Ideas, pruebas y descubrimientos. Un diario de lo que voy creando.

Abrir cuadernoCerrar cuaderno

Entrada 01Generación y transformación

Taller de imágenes local

De una descripción a una imagen, o de una referencia a una nueva versión: un taller para experimentar con ilustración, personajes y pixel art.

Flor rosa generada en el taller local con SDXL

Notas del proceso

Diseño de una interfaz guiada e integración de seis flujos sobre ComfyUI y SDXL. El trabajo se centra en hacer accesibles los controles, organizar las salidas y adaptar el uso al móvil y al escritorio.

Funciones, integraciones y muestras

Qué estoy explorando

  • Generación desde texto y reinterpretación de imágenes con IA.
  • Flujos para objetos, personajes, escenarios, scrapbooking e imagen libre.
  • Conversión a pixel art con tamaño, paleta y tramado configurables; ampliación exacta sin suavizado.
  • Semilla, pasos y fuerza de la descripción para comparar variantes.
  • Descarga de resultados y acceso al editor completo de ComfyUI.

Herramientas e integraciones

  • ComfyUI
  • SDXL
  • Flujos propios
  • PNG
  • Interfaz adaptable

Herramienta de uso privado, con generación en el equipo. Integra motores y modelos existentes. La transparencia se conserva en el conversor cuando ya existe en la entrada; no se elimina el fondo automáticamente.

Controles del taller de imágenes en móvil
Captura real del flujo de imagen libre. La flor de esta ficha es uno de los resultados del taller.

Entrada 02Planos cortos con IA

Taller de vídeo local

Crear una escena desde texto o dar movimiento a una imagen, comparando ajustes y conservando cada toma con su receta.

Fotograma del ensayo local de un zorro en un prado

Notas del proceso

Desarrollo de un panel propio y una cola de generación local sobre stable-diffusion.cpp. Integra modelos de vídeo, gestión de recursos, seguimiento de progreso y preparación de archivos para reproducir y editar.

Funciones, integraciones y muestras

Qué estoy explorando

  • Texto a vídeo e imagen a vídeo con perfiles de partida.
  • Comparación entre Wan y FastWan, con controles de semilla, formato, pasos y fotogramas.
  • Progreso y cancelación de la toma activa.
  • Cuaderno de tomas para recuperar los ajustes y revisar resultados.
  • Exportación MP4, vista previa WebM y conservación de los fotogramas originales.

Herramientas e integraciones

  • Wan 2.2
  • FastWan 2.2
  • stable-diffusion.cpp
  • Vulkan
  • FFmpeg

Los ensayos comprobados son planos cortos de unos dos segundos, sin sonido. La continuidad y la fidelidad a la imagen se revisan en cada toma; no se presenta como producción de películas largas ni como un servicio de generación en línea.

Ensayo real generado localmente con FastWan: zorro en el prado, 832 × 480, 49 fotogramas y unos dos segundos. Sin audio.

Entrada 03Expresión, audio y sincronización

Avatares y narración

Exploraciones con presentadores digitales: expresiones, parpadeo y movimiento de boca para acompañar explicaciones y contenidos.

Avatar ilustrado de Mile utilizado en las pruebas de narración

Notas del proceso

Integración de tres presentadores PNGTuber: Tavi, la mascota de MileLab, una versión ilustrada de Mile y su avatar realista. Desarrollo de un reproductor de comparación para estudiar la respuesta al volumen y la sincronización guiada por sonidos.

Funciones, integraciones y muestras

Qué estoy explorando

  • Selección de personajes y seis estados de expresión por paquete.
  • Habla y parpadeo a partir del análisis de audio local con Web Audio.
  • Comparación con pistas de Rhubarb Lip Sync y un reloj compartido de reproducción.
  • Pruebas de posiciones de boca, pausa, búsqueda temporal y alternativa estática.
  • Guías narradas con subtítulos y ambiente sonoro sincronizado.

Herramientas e integraciones

  • PNGTuber
  • Web Audio
  • Rhubarb Lip Sync
  • FFmpeg
  • Subtítulos

Son prototipos en evaluación. Las nuevas bocas requieren revisión de naturalidad y sincronización; la muestra inicial alterna los originales sin deformarlos. El análisis y la reproducción son locales; algunos recursos visuales y voces de catálogo se prepararon con servicios externos.

Tavi · mascota de MileLab

Tavi, mi tejón de la miel: muestra de habla, parpadeo y expresiones.

Mile · avatar ilustrado

Una versión ilustrada de la presentadora, con sus estados originales.

Muestras sin sonido, montadas con los fotogramas originales del prototipo. Permiten ver sus expresiones; la sincronización con una narración se estudia por separado.

Versión realista del avatar de Mile
Mile · avatar realista. La tercera línea de exploración utiliza una presencia fotográfica.

Entrada 04Investigación y revisión de noticias

Verificación editorial asistida

Un sistema local que reúne evidencias, contrasta afirmaciones y prepara borradores de noticias para una revisión editorial informada.

Dos periódicos de papel con acentos violetas y una imagen de Andorra entre montañas
Ilustración conceptual generada con IA: un diario de papel con una vista de Andorra.

Notas del proceso

Diseño y desarrollo de la mesa editorial, la cola de trabajos y el dossier de fuentes. Separa la redacción de la comprobación con dos modelos locales y controles adicionales sobre citas, cifras y versiones.

Funciones, integraciones y muestras

Qué estoy explorando

  • Entrada desde RSS o enlaces públicos, con deduplicación y cola persistente.
  • Dossier con extractos, procedencia, fechas y huellas de los documentos consultados.
  • Redacción por afirmaciones y revisión separada de citas, cifras, atribuciones y alcance.
  • Consulta acotada de fuentes primarias CNA y CISA para noticias de vulnerabilidades.
  • Retención de borradores con contradicciones o respaldo insuficiente.
  • Carruseles y textos versionados: cada edición vuelve a comprobarse y necesita aprobación humana.
  1. Fuentes
  2. Afirmaciones
  3. Contraste
  4. Revisión humana

Herramientas e integraciones

  • Python
  • Ollama
  • Gemma
  • Qwen
  • SQLite
  • n8n
  • RSS

Ayuda a comprobar el respaldo de una noticia; no certifica su veracidad. La cobertura automática de fuentes primarias es limitada y los modelos pueden compartir errores. Aprobar una versión y publicarla son decisiones separadas.

Entrada 05Instrumento experimental

Generative Visuals · Komorebi II

Fotografía, partículas y sonido para explorar sistemas visuales que se pueden interpretar en directo.

Estudio conceptual orgánico de luz y materia

Notas del proceso

Desarrollo del instrumento, interfaz de control y conexión de entradas. La imagen de esta ficha es un estudio conceptual; la herramienta se ejecuta localmente.

Funciones, integraciones y muestras

Qué estoy explorando

  • Tres estudios visuales: Herbario, Erosión y Noctiluca.
  • Partículas en GPU, transiciones y cues.
  • Audio, archivo local o simulador; mapeo MIDI.
  • Ventanas separadas para control y salida.

Herramientas e integraciones

  • Three.js
  • WebGL2
  • Electron
  • Audio
  • MIDI

En validación con hardware y sesiones prolongadas. La salida Spout sigue pendiente.

Entrada 06Experimentos locales

Laboratorio de música con IA

Instrumentales, ambientes y bucles cortos para acompañar contenido y experiencias interactivas.

acestep.cpp con pruebas de instrumentales y formas de onda

Notas del proceso

Integración y experimentación con un motor existente, junto con herramientas propias para organizar resultados y preparar audio. Captura de una sesión de pruebas.

Funciones, integraciones y muestras

Qué estoy explorando

  • Presets para dirigir las pruebas de generación.
  • Registro de solicitudes, resultados y tiempos.
  • Exportación WAV, preparación de bucles y copias Ogg.
  • Escucha y revisión humana de los resultados.

Herramientas e integraciones

  • ACE-Step 1.5
  • acestep.cpp
  • Vulkan
  • Preparación de audio

Investigación con clips cortos; el tempo, la continuidad y los artefactos se revisan en cada resultado.

Entrada 07Exploración inicial

Investigación de mercado

Una línea de investigación para entender necesidades, comparar propuestas existentes y encontrar preguntas útiles antes de desarrollar una solución.

  1. Definir la pregunta
  2. Seleccionar fuentes
  3. Comparar propuestas
  4. Validar las hipótesis

Notas del proceso

Definición del enfoque y del primer caso de estudio: qué necesito saber, qué fuentes consultar y cómo distinguir observaciones de hipótesis. El proceso todavía está tomando forma.

Preguntas, enfoque y próximos pasos

Qué estoy explorando

  • Delimitar un sector, una necesidad y las preguntas del estudio.
  • Explorar cómo registrar fuentes, fechas y criterios de comparación.
  • Diseñar una síntesis que separe evidencia, hipótesis y preguntas abiertas.
  • Preparar un primer caso acotado antes de automatizar el proceso.

Enfoque propuesto

  • Revisión de fuentes
  • Comparación de propuestas
  • Síntesis manual

Investigación en fase inicial. Aún no hay un proceso automatizado validado ni resultados de mercado que presentar. Las etapas descritas son el enfoque de trabajo propuesto.

Hablemos de un experimento

De una idea a una conversación

¿Qué te gustaría crear?

Un proyecto, una colaboración o una oportunidad profesional. Cuéntame qué necesitas para concretar el siguiente paso.

No necesitas tener resuelta la parte técnica.