UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE

CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

GUÍA PARA LAS PRÁCTICAS DE LABORATORIO, TALLER O CAMPO

Investigación Human-Computer PERIODO MARZO – JULIO
ASIGNATURA: NIVEL: 4
Interaction LECTIVO: 2019
DOCENTE: Verónica Martínez NRC: 4333 PRÁCTICA N°: 2
LABORATORIO DONDE SE DESARROLLARÁ LA
LABORATORIO 04 DE CIENCIAS DE LA COMPUTACIÓN
PRÁCTICA:
TEMA DE LA Lab 02 – Realizar un PROTOTIPO de su proyecto o tema, usando herramientas de prototipado de HCI (Etapas de UDC Diseño
PRÁCTICA: centrado en el usuario) considerando las reglas de oro, el UDC y UX.
INTRODUCCIÓN:
Fundamentación Teórica:
Human-Computer Interaction

OBJETIVOS:
1. Conocer la funcionalidad y el uso de las herramientas de prototipos de HCI
MATERIALES:
EQUIPOS: CANTIDAD
- Computadora con acceso a Internet 26
INSTRUCCIONES:
● Lea previamente la práctica a desarrollar
● Verifique que los materiales, equipos y sitio de trabajo estén en buenas condiciones.
● Realice la práctica y anote los pasos realizados y datos obtenidos.
● Entregue sus equipos y sitio de trabajo adecuadamente.
ACTIVIDADES POR DESARROLLAR:
Realización:

1. Consultar o investigar herramientas de prototipado y aplicar en su proyecto.

RESULTADOS OBTENIDOS:

Nombre del estudiante: Adonnis Carguacundo

Nivel: 4to TIC
Paralelo: “A”
Fecha: 20/04/19

Herramientas de prototipo
Los prototipos son una parte integral del proceso de diseño, ya que permiten la revisión de los conceptos
básicos del proyecto en la etapa inicial de su desarrollo y compartir opiniones con el resto del equipo. Gracias
a ellos puedes crear fácilmente una maqueta interactiva de un sitio web o aplicación móvil, que es capaz de
identificar cualquier deficiencia en el flujo y la usabilidad del diseño antes de invertir demasiado tiempo ni
dinero en su desarrollo.
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Es importante, cuando comenzamos un proyecto, que el primer paso sea establecer una jerarquía en la
información y el contenido para poder trasladarlo visualmente. De esta manera nuestro cliente podrá
entenderlo y hacerse una idea de cómo estará estructurado en un futuro. Para ello hemos recopilado 17
herramientas de prototipado para dar a conocer tu aplicación y saber cuál es la experiencia del usuario al
navegar a través de las diferentes pantallas (Crua, 2018).
A continuación mencionaré tres herramientas de prototipado para el desarrollo de aplicaciones móviles o
aplicaciones de software las cuales son necesarias para el desarrollo en HCI.
Justinmind
Justinmind es una herramienta de prototipado de sitios web, aplicaciones software y aplicaciones móviles
que puede trabajar tanto con Windows como con Mac o también con iOs y Android. Existe una versión
gratuita con la que puedes trabajar bastante bien aunque el precio de la versión Pro no es muy elevado.
In Vision
In Vision ha supuesto una revolución no solo en el mercado de las herramientas de prototipado sino
también de gestión de un proyecto en general, desde las fases de creación de los mockups hasta el final del
desarrollo. El valor que la distingue de otras herramientas es que es muy intuitiva tanto para el diseñador que
la está utilizando como para el cliente.
Origami
Origami es una herramienta de creación de prototipos cuya propiedad es de Facebook y se utilizó para crear
las maquetas de varias aplicaciones como Instagram, Messenger y Paper. Aunque se usa principalmente para
aplicaciones de iOS gracias a su integración con Apple Quartz Composer, Origami también es compatible al
desarrollo de prototipos interactivos en Android.
Ejemplo de un tema de interés.
A continuación desarrollaré por medio del programa Justinmind una aplicación móvil de mensajería la
cual es de mi interés.
Consistencia:
En este apartado se puede observar una composición de color, estilo y fuentes homogéneas a lo largo del interfaz
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Usabilidad Universal:
En este apartado se puede observar realizar la interacción entre la persona, el contexto, las tareas por realizar y la usabilidad que
se desarrollará en la app
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Realimentación:
En este apartado se hará desarrolló el apartado de error, pues si no ingresamos los campos necesarios que son en este caso
nombre y contraseña no podremos ingresar a la app, a continuación se mostrará lo que acabamos de mencionar
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Conducir las tareas:

