Diferencia entre revisiones de «Portafolio Web / Paulina Buvinic»
Sin resumen de edición |
|||
| (No se muestran 9 ediciones intermedias del mismo usuario) | |||
| Línea 35: | Línea 35: | ||
Se quiere trabajar bajo un diseño minimalista, en donde lo más importante sean las imágenes, ya que se considera lo relevante para un diseñador. | Se quiere trabajar bajo un diseño minimalista, en donde lo más importante sean las imágenes, ya que se considera lo relevante para un diseñador. | ||
Así, se sigue el ejemplo de una barra lateral fija, la cual sirva como menu navegador, para facilitarle al usuario la navegación dentro del sitio. | Así, se sigue el ejemplo de una barra lateral fija, la cual sirva como menu navegador, para facilitarle al usuario la navegación dentro del sitio. | ||
<gallery> | <gallery> | ||
| Línea 49: | Línea 48: | ||
Se mantiene la proposición de la barra lateral, pero se cambia el sentido del scroll de los contenidos. De esta forma, se considera que se saca un mayor provecho en el uso de la barra lateral, ya que diagrama la página entera de forma horizontal, ya que los contenidos se entrelazan con ella debido a su transparencia. | Se mantiene la proposición de la barra lateral, pero se cambia el sentido del scroll de los contenidos. De esta forma, se considera que se saca un mayor provecho en el uso de la barra lateral, ya que diagrama la página entera de forma horizontal, ya que los contenidos se entrelazan con ella debido a su transparencia. | ||
<gallery> | |||
Image:1. Home.png|Home "Paulina Buvinic / Diseño Gráfico" | |||
Image:2. Home (hover categoría).png|Hover categoría "Proyectos" | |||
Image:3. Categoría.png|Contenido categoría "Proyectos" | |||
Image:4. Categoría (hover item).png|Hover subcategoría "Cubos luminosos" | |||
Image:5. Proyecto.png|Contenido subcategoría "Cubos luminosos" | |||
Image:5. Proyecto scroll final.png|Subcategoría "Cubos luminosos" scroll final | |||
Image: 5. Proyecto scroll final (hover).png|Hover Subcategoría "Cubos luminosos" scroll final | |||
Image:6.About.png|Página de Perfil, Información del autor | |||
</gallery> | |||
===HTML y CSS=== | ===HTML y CSS=== | ||
Primer acercamiento: http://dl.dropbox.com/u/50990529/pbuvinic.html | |||
'''Propuesta Final:''' https://dl.dropboxusercontent.com/u/50990529/Portafolio/index.html | |||
===Sitios de referencia=== | |||
Debido a que es el primer acercamiento que se tiene con HTML, se buscaron distintos sitios que sirvieron de inspiración y de referencia para poder realizar el portafolio. | |||
http://www.heredesign.co.uk/ | |||
http://alexandermunk.com/index.php?/news/kontakt/ | |||
http://www.ignaciomacri.com/logos/heads.html | |||
Revisión actual - 03:56 26 abr 2013
| Título | Portafolio Web |
|---|---|
| Tipo de Proyecto | Proyecto de Curso |
| Período | 2013-2013 |
| Asignatura | Taller de Diseño Gráfico 7ª Etapa, |
| Del Curso | 4º DG 2013, |
| Carreras | Diseñ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) | Paulina Buvinic |
| Profesor | Katherine Exss |
Creación de un Portafolio Web
Luego de haber estudiado y llevado a la práctica los conceptos teóricos de Arquitectura de Información y Wayfinding, se inicia un proyecto personal en donde se busca la realización de un Sitio Web con el fin de presentar el portafolio de cada alumno.
La selección de contenidos para el sitio nace de la idea de no tener que presentar la totalidad de los trabajos realizados, sino que se lleva a cabo una selección. Junto con esto, se busca destacar los proyectos en sí, utilizando fotografías de gran tamaño y poco texto explicativo, con el fin de no obligar al usuario a leer grandes fragmentos de texto, ya que la propia imagen puede llamar su atención.
Archivo:I Mapa de Navegación Portafolio.jpg
Wireframe
Home "Paulina Buvinic / Diseño Gráfico"
Selección categoría "Proyectos"
Contenido subcategoría "Serie edición en cubos"
Página de Perfil, Información del autor
Diseño de Interfaz
Propuesta I
Se quiere trabajar bajo un diseño minimalista, en donde lo más importante sean las imágenes, ya que se considera lo relevante para un diseñador. Así, se sigue el ejemplo de una barra lateral fija, la cual sirva como menu navegador, para facilitarle al usuario la navegación dentro del sitio.
Home "Paulina Buvinic / Diseño Gráfico"
Selección Categoría "Proyectos"
Contenido sub-categoría "Serie edición en cubos"
Ejemplo de scroll subcategoría
Ejemplo de scroll subcategoría
Página de Perfil, Información del autor
Propuesta II
Se mantiene la proposición de la barra lateral, pero se cambia el sentido del scroll de los contenidos. De esta forma, se considera que se saca un mayor provecho en el uso de la barra lateral, ya que diagrama la página entera de forma horizontal, ya que los contenidos se entrelazan con ella debido a su transparencia.
Home "Paulina Buvinic / Diseño Gráfico"
- 2. Home (hover categoría).png
Hover categoría "Proyectos"
- 3. Categoría.png
Contenido categoría "Proyectos"
- 4. Categoría (hover item).png
Hover subcategoría "Cubos luminosos"
Contenido subcategoría "Cubos luminosos"
Subcategoría "Cubos luminosos" scroll final
Hover Subcategoría "Cubos luminosos" scroll final
Página de Perfil, Información del autor
.png)
HTML y CSS
Primer acercamiento: http://dl.dropbox.com/u/50990529/pbuvinic.html
Propuesta Final: https://dl.dropboxusercontent.com/u/50990529/Portafolio/index.html
Sitios de referencia
Debido a que es el primer acercamiento que se tiene con HTML, se buscaron distintos sitios que sirvieron de inspiración y de referencia para poder realizar el portafolio.
