Post on 11-Mar-2016
description
transcript
PROYECTO WEB
arquitectura de la información
mapasweb
Home
Servicios
Portfolio
Identidad corporativa
Editorial
Web
Packaging
Fotografia
Grafica publicitaria
Zona acceso clientes
Los mapas de sitio pueden mejorar el posicionamiento en buscadores de un sitio, asegurándose que todas sus pági-nas puedan ser encontradas. También son una ayuda a la navegación por ofre-cer una vista general del contenido de un sitio de un simple vistazo.
012
34
3.13.23.33.43.53.6
4.1Clientes
Proceso de trabajo
arquitectura de la informacióncontenidos
Presentación de la empresa, filosofia, contacto...
Servicios que ofrece la empresa.
0
1.1
2
3
4.1
Fotografias e información del los trabajos realizados
agrupados por tipo del proyecto.
Proceso de trabajo de los proyectos realizados.
Zona de acceso para que los clientes puedan ver el
proceso de sus trabajos.
arquitectura de la información
estuctrurasposibles
3 Grupos de Usuarios de la web:
- Clientes- Profesionales- Estudiantes
Clientes
1er Nivel Zona clientes, Servicios, Portfolio
2o Nivel Empresa
Profesionales
1er Nivel Portfolio, Servicios, proceso trabajo
2o Nivel Empresa
Estudiantes
1er Nivel Portfolio y Servicios
2o Nivel Empresa
arquitectura de la informaciónempresa VSusuario
Necesidades empresaFidelizar clientes
Buscar nuevos clientes
Afianzarse en el sector
Necesidades usuarioInformación sobre los servicios ofrecidos
Información sobre trabajos realizados
Contacto con nuestra empresa
VS
aspectoscompetitivos
puntofuerte
El punto fuerte de mi pagina web será el proceso de trabajo que se lleva a cabo a la hora de hacer un proyecto. Como rasgo caracteristico los clientes tendrán acceso a ver el proceso de trabajo de sus proyectos mediante una zona de acceso a clientes que tendrán que estar registrados en la base de da-tos de la web. Para identificar al usuario necesita-mos una base de datos donde estarán los datos de cada cliente, asi como su login y contraseña.
Punto fuerte de la web:
Proceso de trabajo de los proyectos que se realizan en el estudio.
Diferencia competitiva:
Zona de acceso a clientes (base de da-tos) mediante sesiones de usuario
distribución de espaciosproporciones
- 60% configurados a 1024 x 768
- 17% configurados a 800 x 600
- Resto iguales o mayores a 1280 x 1024
Una de las preguntas más frecuentes al diseñar una web es ¿Cual es la mejor resolución? Respondiendo a esta cuestión actualmente:
Por tanto llegamos a la conclusión que la mejor resolu-ción es la de 1024 x 768 por tres razones fundamentales:
- Visibilidad inicial- Lectura fácil- Estética
960 px
usoScrool alinea-
ción
Horizontal
Vertical
Centrada
districuciónde espacios
tipologia web
Una web coorporativa está orientada a que mi empresa tenga una presencia notaria y de calidad en Internet
escaparatescomercio electrónico
Web coorporativa
foros portalesbuscadores
comunicaciónblog wikis
ocio
distribución de espaciosreticulas ymodulos
Grid Calculator es una herramienta que nos crea una retícula basada en un ta-maño de la letra, el número de colum-nas, el ancho de la columna y el ancho de medianil.
Al igual que en el diseño editorial el uso de reticulas es esencial para realizar un buen diseño.En este caso se realizará una reticula con estas ca-racteristicas.
- Fuente base: 12 px- Columnas: 12- Ancho columna: 69 px- Medianil: 12 px
districuciónde espaciosreticulas y
modulos
960 px
69 px
usoScrool
distribución de espaciosinterfaz
Claridad.
Concisión.
Familiaridad.
Sensibilidad.
o Rapidez de la interfaz.
o Buen feedback
Consistencia.
Estética.
Eficiencia.
Errores.
Estas son las cualidades mínimas a tener en cuenta en el desarrollo de una buena interfaz:
A continuación se detella la propuesta para GUI (in-terfaz de usuario) de nuestra web. La estrategia utilizada es crear un menú gráfico el cual te permite mediante un script moverte por el scrool según la sección. Por tanto toda la informa-ción estará en la misma pagina.
districuciónde espacios
bocetosGUI
HOMEIDENTIDAD
CORPORATIVA
FOTOGRAFIA
Proyecto 1
Proyecto 2
Proyecto 3
Proyecto 4
Proyecto 5
Proyecto 6Cliente: cliente
Fecha: 2010
sistema denavegaciónmenús ysubmenús
Tanto el menú principal como el submenu serán gráficos, mediante el uso de iconos.
Adjunto los iconos del menú. El color principal será el gris, al pasar el ratón por encima del icono este será diferente (naranja).
sistema denavegación
ayudas
Para ayudar al usuario a navegar por la web a cada icono del menú y del submenú le acompaña el nombre de la sección, asi reforzará a la imágen y no dará lugar a equivocaciones.
La tecnologia utilizada para realizar la pagina web para el estudio creativo deArte es:
- HTML 4.0
- CSS
- JavaScript
- PHP
- MySQL
tecnologia ylenguajes
uso delcolorgeneral
Naranja corporativo
R. 255G. 185B. 1
Gris claro
R. 194G. 194B. 194
Gris oscuro
R. 128G. 128B. 128
tipografiageneral
Para la tipograifa de la web se utilizan dos fami-
lias tipográficas bien diferenciadas:
Familia tipográfica Arial12 px
Nativa: para todas las masas de texto (informa-
ción de proyecto, formulario, etc).
*para titulos de proyecto se utiliza la versión
bold
Britannic Bold14 px
Rasterizada: para el menú y submenú.
Recursos gráficos
En el index de la pagina tenemos una presentación en Flash con la siguiente estructura:Las imágenes van pasando automaticamente pro-mocionando la empresa.
Menú alternativo
del portfolio
Promoción de la empresa
568 px
302 px