Comprender cómo funciona JavaScript no es exclusivo de quienes desarrollan software. Si diseñas interfaces web o de aplicaciones, tener nociones claras de este lenguaje te permite crear propuestas más realistas, comunicarte mejor con equipos de desarrollo y anticipar los límites y posibilidades de cada interacción que dibujas en Figma, Sketch o XD.
¿Qué es la programación y por qué importa al diseñar?
La programación es un proceso compuesto por varias instrucciones que, al ejecutarse, producen un resultado esperado [01:00]. Un ejemplo sencillo es una calculadora: entregas dos números, defines una operación —como la suma— y el computador devuelve el resultado. De esa forma delegas en la máquina tareas que podrías resolver mentalmente, pero a mayor escala y velocidad.
Un lenguaje de programación es, entonces, el idioma común entre seres humanos y computadores [01:30]. Es la herramienta con la que especificas esas instrucciones de forma que la máquina las entienda y las ejecute.
¿Por qué JavaScript es relevante para diseñadores?
Conocer JavaScript te da una idea clara de lo que puedes alcanzar con tu diseño [02:00]. Al entender sus capacidades y restricciones, diseñas de manera aterrizada:
- Sabes qué estados e interacciones son posibles en tus componentes.
- Puedes proponer interfaces que un equipo de desarrollo implementará sin fricciones.
- Te vuelves consciente del proceso de desarrollo, lo que mejora la colaboración.
¿Dónde se usa JavaScript en la vida real?
JavaScript es el lenguaje más popular de la web [02:52]. Con él se construyen aplicaciones de escritorio, mobile y web. Productos como Instagram, eBay, Coursera, Asana e incluso Platzi lo utilizan en sus sitios. Es un lenguaje extremadamente versátil.
Un dato importante: JavaScript no tiene relación con Java [03:20]. Son lenguajes completamente distintos; la similitud en el nombre es solo una coincidencia que confunde a quienes están comenzando.
¿Qué papel cumple JavaScript junto a HTML y CSS?
En el desarrollo web, cada tecnología tiene una responsabilidad clara [03:38]:
- HTML define la capa estructural: qué elementos se muestran.
- CSS se encarga del estilo visual de esos elementos.
- JavaScript manipula los elementos y les agrega interacción.
Gracias a esta división, puedes crear interfaces con capacidad de respuesta inmediata que mejoran la experiencia del usuario. El usuario recibe feedback al instante sobre cada acción que realiza.
¿Cuáles son ejemplos cotidianos de JavaScript?
Seguramente ya interactúas con JavaScript a diario sin darte cuenta [04:08]:
- Validación de formularios: cuando creas un usuario y el sistema verifica en tiempo real si el nombre está disponible o si la contraseña cumple los requisitos.
- Sugerencias de búsqueda en Google: a medida que escribes, aparecen opciones en la parte inferior del buscador.
- Dropdowns de Bootstrap: menús desplegables que permiten seleccionar opciones.
- Modales en Instagram web: al hacer clic en una miniatura de imagen se abre una ventana superpuesta con el contenido ampliado [04:50].
Todos estos patrones de interacción son posibles gracias a JavaScript y forman parte del vocabulario visual que manejas como diseñador o diseñadora.
¿Qué conceptos básicos necesitas dominar primero?
Los fundamentos que se abordan en una aproximación inicial son la sintaxis del lenguaje, las variables y los tipos de datos [02:40]. Las variables son espacios donde guardas información para usarla después, y los tipos de datos definen la naturaleza de esa información: números, textos, valores verdaderos o falsos, entre otros.
JavaScript también permite traer información y datos desde un servidor [05:28], lo que amplía enormemente las posibilidades de cualquier interfaz. Los límites son muy amplios y la versatilidad del lenguaje lo convierte en una herramienta que vale la pena comprender, al menos a nivel conceptual.
Si te interesa profundizar, explorar un curso dedicado a JavaScript te permitirá pasar de la teoría a la práctica y entender cómo cada línea de código se traduce en la interacción que diseñas. ¿Ya habías considerado cómo el conocimiento de programación transforma tu forma de diseñar?
