SlideShare ist ein Scribd-Unternehmen logo
Interfaces
gráficas de
usuario (GUI)
Alberto Elena, Bryan Josué. AE210567
Lebrón Flores, Ivania María. LF212591
Montano González, Fernando Josué. MG210111
Munguía Villacorta, Luciana María. MV210941
Velásquez Joyar, Andrea Guadalupe.
VJ210576
Integrantes
2
¿Qué es la GUI?
Es una interfaz la cual facilita al usuario la
comunicación que tiene con un debido
programa, esto es, visto de otra forma, la
comunicación entre el usuario y la máquina,
la principal funcionalidad de una interfaz
gráfica de usuario, estos se pueden utilizar
para manipular de la mejor manera
computadoras, tabletas, celulares, estos por
lo general, se apoyan de elementos gráficos
como podrían ser los íconos, de esta forma
se le da un mayor realce a lo que está
ocurriendo.
CLI
Antecedentes
Los usuarios se sentaban frente
a una computadora y lo que
veían era una pantalla blanca, y
un espacio donde ingresar un
comando que debían aprenderse
01
No gráfica orientada
a menús
Le permitía al usuario interactuar
con el mouse en lugar de tener
que escribir comandos en el
teclado.
02
GUI
Contienen un menú, iconos y
el proceso de apuntar y
hacer clic con un mouse,
para brindar una mejor
experiencia de usuario
03
3
Apple
Macintosh
Paradigmas para las GUI
“Computadora para todos”.
Introdujo el primer menú, iconos y el proceso de
apuntar y hacer clic con un mouse.
Limitaba a los usuarios con respuestas
contextuales
01
IBM-SAA
Sistema completo de interfaces que puede
abarcar maquinas desde computadoras
personales hasta centrales.
Serie de suites con herramientas de
networking y bases de datos.
Todas las acciones podían ser ejecutadas
desde el teclado
02
4
5
Funcionamiento de
las GUI
Su funcionamiento principal es que esta sirve de
intermediaria entre el usuario y el sistema, ya que a
través de distintos componentes gráficos los cuales
están dirigidos a crear un entorno sencillo y fácil de
navegar para el usuario, esta presenta información y
recibe las acciones y solicitudes del usuario, para
luego poder enviarlas a la capa de procesamiento.
6
Componentes de la GUI
Cuadros de texto
Casillas de
verificación
Controles deslizables y
botones
aumentar/disminuir.
Cuadros de diálogo con
controles en pestañas
Botones de
opción
Cuadros de lista y
de lista
desplegable
Botones de comando
Áreas de texto
Mapas de imagen
Cuadros de
mensaje
Requisitos por cumplir
7
Consistencia
Todos los elementos que se utilicen
deben ser consistentes entre sí y estar
orientados a un objetivo y una función
Diseño y tipografía
Ayuda al usuario a ubicarse en la
interfaz con ayuda de colores, textos,
íconos, entre otros.
Mantener la simplicidad
Elementos simples y fáciles de
comprender, y evitar los elementos
innecesarios de diseño
Diseño orientado a un
objetivo
Cada elemento que se vaya a usar debe
tener una función definida y la interfaz
debe estar bien estructurada según lo que
se necesite.
Actualizaciones de
usuario
Una interfaz debe informar sobre
errores o cambios en el estado.
8
Ejemplos
Interfaz gráfica de Windows.
9
Ejemplos
Interfaz gráfica de Amazon.
Tipos de interfaces de usuario
10
CLI
Una interfaz de línea de
comandos es una interfaz de
usuario basada en texto,
suele ser implementado para
enviar instrucciones o tareas
específicas a una
computadora, esta es
estática, directa y sin mayor
complejidad.
● Codificada
● Estricta
GUI
Interfaz gráfica de usuario
que utiliza distintos
componentes gráficos, como
imágenes, botones, etc., para
crear un entorno visualmente
atractivo, en lugar se ser solo
una visualización de texto.
Suele ser dinámica,
responsiva, receptiva y fácil
de explorar.
● Metafórica
● Exploratoria
NUI
La interfaz natural de usuario
busca sentirse lo más
“natural” al usuario posible, no
utiliza sistemas de mando o
dispositivos de entrada como
clics, en su
lugar se utilizan movimientos
gestuales, como pueden ser
las yemas de los dedos en una
pantalla táctil.
● Directa
● Intuitiva
11
Preguntas
1) ¿Cuál es el significado de GUI?
2) ¿Cuáles son los componentes de una GUI?
3) ¿Por qué una Interfaz Gráfica de Usuario debe mantener la
simplicidad?
4) ¿Cuáles son los tipos de interfaces de usuario?
5) ¿En qué ocasiones se recomienda utilizar la interfaz CLI?

