Portafolio Ingrid Céspedes

De Casiopea


TítuloPortafolio Ingrid Céspedes
Tipo de ProyectoProyecto de Curso
Palabras Clavehtml, css, portafolio, diseño front
Período2014-2014
Del CursoConstrucción 4º DG 2014
CarrerasDiseño Gráfico
Alumno(s)Ingrid Céspedes
ProfesorKatherine Exss
URLhttps://dl.dropboxusercontent.com/u/71076673/web/index.html

Primera propuesta

Contexto

El contexto del trabajo se enmarca en el taller de construcción del 4°año de DG. Con el fin de nivelar los conocimientos de html y css, realizaremos todo el proceso para crear nuestro portafolio digital

Mapa de navegación

Mapadeportafoliocontactos.jpg

Wireframe

Segunda propuesta

En la revisión anterior, las mejoras que se debían hacer al trabajo eran:

  • orden y expresión de mapa de navegación
  • Pensar en una forma facilitada de acceder al contenido del sitio


En esta segunda propuesta con correcciones sobre el mapa de navegación y del wireframe, además se presenta una propuesta de interfaz Gráfica y un logo para el portafolio web. Las modificaciones realizadas en el mapa de navegación del portafoli tiene que ver con la decisión de extender y presentar todo el contenido del sitio en la página de inicio. Aprovechando la flexibilidad que los formatos digitales nos entregan. Un largo scroll que se dividirá en las diferentes secciones y se separa por dos colores de fondo (blanco y rosa).


Mapa de navegación

700px

Wireframe

El diseño del Wireframe fue realizado en el programa Adobe Firework, ideal para le realización de estas maquetas ya que trabaja con la precisión de los pixeles(resolución de 1366px). Se pensó en 5 plantillas que son las variaciones que el portafolio puede tener.

  • La home o inicio
  • La sección de los trabajos académicos, que entrega un texto que contextualizar, más una serie de imágenes.
  • Como se presentan las imágenes
  • La sección de proyectos que a pesar de estar expuestos en la home, al acceder a uno puedes acceder a todos a la ves.
  • La sección de los Proyectos personales también varía ya que solo es una galería que luego al hacer click en una de las imágenes, esta se despliega como un lighbox.

Imagen

Propuestas de logo para el portafolio. Se define una forma, estilo y color que guiaran el diseño de la Interfaz Gráfica. El logo es como la punta de la pirámide, desde donde pude seguir pensando en el cuerpo de esta pirámide, el cuerpo del sitio.

¿Qué resolución de pantalla es ideal para diseñar?

Interfaz resolución de 1366px

Cuando comenzamos a diseñar un sitio web hay que tener en cuenta ciertas variables como el público al cual va dirigido, las funciones que cumplirá, entonces la resolución en la que se piensa un sitio en muy importante. Existe un debate entre cual es la mejor resolución para un sitio, si 1366px o 1024px. Desde hace años se consideraba como estándar de diseño 1024x768px pero un estudi de StatCounter señala que en primer lugar de uso se encuentran las pantallas de 1366x768px(19,28%), en segundo lugar, descendiendo de un 41,8%(2009) a un 18,6%(2012). Aunque el diseñador debe tener un pensamiento flexible y con los cientos de resoluciones de pantallas existentes para móvil, tablet y escritorio. Pero si el sitio se decide hacer fijo es mejor que tenga un mayor alcance de público con una resolución que se aprecie en pantallas más pequeñas.

Interfaz resolución de 1024px

Cambio de Interfaz

Color

Coloresrgbsitio.jpg