Portafolio Web: Simón Sandoval
| Título | Portafolio Web |
|---|---|
| Tipo de Proyecto | Proyecto de Taller |
| Período | 2013-2013 |
| Asignatura | Diseño Gráfico, |
| 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) | Simón Sandoval |
| Profesor | Katherine Exss |
Portafolio Web
A continuación se expone el proceso creativo de un Portafolio Web de carácter propio, es decir, en él se expone nuestro quehacer como diseñadores gráficos. Esto conlleva la realización de distintas etapas: [1] Argumento creativo del sitio, [2] Creación de Mapa de Navegación, [3] Diseño de Wireframes, [4] Diseño de Interfaz y [5] Codificación de Html y CSS.
1. Argumento creativo del sitio
El sitio nace desde la perspectiva de mostrar el trabajo realizado en dos áreas: la fotografía y el diseño gráfico, siendo estos los principales distritos del sitio. Junto con esto, se considera esencial la imagen y su tamaño e importancia dentro del sitio.
Archivo:Mapa de Navegación.pdf
3. Diseño de Wireframes
Estos corresponden a la capa objetiva del diseño, aquella que distribuye los espacios y diagrama los contenidos, previamente determinados por el mapa de navegación.
Primera Versión
-
(1)Home -
(2)Home: Seleccionar menú -
(3)About me -
(4)Seleccionar Photography -
(5)Photography -
(6)Photography(elegir) -
(7)Photography Color -
(8)Lightbox Photography -
(9)Seleccionar G.Design -
(10)G.Design -
(11)G.Design(elegir) -
(12)G.Design Proyects -
(13)G.Design(elegir) -
(14)G.Design elegido
.png)
Versión Definitiva
-
(1)Home -
(2)Acerca de mí
-
(3)Fotografía
-
(4)Fotografía: Hover
-
(5)Fotografía Interior
-
(6)Fotografía Sub-interior
-
(7)Diseño Gráfico
-
(8)D.Gráfico: Hover
-
(9)D.Gráfico Interior
-
(9)D.Gráfico Sub-interior A
-
(9)D.Gráfico Sub-interior B
4. Diseño de Interfaz
Estos corresponden a la capa emocional del diseño, aquella que le otorga los estilos al sitio: en cuanto a tipografía, imágenes, uso de color y/o tonos, entre muchos otros.
Primera Versión
-
(1)Home
-
(2)Home, seleccionar menú
-
(3)About me
-
(4)Photography(seleccionar)
-
(5)Photography
-
(6)Photography(elegir)
-
(7)Photography Gray
-
(8)Photography Color
-
(9)P. Color(elegir)
-
(10)Lightbox P. Color
-
(11)G.Design(seleccionar)
-
(12)G.Design
-
(13)G.Design(elegir)
-
(14)G.Design Draws
-
(15)G.Design Investigation
-
(16)G.Design Proyects
-
(17)G.Design Proyects(elegir)
-
(18)G.Design Proyects elegido
Archivo:Presentación Diseño Portafolio Digital.pdf
Versión Definitiva
-
(1)Home -
(2)Acerca de mí
-
(3)Fotografía
-
(4)Fotografía: Hover
-
(5)Fotografía Interior
-
(6)Fotografía Sub-interior
-
(7)D. Gráfico
-
(8)D. Gráfico: Hover
-
(9)D. Gráfico Interior
-
(10)D. Gráfico Sub-interior A
-
(11)D. Gráfico Sub-interior B
5. Codificación de Html y CSS
Luego de finalizada la etapa de Diseño, se deben plasmar todas las pantallas en la web a través de dos plataformas: Html, en el cual se encuentra todo el contenido del sitio (diseñado) y el CSS, que contiene el diseño de ese contenido, es decir, estilos tipográficos, de imagen, botones, entre otros.
Link: https://dl.dropboxusercontent.com/u/37092362/Proyecto%20Portafolio/simonsandoval.html
.png){kind=link}