Weitere ähnliche Inhalte

Ähnlich wie GUI ADS.pptx

El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
CristianJose15
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
CristianJose15
 
Interfaz de usuario
Interfaz de usuario Interfaz de usuario
Interfaz de usuario
Iván Torres
 
2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx
Ram Vazquez
 
DHTIC Interfaz de Usuario
DHTIC Interfaz de UsuarioDHTIC Interfaz de Usuario
DHTIC Interfaz de Usuario
Jesus Garcia Licona
 
Interfaz Usuario
Interfaz UsuarioInterfaz Usuario
Interfaz Usuario
taninof
 
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de UsuarioTopicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
José Antonio Sandoval Acosta
 
GUI#2
GUI#2GUI#2
Interfaz gráfica
Interfaz gráficaInterfaz gráfica
Interfaz gráfica
marualexandra
 
Interfaz Gráfica de Usuario
Interfaz Gráfica de UsuarioInterfaz Gráfica de Usuario
Interfaz Gráfica de Usuario
LucasDanielB
 
Interfases gui
Interfases guiInterfases gui
Interfases gui
pableus232323
 
Actividad Harold Alonso Garces Crisanto PowerShell.docx
Actividad Harold Alonso Garces Crisanto PowerShell.docxActividad Harold Alonso Garces Crisanto PowerShell.docx
Actividad Harold Alonso Garces Crisanto PowerShell.docx
haroldalonsogarcescr
 
MI OVA.pptx
MI OVA.pptxMI OVA.pptx
Clase 04 diseno_ui
Clase 04 diseno_uiClase 04 diseno_ui
Clase 04 diseno_ui
Demián Gutierrez
 
MI OVA.pdf
MI OVA.pdfMI OVA.pdf
Diseño de interfaces centradas en el usuario
Diseño de interfaces centradas en el usuarioDiseño de interfaces centradas en el usuario
Diseño de interfaces centradas en el usuario
Elizabeth Regina Palacios Penna
 
Interfaces gráficas de usuario
Interfaces gráficas de usuarioInterfaces gráficas de usuario
Interfaces gráficas de usuario
David Fernández Puentes
 
Tópicos Avanzados de Programación - Unidad 1 GUI
Tópicos Avanzados de Programación - Unidad 1 GUITópicos Avanzados de Programación - Unidad 1 GUI
Tópicos Avanzados de Programación - Unidad 1 GUI
José Antonio Sandoval Acosta
 
Interfaz gráfica de usuario 2015-2016
Interfaz gráfica de usuario 2015-2016Interfaz gráfica de usuario 2015-2016
TrAbAjO dE iNvEtIsGaCiOn
TrAbAjO dE iNvEtIsGaCiOnTrAbAjO dE iNvEtIsGaCiOn
TrAbAjO dE iNvEtIsGaCiOn
pableus232323
 

Ähnlich wie GUI ADS.pptx (20)

El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
 
Interfaz de usuario
Interfaz de usuario Interfaz de usuario
Interfaz de usuario
 
2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx
 
DHTIC Interfaz de Usuario
DHTIC Interfaz de UsuarioDHTIC Interfaz de Usuario
DHTIC Interfaz de Usuario
 
Interfaz Usuario
Interfaz UsuarioInterfaz Usuario
Interfaz Usuario
 
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de UsuarioTopicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
 
GUI#2
GUI#2GUI#2
GUI#2
 
Interfaz gráfica
Interfaz gráficaInterfaz gráfica
Interfaz gráfica
 
Interfaz Gráfica de Usuario
Interfaz Gráfica de UsuarioInterfaz Gráfica de Usuario
Interfaz Gráfica de Usuario
 
