Portafolio Consuelo Santis

De Casiopea


TítuloPortafolio web Consuelo Santis
Tipo de ProyectoProyecto de Curso
Palabras Claveportafolio
Período2016-2016
Del CursoConstrucción 4º DG 2016
CarrerasDiseño, Diseño Gráfico
Alumno(s)Consuelo Santis Escudero
ProfesorKatherine Exss, Herbert Spencer
URLhttp://consuelosantis.github.io/Portafolio

Book

Mapas de Navegación

Wireframes

02

La Home trae desde un principio elementos ‘’destacados’’ en cada tipo de proyecto, mientras que los elementos ux los presenta como un enlace de texto.

Las fichas de categorías traen a la vista la lectura en scroll, donde se pueden ver todos los proyectos ordenados en horizontes con el uso de textos, una ficha de proyecto ubicada en la parte inferior y el uso de 4 fotos por parte del diseño análogo y 2 por parte de interacción para poder agregar una columna perteneciente al video.

Sin embargo tras una primera revisión se ‘’’descarta este diseño casi por completo, ya que no permite una lectura fácil al ser un exceso de contenido, y además de las leyes estrictas que se debe seguir en base a la extensión de cada tipo de texto.’’’

03

Relación texto por sobre imagen

La home trae respuesta a las decisiones ya realizadas con las páginas interiores de acuerdo a texto por sobre imagen, donde existe una entrada a cada sub - categoría por medio de horizontes de información conformados por una imagen de fondo y un texto superior.

De igual modo en las páginas índices se muestra esta relación dado que el ingreso a cada proyecto está dado por una imagen ubicada a la derecha y un texto a la izquierda compuesto por:

  • Nombre del proyecto.
  • Bajada del título.
  • Ficha (sin link a documentación).

Es dentro de la página de cada proyecto que se utiliza una imagen de ancho total del lienzo (1800px app) en blanco y negro con el uso de un transparencia negra. Donde se ubica el título, bajada y ficha de proyecto. bajo este primer horizonte se muestra una columna de texto en la derecha acompañado de 4 imágenes en la izquierda.

Además dentro de los Proyectos de interacción se suma un horizonte para los videos.

En las páginas donde el texto prima por sobre todo, se cambia la diagramación de la página creando una columna de texto a la derecha y tres fotos de un tamaño menor a la izquierda (impidiendo su lectura correcta). Toda esta información ordena en horizontes de información dentro de un mismo scroll.

De igual modo se muestra la información dentro ‘’sobre mi’’ ocurriendo una diferencia en el uso de la imagen.

04

Interfaz gráfica

01

02

03

Modificación de la interfaz en base al diseño response, además del uso adecuado y construcción de imágenes por Mockups.

Mapa de Divs

Contenidos

El Afiche Político en Chile 1970-1990

La mano como elemento gráfico

Proyecto académico Taller de Presentación 3 Pucv

Junio - Septiembre 2015 Documentación

Al momento de hablar de este momento de análisis del afiche político en Chile y la mano como un elemento gráfico del mismo es posible establecer que la mano recae en su significación inicial y mencionada por Balzac, donde la mano permite ir más allá de la expresión del cuerpo, siendo capaz de mostrar el pensamiento y pudiendo dar pie a compresión del gesto. Es de este modo que podemos hablar que en el afiche político la mano es capaz de decirnos un todo, todo referido a la idea del afiche como un medio de expresión y de información instantáneo, donde la imagen está por sobre del texto.

Una mano no se refiere únicamente a un cuerpo , sino que expresa y es continuación de un pensamiento es preciso comprender y traducir. Honoré Balzac


El Afiche Político

El poder la mano como elemento gráfico

Proyecto académico

Taller de Presentación 3

Pucv

Septiembre 2015

Documentación

Construcción de una infografía capaz de mostrar la síntesis de investigación El Afiche Político en Chile. Donde se presentan los elementos claves para la comprensión del tema.

Señaletica de Emergencia Cerro Merced

Propuesta de restauración desde el reconocimiento del vecindario

Proyecto académico

Taller de 2º año Diseño Gráfico 2014

Pucv

Abril - Agosto 2014

Documentación


El 14 de abril la Escuela de Arquitectura y Diseño inicia diversas iniciativas en ayuda de los damnificados en el área incendiada del Cerro La Merced. Bajo este contexto las primeras labores consisten en retiro de escombros e implementación de un comedor abierto para voluntarios y vecinos. Dicha experiencia permitió conocer la realidad de los vecinos de dos maneras, una dado el contacto directo con ellos en estas faenas y otra a través del hecho de que muchos de ellos al abandonar sus ruinas, dejan sus nombres, o las familias, su dirección y/o teléfonos, escribiendo en los muros con un carbón o en cartones amarrados a los postes o las rejas.

