UNIVERSIDAD TECNOLGICA

DEL VALLE DEL MEZQUITAL

Aprender, Emprender, Transformar

Gua de Estilo

Hhu-Soft
Presentan:
Alejandro Hernndez Pea
Areli Cruz Simon
Anali Trejo Rubio

Asesor:
Ing. Mara de Lourdes Prez Ruiz

Revisores:
Jacobo de Jess Morales Aburto: Programacin en general
Alfredo Prez Gmez: Estructura del proyecto
Michelle Saldaa Tapia: Psicloga y Pedaggica

Hhu-Soft

1|Pgina

Contenido
El abanico de colores Hhu Soft.................................................................................................. 3
Descripcin de la paleta Bsica ....................................................................................................... 3
Descripcin de elementos ............................................................................................................... 5
Parmetros Visuales ........................................................................................................................ 6
Mapa de navegacin ....................................................................................................................... 7
Descripcin de elementos ............................................................................................................. 16
Elementos Externos....................................................................................................................... 20
Fuentes .......................................................................................................................................... 21

Hhu-Soft

2|Pgina

El abanico de colores Hhu Soft

Los colores que se muestran en la interfaz grfica as como los colores que se muestran en
los diferentes elementos del logo fueron seleccionados en base a una investigacin, la
cual refiere que los colores que los nios consideran atractivos son colores Vivos colores
luminosos, mas sim embargo se debe buscar mantener una estandarizacin dentro del
software. Por ello los colores primarios de la aplicacin son el azul, amarillo, verde caf,
rojo y rosa.

Descripcin de la paleta Bsica

Para la definicin de la paleta principal o paleta bsica del software se realiz con la ayuda de una
aplicacin web llamada Kuler, la funcin de este software es brindar un estndar y una correcta
combinacin de colores de acuerdo a las necesidades del usuario.
Los colores sugeridos por Kuler son: Verde, amarillo, rosa, azul y anaranjado.

Hhu-Soft

3|Pgina

Los colores mostrados anteriormente son sugerencia de la aplicacin web y cabe mencionar que
estos colores coinciden con la paleta establecida por Hhu Soft.
Colores Sugeridos por Kuler:
Verde:
RGB: 10-148-14

Anaranjado:
RGB: 249-89-21

Rojo:
RGB: 231-36-246

Amarillo:
RGB: 251-202-45

Azul:
RGB: 9-166-223

Hhu-Soft

4|Pgina

Descripcin de elementos
Todo software tiene elementos como botones, Labels o splash etc. Estos elementos deben regirse
bajo un estndar determinado, este estndar contempla ciertas caractersticas como tamao, tipo
y desde luego colores a utilizar, por ello en la siguiente tabla se muestran los elementos generales
estandarizados del software.
Elemento

Descripcin
Botn aceptar: Tiene la funcin de confirmar la ejecucin de determina
accin.
Botn detalles: este botn permite acceder a visualizador de progresos del
alumno

Botn Home: En cualquier parte del software donde se encuentre este

botn realizar la misma funcin, llevarlo a la pantalla anterior a la actual
excepcin si est en la pantalla principal, all el botn funciona para cerrar
el juego.
Diccionario: Botn para acceder al diccionario de Hhu Soft y esta
disponible desde cualquier zona del juego.

Logo del software puede encontrarse en varias zonas del juego

Logo de software este logo es poco comn encontrarlo dentro del juego
pero existe en determinadas zonas su uso est asignado a mostrarse en
documentos oficiales del proyecto.
Botn Guardar: Botn guardar generalmente aparece en las zonas donde
se est evaluando una actividad y su nico propsito es guardar su
progreso para consultas posteriores.
Botn sonido: se encuentra disponible solo si el contenido actual mostrado
posee pronunciacin, de ser as al pulsar sobre l nos mostrar la
pronunciacin del contenido mostrado.

Hhu-Soft

5|Pgina

Botn siguiente: permite mostrar el contenido que prosigue

Botn siguiente: permite mostrar el contenido que antecede

Parmetros Visuales
Los parmetros visuales hacen referencia a tamao de pantallas as como caractersticas de las
mismas, a continuacin se establece el estndar para los Frames del Hhu Soft.
Las dimensiones sugeridas para cada frame de la aplicacin son las siguientes:

600px

800px

Hhu-Soft

6|Pgina

As tambin para los mdulos se sugiere utilizar el siguiente fondo:

600px

800px
Para las secciones en donde se desarrollen actividades y juegos se debe utilizar el siguiente fondo.

600px

800px

Hhu-Soft

7|Pgina

Dentro del software existe un elemento denominado barra de controles este elemento puede
contener controles de avance y retroceso adems del diccionario, el botn guardar y el botn
home segn las necesidades de la actividad.

Las dimensiones de este elemento deben ser de 800 px X 90 px y siempre debe situarse en la
parte inferior de frame.
Los frames en Hhu Soft comparten caractersticas que garantizar un software consistente en
cuanto a interfaz grfica se refiere, por ello en la siguiente tabla se especifican las caractersticas
que deben contener todos los frames del software.
Caractersticas
Sebe ser tipo Undecorated
Debe estar centrado en la pantalla
No debe ser redimensionable
Debe ser opaco
La transparencia debe ser de .9f
Barra de tareas siempre debe aparecer el icono Hhu Soft
Opacidad en 1.0
Fuente: Tempus Tamao: Variable

Hhu-Soft

8|Pgina

Mapa de navegacin

Hhu-Soft

9|Pgina

Hhu-Soft

10 | P g i n a

Hhu-Soft

11 | P g i n a

Hhu-Soft

12 | P g i n a

Hhu-Soft

13 | P g i n a

Hhu-Soft

14 | P g i n a

Hhu-Soft

15 | P g i n a

Descripcin de elementos

Hhu-Soft

16 | P g i n a

Hhu-Soft

17 | P g i n a

Hhu-Soft

18 | P g i n a

Hhu-Soft

19 | P g i n a

Elementos Externos
Gua de estilo de la documentacin
Especificacin de logos
Estilo del CD
Estilo de manuales

Hhu-Soft

20 | P g i n a

Estilo de Paquetera

Fuentes
Poner Fuentes en APA
Kuler

Hhu-Soft

21 | P g i n a