Diseño gráfico y programación web

Diseño gráfico y programación web

Abordar la programación web desde el punto de vista de un diseñador gráfico puede ser retador. Por lo general, en el diseño gráfico, la mayoría de los elementos son visibles, conocemos el contenido de la pieza a diseñar y su tamaño. La selección de de colores y tipografía, entre otros elementos, se realizan en un entorno visual.

Los programas de diseño gráfico están adaptados a esta naturaleza; si quieres hacer un círculo basta con elegir la herramienta indicada y dibujarla en el espacio de trabajo. En contraste, el diseño web se utiliza el pensamiento abstracto para resolver los requerimientos que se nos plantean; por ejemplo, si queremos cambiar el ancho de un elemento en nuestra vista web, es necesario modificar sus propiedades en los estilos CSS.

Las maneras de abordar los cambios son diferentes porque en el diseño gráfico las características del círculo (Ancho, alto, color de relleno, entre otros) se manejan seleccionándolo y editando sus propiedades en el programa de diseño (Illustrator, Photoshop). En la programación web se requiere ajustar el código que maneja el estilo visual de dicho elemento.

¿Cuál es el objetivo de blog?

Crear contenido en español de diseño y programación web, compartir e interactuar con personas interesadas en el diseño gráfico, la programación web y las tecnologías de la información. También su propósito, es el de servir información para iniciar el aprendizaje del diseño y la programación web.

Está dirigido a diseñadores gráficos, aficionados, entusiastas, programadores web y cualquier persona que busque conocer los fundamentos del diseño gráfico.

Temas

I.Diseño y programación web

• Diseño gráfico

  • Fundamentos.
  • Logotipos, impresos, tipografía.

• Diseño web

  • Fundamentos.
  • Tipos de sitios web (estáticos, web apps, CMS).
  • Herramientas.

• Programación web

  • Fundamentos.
  • HTML, CSS, JS.
  • Herramientas front-end.
  • Herramientas back-end.

II. Guías

• Programas de diseño gráfico
  • Illustrator, Photoshop, Animate, Gimp, Inkscape, FontBase.
• Programas de desarrollo web
  • Visual Studio Code, GitHub, Google Chrome Dev Tools.
• Librerías y frameworks
  • Vue, React, Gatsby, Nuxt, Astro, Tailwind, WindiCSS.

II. Reseñas

• Diseño gráfico, desarrollo web y tecnologías de la información.
• Videojuegos, series y películas.