• Saltar a la navegación principal
  • Saltar al contenido principal

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Vibe coding
  • Product Design
  • Design system
  • Tutoriales de Figma
  • Blog
  • Newsletter
Vibe coding / Git para UX designers

Git para UX designers

Me propuse hablar de Git para UX designers porque, visto cómo está la industria, ya no es un «extra» pensado solo para developers. En este contexto en el que diseño, código e IA empiezan a mezclarse de verdad, llámalo vibe coding, designer engineer o como quieras, entender lo básico de Git empieza a tener sentido.

guía básica de comandos git
Diseño en verde, versión controlada!

Y relax… que no hablo de convertirse en experto ni de manejar flujos complejos. Hablo de entender qué está pasando cuando trabajas con algo que ya no es solo un archivo estático. Versionar, guardar cambios, compartirlos con el equipo y volver atrás si hace falta.

Tener ese mínimo contexto cambia cómo diseñas el producto y cambia cómo te relacionas con el trabajo de otros perfiles.

Índice del artículo

Toggle
  • Git básico
  • Git visual para perfiles UX y Product Designers
    • Cursor y Google Antigravity
    • GitHub Desktop
  • Terminal o Consola

Git básico

Esto lo vi claro la semana pasada, cuando monté para una compañera un archivo markdown con una guía muy básica de comandos de Git.

# clonar un repositorio
# descarga el proyecto en tu ordenador
git clone https://github.com/usuario/repositorio.git

# entrar en la carpeta del proyecto
cd repositorio


# traer los últimos cambios del equipo
# buena práctica antes de empezar a trabajar
git pull


# ver el estado de los archivos
# qué hay cambiado y qué no
git status

# ver el historial de commits
# entender qué se ha hecho antes
git log --oneline


# ver las ramas disponibles
# la rama actual aparece marcada con *
git branch

# crear una rama nueva
# para trabajar sin tocar main
git checkout -b prueba-diseño


# añadir cambios
# prepara los archivos para guardarlos
git add .

# añadir solo un archivo concreto
git add src/components/Button.jsx


# crear un commit
# guarda un punto de control con un mensaje claro
git commit -m "ajustes de diseño en el perfil"


# subir la rama nueva al repositorio remoto
# solo la primera vez
git push -u origin prueba-diseño

# subir cambios habituales de la rama
git push


# cambiar entre ramas
git checkout main
git checkout prueba-diseño

Te lo dije, nada avanzado… clonar un repo, añadir cambios, usar ramas, hacer un commit y subirlos. Lo justo para no ir en pelotas a ciegas y no depender siempre de otra persona para cosas muy básicas.

Git visual para perfiles UX y Product Designers

Te digo una gran verdad, aquí es donde mucha gente de nuestro sector desconectar.

Me explico…

Un perfil de diseño puede usar Git sin vivir en la terminal todo el día.

Cómo?

Fácil, puede entender qué cambia, cuándo cambia y por qué cambia usando interfaces visuales dentro de los propios IDEs.

Cursor y Google Antigravity

Cursor muestra los cambios de cada archivo de forma visual y contextual. Cursor enseña qué líneas se modifican y permite decidir qué se guarda sin memorizar comandos. Un compañero developer incluso dio un paso más y montó comandos personalizados en Cursor para facilitarnos el trabajo a los product designers.

Estas acciones simplifican tareas habituales y reducen el margen de error. El objetivo no es saber más Git. El objetivo es trabajar mejor sin fricción innecesaria.

Google Antigravity conecta el código, la IA y el historial de cambios en un mismo flujo. Google Antigravity permite trabajar sobre versiones sin romper nada y entender el estado del proyecto con claridad.

Otros IDEs modernos integran Git como una capa más del trabajo diario. El IDE muestra ramas, commits y diferencias como si fueran estados del diseño.

GitHub Desktop

En ese mismo contexto apareció otra recomendación práctica: usar GitHub Desktop. GitHub Desktop está disponible para Windows y macOS y muestra los cambios con claridad, aclara qué se sube y cuándo, y reduce bastante el miedo a romper algo.

github desktop para ux designers
GitHub Desktop permite revisar cambios y commits sin pasar por la terminal.

Este enfoque reduce el miedo inicial. Este enfoque baja la barrera de entrada. Este enfoque encaja muy bien con perfiles que ya piensan en estados, versiones y decisiones.

No se trata de saber más Git. Se trata de ver lo que pasa.

Terminal o Consola

Yo trabajo con un mix bastante práctico. Yo uso comandos de Git en consola cuando quiero rapidez o control directo. Yo uso GitHub Desktop cuando prefiero revisar cambios con calma o trabajar más visual.

En mi caso hay además un motivo personal. La consola me conecta con los inicios de mi carrera, cuando escribía directamente sobre la pantalla de fósforo verde de mi primer Apple II. No había capas ni interfaces sofisticadas, solo texto, comandos y respuesta inmediata.

Usar hoy la consola, aunque sea para cosas sencillas, me resulta natural.

Resumiendo…

Aprender lo básico de Git o GitHub ya no va de querer programar. Aprender Git va de entender mejor el entorno en el que diseñas productos, colaborar mejor con developers y moverte con menos fricción en equipos donde diseño y código ya no van separados.

Aprende sobre UX/UI + IA, Figma y Product Design

📣 Apúntate a mi newsletter semanal

🔥 Únete a la comunidad UX y UI fácil en Discord

🔴 Suscríbete al canal de YouTube para ver tutoriales

Acerca de Juanpol

Diseñando desde 1993 y todavía aprendiendo. Actualmente como Product Designer en Freepik, aquí comparto mis notas sobre lo que voy probando de UX/UI e IA.

Juanpol

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Acerca de
  • info@juanpol.com
  • LinkedIn
  • GitHub
  • YouTube
  • Discord
  • Telegram
  • X | @juanpol

  • Aviso legal, Privacidad y Cookies

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes informarte más sobre ellas en los

Resumen de privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes cambiar la configuración u obtener más información consultando la política de cookies.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Cookies de terceros

Esta web utiliza herramientas de estadística para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

Política de cookies

Más información sobre nuestra política de cookies.