Unidad 2

“Diseño y prototipado”

Mapas para evaluar el Saber

de la materia de experiencia de usuario
Técnico Superior Universitario o Ingeniería

En

Tecnologías de la información

Área Desarrollo de software multiplataforma.

Elaborado por:

Fabian Guadalupe Ibarra Carrizales

Maestro:

Patricia Guadalupe Mora Gonzalez

Ramos Arizpe, Coahuila 04/03/2022

1
Índice

Unidad 2 ............................................................................................................... 1

Introducción ............................................................................................................. 3

Desarrollo ................................................................................................................ 4

Conclusión............................................................................................................... 8

Bibliografía .............................................................................................................. 9

2
Introducción

En este documento se detallará con los diferentes mapas veremos las guías de
estilo su concepto asi como los diferentes elementos que la conforman para saber
asi a detallada cual es el significado este mismo.

También en este documento detallaremos las normativas de diseño tanto como son
el material desing y el cupertino tanto como su concepto y asi como sus
características abreviadas.

En si en este documento vemos los métodos de interacción que son unos métodos
que nos ayudara en UX para la mejor administración de este misma.

Por ultimo los métodos de navegación que vemos su definición y todas las que hay
diferentes que hay de esta misma.

3
 Guías de estilo.

Desarrollo

Elementos que integran una

Concepto Elementos parte 2
guía de estilo.

Es la definición de la Estilos de botones y/o Otros Cada sitio es distinto,

estructura del sitio, diseño elementos de navegación por lo que siempre incluimos
de página, tipografía y copia Define el uso combinado de un apartado adicional para
definida dentro de una las tipografías con la paleta entregar los detalles de
empresa. cromática. elementos específicos.

Paleta cromática Muestra Imágenes Esta sección

los colores principales del indica todos los tamaños y
sitio con todas sus posibles proporciones de imágenes
variaciones, ya sean usados en el sitio y cómo
patrones o tonos sólidos. conviven dentro del diseño.

Tipografías Es un listado de
los tipos de fuentes
presentes en el diseño web.
4
 Normativas de diseño

Material design Cupertino

Se usa para seleccionar un elemento

en una lista breve. Superfice
Es una normativa de diseño rectangular redondeada que se ve
enfocado en la visualización como una superficie de popup de iOS,
del sistema operativo Android, como es un diálogo de alerta o un
además en la web y en action sheet. Un segmented control
cualquier plataforma. estilo iOS. Usado para seleccionar de
forma mutuamente exclusiva opciones
en una lista horizontal.

Se trata del espacio en

3D, en el cual los objetos
tienen tres dimensiones: 5
la anchura, la altura y el
grosor.
6
7
Conclusión

En conclusión, las guías de estilo son muy importan antes de crear un proyecto ya
que estas nos ayudasen como seguir una estructura que nos pide una empresa asi
para evitar futuros problemas que las interfaces que sean rechazados por la
empresa.

Las normativas de diseño como su nombre lo dicen son normas de diseño para
diseñar de cierta manera para empatizar con el sistema o hacer más amigable el
sistema al usuario común o reciente en el software.

En estas hay el material desing que es más usado para Android par hacer mas
simple e intuitivo el sistema.

El Cupertino nos ayudara mucho para diseñar en sistema de IOS que tengo
entendido que es el mas recomendable para diseñar en sistema de IOS es simple
y redondeado.

Los mockups y wireframes nos ayudan para definir una estructura del front-end de
nuestro sistema y no ir sobre la marcha diseñando.

Para este mismo existen mí, es de herramientas que nos ayudara para este
propósito en particular solo hay que investigarlas un ejemplo seria ADOBE XD.

Los modelos de navegación nos ayudaran mucho para darle al usuario una mejor
navegación en sistema cada de estas unas que tiene esta misma tiene una función
y su finalidad.

8
Bibliografía
Guu00eda de estilo. (2020, August 26). Retrieved March 1, 2022, from AMVO |
Asociación Mexicana de Venta Online website:
https://www.amvo.org.mx/glosario/guia-de-
estilo/#:~:text=Es%20la%20definici%C3%B3n%20de%20la,definida%20dentro%2
0de%20una%20empresa.

¿Qué elementos debe incluir una guía de estilo de diseño web? (2015, October 28).
Retrieved March 1, 2022, from Blog IDA Chile | Estrategia para el éxito de tu negocio
website: https://blog.ida.cl/diseno/guia-de-estilo-diseno-web/

Material Design: ¿Qué es? | Next University. (2016, August 8). Retrieved March 1,
2022, from Blog | NextU LATAM website: https://www.nextu.com/blog/material-
design-que-es/

Qué es un wireframe para un sitio web. (2022). Retrieved March 2, 2022, from
Lucidchart website: https://www.lucidchart.com/pages/es/que-es-un-wireframe-
para-un-sitio-web

Diseño de Interacción - Ryte Digital Marketing Wiki. (2021). Retrieved March 2,

2022, from Ryte.com website:
https://es.ryte.com/wiki/Dise%C3%B1o_de_Interacci%C3%B3n

pablo. (2012, December 2). Modelos de navegación. Retrieved March 2, 2022, from
UX Lumen website: http://www.uxlumen.com/modelos-de-navegacion/