Interfases gui
Interfases guiInterfases gui
Interfases gui
 
Actividad Harold Alonso Garces Crisanto PowerShell.docx
Actividad Harold Alonso Garces Crisanto PowerShell.docxActividad Harold Alonso Garces Crisanto PowerShell.docx
Actividad Harold Alonso Garces Crisanto PowerShell.docx
 
MI OVA.pptx
MI OVA.pptxMI OVA.pptx
MI OVA.pptx
 
Clase 04 diseno_ui
Clase 04 diseno_uiClase 04 diseno_ui
Clase 04 diseno_ui
 
MI OVA.pdf
MI OVA.pdfMI OVA.pdf
MI OVA.pdf
 
Diseño de interfaces centradas en el usuario
Diseño de interfaces centradas en el usuarioDiseño de interfaces centradas en el usuario
Diseño de interfaces centradas en el usuario
 
Interfaces gráficas de usuario
Interfaces gráficas de usuarioInterfaces gráficas de usuario
Interfaces gráficas de usuario
 
Tópicos Avanzados de Programación - Unidad 1 GUI
Tópicos Avanzados de Programación - Unidad 1 GUITópicos Avanzados de Programación - Unidad 1 GUI
Tópicos Avanzados de Programación - Unidad 1 GUI
 
Interfaz gráfica de usuario 2015-2016
Interfaz gráfica de usuario 2015-2016Interfaz gráfica de usuario 2015-2016
Interfaz gráfica de usuario 2015-2016
 
TrAbAjO dE iNvEtIsGaCiOn
TrAbAjO dE iNvEtIsGaCiOnTrAbAjO dE iNvEtIsGaCiOn
TrAbAjO dE iNvEtIsGaCiOn
 

Kürzlich hochgeladen

TARJETA MADRE DE DAYRON FABRI RUIZ-1.pptx
TARJETA MADRE DE DAYRON FABRI RUIZ-1.pptxTARJETA MADRE DE DAYRON FABRI RUIZ-1.pptx
TARJETA MADRE DE DAYRON FABRI RUIZ-1.pptx
dayronfabricioruizmo
 
herramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcel
herramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcelherramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcel
herramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcel
Eduardo455921
 
Introduccion al Lenguaje de Programación C++
Introduccion al Lenguaje de Programación  C++Introduccion al Lenguaje de Programación  C++
Introduccion al Lenguaje de Programación C++
PaulDelgadoSoto
 
primer manual de nuestra compañía de soporte
primer manual de nuestra compañía de soporteprimer manual de nuestra compañía de soporte
primer manual de nuestra compañía de soporte
eliersin13
 
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
micarnavaltupatrimon
 
DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.
DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.
DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.
Maria Celeste Trujillo Cruz
 
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
micarnavaltupatrimon
 

Kürzlich hochgeladen (7)

TARJETA MADRE DE DAYRON FABRI RUIZ-1.pptx
TARJETA MADRE DE DAYRON FABRI RUIZ-1.pptxTARJETA MADRE DE DAYRON FABRI RUIZ-1.pptx
TARJETA MADRE DE DAYRON FABRI RUIZ-1.pptx
 
herramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcel
herramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcelherramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcel
herramientaswebpdfwww.edu.pe.edu.institutoluisevalcarcel
 
Introduccion al Lenguaje de Programación C++
Introduccion al Lenguaje de Programación  C++Introduccion al Lenguaje de Programación  C++
Introduccion al Lenguaje de Programación C++
 
primer manual de nuestra compañía de soporte
primer manual de nuestra compañía de soporteprimer manual de nuestra compañía de soporte
primer manual de nuestra compañía de soporte
 
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
 
DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.
DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.
DIAPOSITIVA DE LA MEMORIA RAM.PPXT.-MARIATRUJILLO.
 
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
Mi Carnaval, Aplicación web para la gestión del carnaval y la predicción basa...
 