A raíz de ese hecho, dentro del Taller de Segundo Año de Diseño Gráfico iniciamos un proyecto que considera como soporte los postes de alumbrado público, al cual se adosan las superficies gráficas de carácter provisorio.

El proyecto contemplaba el diseño y producción de un sistema de carteles que señalen las calles a partir de su propio nombre y un mapa de ubicación, con una cara lateral blanca que invita a inscribir la información que se obtiene de los carteles improvisados y además otorgar el espacio para que los mismos vecinos escriban los datos que faltan.Comprendido en una dimensión de regalo para los vecinos del Cerro la Merced, el proyecto como tal culmina con un sistema de 15 señaléticas instaladas el 19 de agosto en el lugar, dispuesto para ser leídos y utilizados por las mismas personas que habitan cada uno de los sectores.


Abstracción del Rasgo Gráfico

Coherencia de la imagen inicial con la caracterización de lo observado

Proyecto académico

Taller de 3º año Diseño Gráfico 2015

Pucv

Marzo - Junio 2015

Documentación


El mundo que nos rodea es uno presentado por un sin fin de elementos, de modo que al ordenarlos se requiere de relaciones para tener un punto de comparación. El expresar el todo que nos rodea mediante relaciones gráficas; contraste, cerca-lejos, texturas, diámetros, grosores, el provenir, grande pequeño, movimiento y un primer modo de representarlo a través de lineas.

Es a partir de este primer modo de abstracción que podemos comenzar a pensar en cuando la imagen se aleja de lo figurativo, pero se continúa comprendiendo su rasgo particula; este es el concepto en el que podemos referirnos a él abstraer y su proceso en este caso la imagen.

El hecho de establecer preguntas claves; ¿Cuál es el fondo y cuál la figura?, ¿Qué es lo que pasa entre ellos? y ¿Cuál es el ritmo de lectura?, además de la existencia de un primer pensamiento en la metáfora de lo observado.

Tras esta primera parte del descubrir el Rasgo gráfico, mediante la abstracción gráfica de la imagen.

Este funcionara como un gestor de la composición, donde Rasgo; corresponde a la observación de la zona característica, está capaz de permitir una visualización de la obra pero no de crear una lectura literal de la misma.

Construcción de Mapas de Recuerdo - Experiencia

Travesía Vodudahue 2015 a través de abstracción

Proyecto académico

Taller de 3º año Diseño Gráfico 2015

Pucv

Noviembre 2015

Documentación

El momento en el que nos imaginamos cómo será un lugar, nuestra mente comienzan a realizar una especulación de lo que podemos encontrar, sin embargo qué sucede cuando recordamos cómo es un lugar, los espacios y las distancias en las que habitamos por un determinado tiempo.

Es de acuerdo a este orden de experiencia/recuerdo que el Proyecto trae a la superficie de lo observable lo que podemos llamar como la valorización de lo que se vivió en la Travesía Vodudahue 2015.

En este sentido los mapas que componen el Proyecto vienen a presentar la relación entre lo vivido y el recuerdo, permitiendo crear una representación del espacio y un análisis del mismo a partir de la experiencia. El por qué la idea de visualizar la experiencia mediante mapas, viene dada del poder de representación gráfica del territorio que nos permite crear este elemento y el poder de abstracción que conllev, es en este sentido que la construcción del mapa nace en son del construir en base a elementos del recuerdo por esto es posible hablar de la construcción de Mapas ideográmas partir de la experiencia.

Cartas de la phalène

Abstracción a partir de la frase

Proyecto académico

Taller de 3º año Diseño Gráfico 2015

Pucv

Septiembre - Octubre 2015

La Phalène se nos presenta como un juego que busca nombrar El Lugar que será habitado durante la Travesía de Vodudahue.

Cuando hablamos de nombrar el lugar es posible caer en el concepto de crear un lenguaje a partir de la abstracción misma. Sin embargo, al momento de presentarnos la frase y de uni car una paleta grupal a través del puntillismo nos vemos sumidos en la realidad de buscar aquella construcción de la imagen que sea sacada desde lo literal para poder ser abstraída por un tercero.

Diseño de interacción

Estereopsis

