Diseño y programo interfaces web.

Soy Michael Quintero, diseñador y desarrollador frontend de Bucaramanga, Colombia. Uso IA para llegar antes; cada línea que entrego la he leído yo.

Cuéntame tu proyecto Ver el trabajo

Disponible para proyectos nuevos

Michael Quintero de pie, con camisa verde oliva y los brazos cruzados

Con qué trabajo

Vue 3
Vite
Tailwind CSS
JavaScript
TypeScript
GSAP
Figma
HTML
CSS
Pinia
Node.js
Vitest
Git
npm
Netlify
Claude Code

Trabajo reciente

Una lista corta de lo que he construido. Elige una fila para ver el proyecto.

WinDiagAplicación de escritorio para Windows (Electron), pensada para técnicos de TI y empresas de reacondicionamiento.2026
Aplicación de escritorio para Windows con la que los técnicos prueban el hardware de portátiles, actualizan drivers desde un catálogo compartido y actualizan la BIOS de forma segura, todo desde un solo lugar.
KamUILibrería de componentes CSS2026
Componentes accesibles para Tailwind CSS 4, sin JavaScript en tiempo de ejecución y para cualquier framework.
Clínica de Urgencias BucaramangaSitio web de salud2024
Rediseño y desarrollo del sitio de la clínica: citas, resultados de laboratorio y contacto por sede.
M-UI · m-btnLibrería Vue en npm2024
Mi librería de componentes para Vue 3. El botón m-btn está publicado en npm y es el que usa esta página.

Cómo trabajo con IA

La IA escribe rápido y se equivoca con seguridad. Yo decido qué se construye y atrapo sus errores. Un ejemplo con mi propio botón:

Primero, el diseño.
Antes de pedirle nada a una IA, defino medidas, colores y estados. Si no está decidido, la IA lo decide por mí, y mal.
Luego, el borrador de la IA.
Le paso la especificación y obtengo código en segundos. Parece correcto, pero un borrador típico trae errores como estos tres.
Al final, mi revisión.
Corrijo, pruebo con teclado y lector de pantalla y lo publico. Este es el botón real, desde npm. Pruébalo.

Especificación de m-btn

44Enviar propuesta24 · · · 24

Alto: 32 · 36 · 40 · 44 · 48 px
Relleno lateral: 12 – 28 px
Esquinas: rectas, 14 px o píldora
Variantes: sólido, contorno, tonal, texto
Estados: reposo, encima, foco, cargando, desactivado
Accesible: etiqueta en botones de solo icono

Un borrador típico de IA · MBtn.vue

<template>
  <div class="btn" @click="$emit('click')">
    <i v-if="icon" :class="icon"></i>
    {{ label }}
  </div>
</template>
 
<style>
.btn { transition: all .3s; }
.btn:focus { outline: none; }
</style>

Un div no es un botón: no recibe foco ni responde a Enter.
El icono solo no tiene nombre para lectores de pantalla.
Quita el foco visible: quien usa teclado se pierde.

Revisado y publicado · @jotnar/m-btn

Pulsado: 0 veces

<m-btn md label="Enviar propuesta" />

Elemento <button> nativo
Foco visible con teclado
Nombre accesible en botones de icono

Lo que puedo hacer por ti
Trabajo con equipos pequeños y con personas que necesitan que su producto se vea bien y funcione igual de bien.
Diseño de interfaces
De la idea a un diseño en Figma con sus estados, sus textos y su versión móvil, listo para programar.
Pedir esto
Desarrollo frontend
Sitios y aplicaciones en Vue 3 y Tailwind CSS, rápidos, accesibles y fáciles de mantener por tu equipo.
Pedir esto
Sistemas de componentes
Librerías de botones, formularios y tarjetas para que cada pantalla nueva salga coherente sin empezar de cero.
Pedir esto
Revisión de código hecho con IA
¿Tu app la escribió una IA y ahora nadie la entiende? La reviso, corrijo lo que falla y la dejo mantenible.
Pedir esto
¿Otra cosa?
Si tu proyecto no encaja en ninguna tarjeta, cuéntamelo igual.
Escríbeme

Sobre mí

Empecé a programar en 2020, en plena pandemia, con un técnico del SENA y muchas noches de documentación. Aprendí HTML, CSS y JavaScript a fuerza de construir cosas que no funcionaban hasta que funcionaron.

En 2022 di clases de informática a más de cien estudiantes de bachillerato. Enseñar me obligó a explicar cada decisión, y sigo trabajando así: si no puedo explicar por qué una línea está ahí, la quito.

Después pasé casi tres años como desarrollador frontend en la Clínica de Urgencias Bucaramanga, rediseñando su sitio y construyendo su intranet. Ahí aprendí que en salud una interfaz confusa le cuesta tiempo a alguien que no lo tiene.

Hoy uso IA a diario, igual que uso un buen editor. Me ahorra horas de escribir; no me ahorra pensar. Esa diferencia es lo que te ofrezco.

Michael Quintero

Diseñador y desarrollador frontend

Descargar CV (PDF)

Vista de Bucaramanga con los cerros al fondo — Bucaramanga, Santander, donde empezó todo.

Trayectoria

Experiencia

Desarrollador frontend, Clínica de Urgencias Bucaramanga2022 – 2025
Profesor de informática, Instituto Decroly2022

Formación

Técnico en sistemas, SENA2020 – 2021
Responsive Web Design, freeCodeCamp2024
Fundamentos de marketing digital, Google Activate2022

Herramientas

Vue 3, Vite y Piniaa diario
Tailwind CSS 4 y GSAPa diario
Figmadiseño
Claude CodeIA, con revisión

Escritos

Todos los artículos

Diseño con criterio código que se lee IA que se revisa

¿Tienes un proyecto en mente?Cuéntamelo en una frase.

Se abrirá tu correo con el mensaje listo. Respondo en menos de dos días hábiles.

Correo: mqad89@outlook.com
LinkedIn: tech-michael-quintero
GitHub: JotnarDev
CV: PDF, una página
Zona horaria: Bucaramanga, UTC−5
Idiomas: Español nativo, inglés B2

Diseño y programo interfaces web.

Con qué trabajo

Trabajo reciente

Cómo trabajo con IA

Primero, el diseño.

Luego, el borrador de la IA.

Al final, mi revisión.

Lo que puedo hacer por ti

Diseño de interfaces

Desarrollo frontend

Sistemas de componentes

Revisión de código hecho con IA

¿Otra cosa?