GUI ADS.pptx

  • 1. Interfaces gráficas de usuario (GUI) Alberto Elena, Bryan Josué. AE210567 Lebrón Flores, Ivania María. LF212591 Montano González, Fernando Josué. MG210111 Munguía Villacorta, Luciana María. MV210941 Velásquez Joyar, Andrea Guadalupe. VJ210576 Integrantes
  • 2. 2 ¿Qué es la GUI? Es una interfaz la cual facilita al usuario la comunicación que tiene con un debido programa, esto es, visto de otra forma, la comunicación entre el usuario y la máquina, la principal funcionalidad de una interfaz gráfica de usuario, estos se pueden utilizar para manipular de la mejor manera computadoras, tabletas, celulares, estos por lo general, se apoyan de elementos gráficos como podrían ser los íconos, de esta forma se le da un mayor realce a lo que está ocurriendo.
  • 3. CLI Antecedentes Los usuarios se sentaban frente a una computadora y lo que veían era una pantalla blanca, y un espacio donde ingresar un comando que debían aprenderse 01 No gráfica orientada a menús Le permitía al usuario interactuar con el mouse en lugar de tener que escribir comandos en el teclado. 02 GUI Contienen un menú, iconos y el proceso de apuntar y hacer clic con un mouse, para brindar una mejor experiencia de usuario 03 3
  • 4. Apple Macintosh Paradigmas para las GUI “Computadora para todos”. Introdujo el primer menú, iconos y el proceso de apuntar y hacer clic con un mouse. Limitaba a los usuarios con respuestas contextuales 01 IBM-SAA Sistema completo de interfaces que puede abarcar maquinas desde computadoras personales hasta centrales. Serie de suites con herramientas de networking y bases de datos. Todas las acciones podían ser ejecutadas desde el teclado 02 4
  • 5. 5 Funcionamiento de las GUI Su funcionamiento principal es que esta sirve de intermediaria entre el usuario y el sistema, ya que a través de distintos componentes gráficos los cuales están dirigidos a crear un entorno sencillo y fácil de navegar para el usuario, esta presenta información y recibe las acciones y solicitudes del usuario, para luego poder enviarlas a la capa de procesamiento.
  • 6. 6 Componentes de la GUI Cuadros de texto Casillas de verificación Controles deslizables y botones aumentar/disminuir. Cuadros de diálogo con controles en pestañas Botones de opción Cuadros de lista y de lista desplegable Botones de comando Áreas de texto Mapas de imagen Cuadros de mensaje
  • 7. Requisitos por cumplir 7 Consistencia Todos los elementos que se utilicen deben ser consistentes entre sí y estar orientados a un objetivo y una función Diseño y tipografía Ayuda al usuario a ubicarse en la interfaz con ayuda de colores, textos, íconos, entre otros. Mantener la simplicidad Elementos simples y fáciles de comprender, y evitar los elementos innecesarios de diseño Diseño orientado a un objetivo Cada elemento que se vaya a usar debe tener una función definida y la interfaz debe estar bien estructurada según lo que se necesite. Actualizaciones de usuario Una interfaz debe informar sobre errores o cambios en el estado.
  • 10. Tipos de interfaces de usuario 10 CLI Una interfaz de línea de comandos es una interfaz de usuario basada en texto, suele ser implementado para enviar instrucciones o tareas específicas a una computadora, esta es estática, directa y sin mayor complejidad. ● Codificada ● Estricta GUI Interfaz gráfica de usuario que utiliza distintos componentes gráficos, como imágenes, botones, etc., para crear un entorno visualmente atractivo, en lugar se ser solo una visualización de texto. Suele ser dinámica, responsiva, receptiva y fácil de explorar. ● Metafórica ● Exploratoria NUI La interfaz natural de usuario busca sentirse lo más “natural” al usuario posible, no utiliza sistemas de mando o dispositivos de entrada como clics, en su lugar se utilizan movimientos gestuales, como pueden ser las yemas de los dedos en una pantalla táctil. ● Directa ● Intuitiva
  • 11. 11 Preguntas 1) ¿Cuál es el significado de GUI? 2) ¿Cuáles son los componentes de una GUI? 3) ¿Por qué una Interfaz Gráfica de Usuario debe mantener la simplicidad? 4) ¿Cuáles son los tipos de interfaces de usuario? 5) ¿En qué ocasiones se recomienda utilizar la interfaz CLI?