Diferencia entre revisiones de «Valentina Olivares: Proposición Sitio CCA»

De Casiopea
Sin resumen de edición
Sin resumen de edición
 
(No se muestran 9 ediciones intermedias de 2 usuarios)
Línea 2: Línea 2:
|Título=Sitio Web Corporación Cultural Amereida
|Título=Sitio Web Corporación Cultural Amereida
|Tipo de Proyecto=Proyecto de Curso
|Tipo de Proyecto=Proyecto de Curso
|Palabras Clave=diseño web, responsive
|Año de Inicio=2015
|Año de Inicio=2015
|Año de Término=2015
|Carreras Relacionadas=Diseño Gráfico
|Carreras Relacionadas=Diseño Gráfico
|Asignaturas Relacionadas=Construcción de Diseño Gráfico 4,  
|Asignaturas Relacionadas=Construcción de Diseño Gráfico 4,
|Cursos Relacionados=Construcción DG 2015,
|Cursos Relacionados=Construcción DG 2015,
|Profesor=Herbert Spencer,
|Profesor=Herbert Spencer,
|Alumnos=Valentina Olivares,
|Alumnos=Valentina Olivares,
|URL=https://github.com/valeie/cca.git
|URL= http://valeie.github.io/cca/
}}
}}
=Proposición 1=
==Estilos gráficos==
===Paleta de colores===
===Estilos tipográficos===
===Maqueta navegable===
=Proposición 2=
==Estilos gráficos==
Se propone un estilo gráfico basado en un diseño mínimo y austero, por lo que se opta por primar el uso del blanco, y eliminar en su mayoría las cajas de colores y rellenos de fondo, dando prioridad a la fotografía y tipografías, se usan colores alternativos a los colores usados en el sitio original de la corporación, y se crea una imagen corporativa adecuada para móvil y su variante en escritorio, basada en la imagen original, a partir del logotipo, se utiliza la misma paleta de colores para dar estilo a los distintos tipos de página.
===Imagen Corporativa===
La imagen corporativa está determinada por una imagen (isotipo), y un texto con el que se identifica la corporación, hay dos variantes de la imagen corporativa, en la versión móvil el logotipo, se abrevia como "CCA", y en la versión escritorio la imagen se amplía a "CCamereida", ambas variantes acompañadas del mismo isotipo que gráfica la cruz del sur, utilizando una nomenclatura geométrica heredada del logotipo original, se pensó en dar más énfasis a la imagen acentuando los signos gráficos que la componen, sin perder la proporción original.
[[archivo:Logo movile CCA-04.jpg|600px|center]]
===Sistema de grillas===
Se usa el sistema de grillas que maneja Bootstrap que es el de 12 columnas para escritorio, y en la versión móvil de 4 columnas.
<gallery>
image:Maquetas escritorio2-01.jpg|grilla de 12 columnas versión escritorio
image:Maquetas 2-05.jpg|grilla de 4 columnas versión móvil
</gallery>
===Paleta de colores===
Se eligen dos colores base para el logotipo, el primario es un púrpura oscuro, y el secundario un dorado cálido.a partir de estos dos colores, se crean los menús, cajas de texto e íconos con variantes en porcentaje de opacidad.
[[archivo:Paletadecolorescca-05.jpg|600px]]
===Estilos tipográficos===
Para los textos se escogieron dos familias tipográficas variantes de Roboto, la primera es Roboto en sus versiones light y regular para los títulos y menús, y la segunda es Roboto Slab en sus variantes light y thin, para las bajadas de título y párrafos.
Roboto:
[[archivo:Robototipo.jpg|600px]]
Roboto Slab:
[[archivo:Roboto slab.jpg|600px]]
===Maqueta navegable===
Versión móvil:
https://marvelapp.com/c97i68
Versión Escritorio:
https://marvelapp.com/72cjcj

Revisión actual - 13:04 21 ago 2015

TítuloSitio Web Corporación Cultural Amereida
Tipo de ProyectoProyecto de Curso
Palabras Clavediseño web, responsive
Período2015-2015
AsignaturaConstrucción de Diseño Gráfico 4,
Del CursoConstrucción 4º DG 2015,
CarrerasDiseñ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.
Alumno(s)Valentina Olivares
ProfesorHerbert Spencer
URLhttp://valeie.github.io/cca/



Proposición 1

Estilos gráficos

Paleta de colores

Estilos tipográficos

Maqueta navegable

Proposición 2

Estilos gráficos

Se propone un estilo gráfico basado en un diseño mínimo y austero, por lo que se opta por primar el uso del blanco, y eliminar en su mayoría las cajas de colores y rellenos de fondo, dando prioridad a la fotografía y tipografías, se usan colores alternativos a los colores usados en el sitio original de la corporación, y se crea una imagen corporativa adecuada para móvil y su variante en escritorio, basada en la imagen original, a partir del logotipo, se utiliza la misma paleta de colores para dar estilo a los distintos tipos de página.

Imagen Corporativa

La imagen corporativa está determinada por una imagen (isotipo), y un texto con el que se identifica la corporación, hay dos variantes de la imagen corporativa, en la versión móvil el logotipo, se abrevia como "CCA", y en la versión escritorio la imagen se amplía a "CCamereida", ambas variantes acompañadas del mismo isotipo que gráfica la cruz del sur, utilizando una nomenclatura geométrica heredada del logotipo original, se pensó en dar más énfasis a la imagen acentuando los signos gráficos que la componen, sin perder la proporción original.

Logo movile CCA-04.jpg

Sistema de grillas

Se usa el sistema de grillas que maneja Bootstrap que es el de 12 columnas para escritorio, y en la versión móvil de 4 columnas.

Paleta de colores

Se eligen dos colores base para el logotipo, el primario es un púrpura oscuro, y el secundario un dorado cálido.a partir de estos dos colores, se crean los menús, cajas de texto e íconos con variantes en porcentaje de opacidad.

Paletadecolorescca-05.jpg

Estilos tipográficos

Para los textos se escogieron dos familias tipográficas variantes de Roboto, la primera es Roboto en sus versiones light y regular para los títulos y menús, y la segunda es Roboto Slab en sus variantes light y thin, para las bajadas de título y párrafos.

Roboto:

Robototipo.jpg

Roboto Slab:

Roboto slab.jpg

Maqueta navegable

Versión móvil:

https://marvelapp.com/c97i68


Versión Escritorio:

https://marvelapp.com/72cjcj