Gráfica Digital 2013

De Casiopea


Asignatura(s)Gráfica Digital
Año2013
Tipo de CursoRamo Lectivo
TalleresDG 4º
ProfesoresKatherine Exss
Profesor(es) Ayudante(s)Jaime Pérez Moena
EstudiantesSamira Bajbuj, Josefina Borja, Franco Baldassare, Paulina Buvinic, Michelle Camus, Carlos Chávez, Caterina Da Silva, Camila de la Vega, María Ignacia Falcone, Christopher Fattori, Juan Antonio Godoy, Idar González, Danila Ilabaca, Celeste Mardones, Carolina Nuñez, José Miguel Ortega, Daniela Pardo, Gabriela Pérez, Catalina Reyes, Alison Saravia, Nathaly Sepúlveda, Bernardo Silva, Nicol Valenzuela, Camila Valenzuela, Karla Vargas, Francisca Webar
Palabras Clavesoftware, interfaz gráfica, responsive web design, wireframes
Carreras RelacionadasDiseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.

Estudiantes

Importante: En el grupo de gráfica digital se realizará toda la comunicación oficial. Cada uno debe inscribirse para recibir los mensajes. El email es: graficadigital2013@arquitecturaucv.cl.

Clase 0: Introducción y problemática

20 de Junio

Does-Samsung-make-too-many-phones.png

El control que los diseñadores conocen en el medio impreso y desean frecuentemente en el medio web, es simplemente una función de las limitaciones de la página impresa. Debemos aceptar el hecho de que la web no tiene esas mismas limitaciones, y diseñar entonces para su flexibilidad. Pero primero, debemos "aceptar el flujo y reflujo de las cosas."[1]

  1. John Allsopp, "A Dao of Web Design"

Encargo

Frente a este hecho concreto en cuanto a parámetros y medidas estándar de resolución ¿cómo nos afecta a nosotros como diseñadores? ¿de qué manera influye que las nuevas tecnologías, dispositivos y los gustos y preferencias de las mismas personas van cambiando mucho más rápido de lo que pensamos?

Escribir de uno a tres párrafos breves como reflexión en la wiki, en la página Tareas Gráfica Digital 2013.


Clase 01: Responsive Web Design

27 de Junio

¿ Qué es mejor diseñar , para una pantalla y adaptarlo o un diseño para cada porte de pantalla?

se encuentran varios teorías ,hay que pensar que una pantalla para computador grande es distinta a una pantalla de móvil , pues las condiciones de usos son diferentes , un computador grande esta pensando para alguien que esta sentado cómodamente tomando un cafe , versus el móvil para alguien que esta expuesto al ruido , al movimiento ... etc

¿ Creen que esta bien , que hayan distintos tipos de soportes y tamaños?

fanco: creo que es bueno que haya un campo abierto , para que así el diseñador no tenga límites , en cambios como la de la diagramación.


CONTEXTO

" Responsive web design "

Comenzó

Para el año 2000 , la resolución era : 1024 px

Con la llegada del iphone empezó a cambiar completamente la vista de estas pantallas .

2007 : iphone 320 px

2010: ipad 768 px

¿Por que Samsung opto por tener múltiples tipos de pantallas ?


En Chile el año 2009 , habían 2961 conexiones a 3g y a fines del 2012 casi 4.921.587 subió favorablemente .

1) hay múltiples de dispositivos 2) Disntintas resoluciones 4) Aumento de conexiones móviles

Cada año las personas están ocupando mayormente el formato tablet más que los computadores. Trabajar en un soporte impreso es muy distinto que trabajar en un soporte web. Por ende tenemos que adelantarnos y prever ( lo que puede pasar más adelante) , hay que pensar con una fluidez y que sean flexibles . Hay que pensar en un diseño responsive para estos nuevos tiempos , no solo adaptable.

Esta es una buena frase , para los diseñadores , pues hay que ir adaptando constantemente

" …hay que mantener el paso ganado y hay que ser absolutamente modernos …"

1) Grilla flexible 2) Contenidos Fluidos 3) Media Queries ( criterios y rangos de tamaño , pues me permite trabajar dentro de este espacio)

Metodología de trabajo

DIBUJO - WIREFRAME - DISEÑO FRONT -PROTOTIPADO-TESTEO ( es un circulo , que se forma un ciclo ) se forman muchas iteraciones , hasta que llega un punto que finalmente queda como había quedado. Siempre es bueno ir probándolo inmediatamente.

Ejemplos de responsive: sitio web Food Sense www.foodsense.com ,www.alisiapari.com , www.goldengrid.com ( para ver como se va afectando la grilla) .

Cuando uno trabaja en móvil o trablet , los textos se van achicar entre más pequeño el tamaño , pero los botones

Encargo

Trabajo personal , donde cada uno tengo que elegir un sitio responsive ( analizar , su grilla , márgenes etc ) Debe tener a lo menos tres portes , debe ser rico en información , párrafos de textos , menús y navegaciones , estos son los requisitos para que uno analice el sitio. Para así se pueda analizar lo mayor posible.

buscar : diseño web responsive

www.resizemybrowser.com

  • Para próximo jueves

--Javierarojas (discusión) 17:59 27 jun 2013 (CLT)


Proyectos

  1. Caso de estudio: Starbucks(Alumnos: Josefina Borja)
  2. Kings Hill Cars - Estudio Responsive(Alumnos: Christopher Fattori)