Aparición de la realidad topográfica cotidiana de Valparaíso mediante la parábola

Proyecto académico

Taller de Interacción

Pucv

En conjunto con Cristian Zamora

Abril - Junio 2016

Documentación

El proyecto intenta construir un misterio que revela un algo , mediante el aparecer en fases de lectura. En este sentido Valparaíso posee 3 momentos visuales marcados. Al observar el plan de la Ciudad estando sumergido en él es posible percatarse de la existencia de un espacio reducido, al estar rodeado de construcciones.

Sin embargo a medida que se va ascendiendo por los Cerros se logra observar el Mar de manera gradual y permite observar la Bahía.

Y cuando se logra estar en la cima del cerro se visualiza la bahía por completo, incluida la dimensión real de sus cerros, plan y el Mar.

De este modo se busca construir un despliegue y repliegue que sea capaz de mostrar al igual que la lectura de la ciudad 3 momentos de lectura desde una expresión mínima, hasta un máximo, pasando por un elemento medio. Estos momentos son construidos a través del uso de Sensores de Proximidad que mediante un Arduino envían la información procesada a un motor construido en impresión 3D.

Explorador de Arte

Construcción de una experiencia de interacción

Proyecto académico

Taller de Interacción

Pucv

En conjunto con Kim López Juan Pablo Vergara

Marzo-Abril 2016 Documentación

Como encargo dentro del Taller de interacción nace el encargo de construir un Control "Joystick" que sea capaz de interactuar y modificar una obra Piet Mondrian (Composición II en rojo, azul y Amarillo, 1930). Donde la interacción está construida en base a la modificación de 4 dimensiones gráficas, dadas por:

  • Grosor de línea:

Interacción con la variación del grosor de la línea o el trazo, donde el mínimo está dado por la no linea, mientras que el punto máximo está dado por la ampliación de la línea en su máxima expresión, siendo capaz de consumir todo el cuadro en negro.

  • Relación Diagonal:

La intervención está dada por un juego que permite deconstruir la relación de ampliación entre los cuadros Rojo y Azul.

  • Descomposición del color:

Descomposición del color en círculos que van cambiando de tamaño gradual en son de una grilla ya establecida, Sin afectar a los bordes del cuadro.

  • Expansión circular:

Piet se auto limita al uso de líneas y ángulos rectos dentro de sus obras, es por este motivo que la interacción realizada con esta dimensión va en son de romper con estos paradigmas y ser capaces de observar la transformación de la línea recta hasta llegar a el círculo.

La propuesta presentada busca crear una interrelación lineal entre los potenciometros con el volumen de tal forma que éste último no recibe solamente a los potenciómetros, sino que los potenciómetros se incorporan en el volumen generando un sólo gesto.

Sobre mi

Consuelo Santis, estudiante de diseño gráfico Dentro del mundo académico me he desenvuelto en proyectos editoriales y de investigación, permitiendo relacionarse con la distribución de textos plasmados sobre el papel. Es dentro de este mundo que la aproximación a la tecnología se presenta en una primera forma a través del código puro de programación en processing y Arduino, además de la construcción de circuitos capaces de controlar sensores y potenciómetros.

Mientras el acercamiento al mundo digital ocurre de mano con la vida laboral, donde las herramientas de investigación tanto de usuarios como de servicios se ponen en acción.

Ux

Test de Usuarios

Como herramientas de investigación los Test de usuarios permiten probar sitios webs para encontrar las falencias de navegación durante la interacción del sistema con los usuarios.

Donde los escenarios de interacción son una forma de creación de situaciones y contextos verosímiles, cada una de los cuales está determinado por la identificación de una meta a lograr. Generalmente, los primeros escenarios corresponden a un contexto iniciativo, de descubrimiento, para luego abordar una a una las tareas involucradas en el uso de un servicio, desde las básicas (simples) hasta las avanzadas (complejas).

Test Heurísticos

El evaluar un sitio web ayuda a conocer las fortalezas y debilidades del sistema, ayudando a entender en qué se debe mejorar, es en base a esto que podemos establecer una serie de conclusiones que ayudarán a generar una estrategias para dar un buen servicio a los usuarios permitiendo además cumplir con los objetivos del negocio.

Benchmark

Herramienta de investigación que nos permite observar y analizar las tendencias del mercado actual, mediante la búsqueda de elementos particulares, que nos ayuden a crear bases estratégicas para la creación de una buena experiencia de servicios.

Ejercicios de HTML CSS

https://consuelosantis.github.io/cssgarden/