En este apartado se dará a conocer el ingreso a la app llenando los campos anteriormente mencionados (nombre y contraseña), en
donde nos mostrará un mensaje de que hemos avanzado a la siguiente interfaz.
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Deshacer acciones:
En este apartado se realiza el control de eliminar acciones sencillas que nos hemos equivocado, en este caso eliminamos un
contacto que no nos sirve.
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Prevenir errores:
Mediante este interfaz se muestra un mensaje que indica al usuario que el apartado en el que quiere ingresar es erróneo, pues se
encuentra en mantenimiento o simplemente dejó de funcionar.
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Locus de control interno:

Mediante este apartado se muestra que tanto el usuario como la app cuentan con una interacción entre si mismo, haciendo que el
usuario cuente con el dominio absoluto de la app.
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

Reducir memoria:
Mediante este apartado se menciona la regla del “siete más/menos dos”, el cual indica que las interfaces de usuario deberían
liberar al usuario de la necesidad de aprender excesivos datos a corto plazo para su inmediato. Como observaremos en la
siguiente foto, simplemente nos damos cuenta que la interfaz es sencilla de entender, pues no es más que enviar mensajes.
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

PREGUNTAS:
A.- ¿Qué es un prototipo o prototipado?
Los prototipos o prototipado nos sirvan para realizar maquetas interactivas para desarrollar sitios webs o aplicaciones
B.- ¿Qué son y para qué sirven las herramientas de prototipado?
Las herramientas de prototipo nos permiten trabajar de manera sencilla dos partes principales, las cuales son los paneles
dinámicos y los eventos. En el apartado de paneles dinámicos simplemente permite colocar varios elementos en la misma área,
mientras que los eventos permiten indicar acciones sobre los elementos que insertemos en nuestro diseño.
B.- Mencione 5 herramientas de prototipado:
 UNIVERSIDAD DE LAS FUERZAS ARMADAS – ESPE
CÓDIGO: SGC.DI.505
VERSIÓN: 1.0
DEPARTAMENTO DE CIENCIAS DE LA COMPUTACIÓN FECHA ULTIMA
REVISIÓN: 26/10/16

CARRERA: INGENIERIA EN TECNOLOGIAS DE LA INFORMACIÓN

 Justinmind.
 In Vision.
 Origami.
 Proto.io.
 Fluid.

C.- Explique la herramienta de prototipado que escogió para su proyecto o tema, mencione su experiencia de uso:
He usado Justinmind. Como vengo comentando, justinmid es una plataforma para desarrollar herramientas de prototipado de sitios
webs, podemos trabajar tanto como Windows, mac o también iOs y Android. Este apartado se desarrolla en dos aspectos, los
cuales son el apartado de paneles dinámicos simplemente permite colocar varios elementos en la misma área, mientras que los
eventos permiten indicar acciones sobre los elementos que insertemos en nuestro diseño.

CONCLUSIONES:
Mediante este laboratorio desarrollado en el aula y en casa, conocemos que el programa Justinmind es un programa el cual es
muy útil para desarrollar prototipado.
El prototipado simplemente es un modelo que sirve como representación o simulación del producto final y que nos permite verificar
el diseño y confirmar que cuenta con las características específicas planteadas.

RECOMENDACIONES:

 Comprender las reglas de oro.

 Entender los componentes que tiene el programa Justinmind.
 Dominar el tema.

BIBLIOGRAFÍA:

FIRMAS

F: …………………………………………. F: ……………………………………………..
F: ………………………………………. ING. DANIEL NUÑEZ ING. CRISTIAN CORONEL
ING. VERÓNICA MARTÍNEZ C. COORDINADOR DE ÁREA DE COORDINADOR DE LABORATORIOS
DOCENTE CONOCIMIENTO