GUIA DE ESTILO DEL PROYECTO Prosystem
Enviado por Josue Leobardo Hernandez Solis • 28 de Enero de 2020 • Trabajo • 506 Palabras (3 Páginas) • 154 Visitas
[pic 1][pic 2]
[pic 3]
GUIA DE ESTILO DEL PROYECTO
Prosystem
[pic 4][pic 5]
Índice
Introducción....................................................................................................... 3
Estructura de la interfaz.................................................................................... 4
Colores ............................................................................................................... 6
Tipografía ........................................................................................................... 8
Iconografía ......................................................................................................... 9
Imágenes .......................................................................................................... 10
Introducción
Esta guía de estilo principalmente va dirigida a todos los usuarios, que busquen un claro y breve ejemplo para que les pueda servir de apoyo, y puedan ver los puntos más relevantes de la guía de estilo.
La Guía de estilo del sitio web “Prosystem” tiene como objetivo establecer un marco de intervención controlado en su interfaz.
Porque la necesidad de una Guía de estilo, como su definición lo dice es un documento que contiene patrones básicos relacionados con el aspecto de una interfaz de nuevas pantallas en un entorno especifico.
El presente documento se divide en 5 partes fundamentales para la guía de estilo, las cuales son:
Estructura de la interfaz
En este apartado se muestra como está estructurada la aplicación web “Prosystem”, con el fin de visualizar cada parte que compone la interfaz de esta misma. La aplicación web es responsiva, por lo cual se puede adaptar a distintos tamaños de diferentes dispositivos.
Colores
En este apartado se muestran los colores que se utilizan en la aplicación web, que parten desde los colores primaros a los secundarios. Cada uno de los colores tiene una representación gráfica con su respectivo código RGB y el nombre de cada color.
Tipografía
Se muestran los diferentes estilos o tipos de letras que se emplearon para la realización del diseño de la interfaz.
Iconografía
Se muestra el conjunto de imágenes relacionadas con la aplicación web, es decir los iconos que representan un apartado en la aplicación, cuya finalidad es facilitar el uso de esta misma.
Imágenes
Se describe cada una de las imágenes como el tamaño, su ubicación en la interfaz y una breve descripción.
Estructura de interfaz
[pic 6]
COLORES
[pic 7]
[pic 8]
El color #FF7600 se usa: Para los botones.
El color #EEEEEE se usa: En la barra superior donde se encuentra el teléfono y el correo electrónico
El color #FFFFFF se usa: Como color de fondo, es el background este es uno de los colores principales.
El color #333333 se usa: Como fondo en algunos iconos.
El color #8996ª0 se usa: De fondo del pie de página.
...