SlideShare una empresa de Scribd logo
1 de 6
Descargar para leer sin conexión
Interfaz de usuario

• Originalmente el termino interfaz surgió para
  referirse al trabajo realizado por algunos
  especialistas que construían aplicaciones de
  software. Pero realmente todos los productos y
  documentos tanto impresos como digitales tienen
  alguna clase de interfaz de usuario.

• Una revista por ejemplo necesita una interfaz ( la
  tabla de contenidos, la numeración, títulos,
  subtítulos y demás) para que el lector pueda usarla
  efectivamente.


• Humanizar lo no humano

• Indicios                       Acción
Interfaz de usuario
El diseño de la interfaz de usuario (GUI - Graphic
User Interface -) de un sistema computarizado
incluye:


• 1- Metáforas de interacción,
   Imágenes y conceptos usados para transmitir función
   significando sobre la pantalla de la computadora,
   Las características visuales detalladas de cada
   componente de la interfaz gráfica,

• Todo esto produce la llamada: "experiencia de uso" de
  una interfaz.
Interfaz de usuario



•   En Internet, el diseño gráfico y las "marcas" visuales no
    son usadas simplemente para "decorar" las paginas. Aquí
    los gráficos son parte integral de la experiencia interactiva
    del usuario con el sitio.

•   En documentos interactivos es imposible separar el
    diseño gráfico del diseño de interfaz.
Interfaz de usuario


La navegación debe mostrar claramente:

•   1- En que lugar o sección del sitio me encuentro,
•   2- En que lugares o secciones he estado
•   3- Hacia donde puedo ir
Interfaz de usuario

Tips para el diseño de Interfaz :


1.   Conozca y diseñe para su publico objetivo
2.   Pruebe sus suposiciones
3.   Conozca la tecnología
4.   Conozca sus limitaciones
5.   No sea inconsistente (o demasiado
     consistente)
6.   Provea retroalimentación
7.   Permita la manipulación directa
8.   No sobreextienda sus metáforas
9.   Diseñe y conquiste
Interfaz de usuario

Piense globalmente y actúe localmente

1. Use figuras gráficas, iconos o símbolos para
   representar una acción siempre que sea posible:

2.Cuando esté creando elementos textuales asegúrese
   de que el texto sea totalmente editable

3. Deje espacio para las traducciones

4. Conozca sus limitaciones

5. No sea inconsistente (o demasiado consistente)

6. Consulte a los nativos

7. Sea listo

Más contenido relacionado

Destacado (11)

Varaždinske vijesti španjolska
Varaždinske vijesti španjolskaVaraždinske vijesti španjolska
Varaždinske vijesti španjolska
 
2014 Top Real Estate Agent
2014 Top Real Estate Agent2014 Top Real Estate Agent
2014 Top Real Estate Agent
 
LA RADIO*
LA RADIO*LA RADIO*
LA RADIO*
 
Our favorite sport (4th A)
Our favorite sport (4th A)Our favorite sport (4th A)
Our favorite sport (4th A)
 
Question 4
Question 4Question 4
Question 4
 
Indigenous peoples recruited into modern militaries
Indigenous peoples recruited into modern militariesIndigenous peoples recruited into modern militaries
Indigenous peoples recruited into modern militaries
 
Arquitecturadecomputadores
ArquitecturadecomputadoresArquitecturadecomputadores
Arquitecturadecomputadores
 
28995748 psalm-132-commentary
28995748 psalm-132-commentary28995748 psalm-132-commentary
28995748 psalm-132-commentary
 
Matthew 8 commentary
Matthew 8 commentaryMatthew 8 commentary
Matthew 8 commentary
 
Acts 8 commentary
Acts 8 commentaryActs 8 commentary
Acts 8 commentary
 
GENESIS 49 COMMENTARY
GENESIS 49 COMMENTARYGENESIS 49 COMMENTARY
GENESIS 49 COMMENTARY
 

Similar a Diseño de interfaz de usuario: Conceptos y tips para una experiencia de usuario óptima

producción de Multimedia y los Diseño Grupo 2.pptx
producción de Multimedia y los Diseño Grupo 2.pptxproducción de Multimedia y los Diseño Grupo 2.pptx
producción de Multimedia y los Diseño Grupo 2.pptxMauricio Lopez Garcia
 
Diseño interfaz de usuario
Diseño interfaz de  usuarioDiseño interfaz de  usuario
Diseño interfaz de usuarioBayardo Medina
 
Diseño interfaz de usuario
Diseño interfaz de  usuarioDiseño interfaz de  usuario
Diseño interfaz de usuarioBayardo Medina
 
3Mayo2023 Taller construcción de Prototipos.pptx
3Mayo2023 Taller construcción de Prototipos.pptx3Mayo2023 Taller construcción de Prototipos.pptx
3Mayo2023 Taller construcción de Prototipos.pptxadso2024sena
 
Diseño de interfaces móviles (UX y la arquitectura de software)
Diseño de interfaces móviles (UX y la arquitectura de software)Diseño de interfaces móviles (UX y la arquitectura de software)
Diseño de interfaces móviles (UX y la arquitectura de software)jezabelink
 
Front End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest MeridaFront End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest MeridaLuis Felipe Perez
 
Diseno grafico dojo_v1
Diseno grafico dojo_v1Diseno grafico dojo_v1
Diseno grafico dojo_v1ramos866
 
Interfaces Gráficas de Usuario.pptx
Interfaces Gráficas de Usuario.pptxInterfaces Gráficas de Usuario.pptx
Interfaces Gráficas de Usuario.pptxJoseBarazarte4
 
2.1 Diseño, prototipo y construcción
2.1 Diseño, prototipo y construcción2.1 Diseño, prototipo y construcción
2.1 Diseño, prototipo y construcciónkamui002
 
INTRODUCCION AL DISEÑO WEB.pptx
INTRODUCCION AL DISEÑO WEB.pptxINTRODUCCION AL DISEÑO WEB.pptx
INTRODUCCION AL DISEÑO WEB.pptxMariselaBardales1
 
Modelo de Implantación del Usuario | interfaz Gráfica de usuario
Modelo de Implantación del Usuario |  interfaz Gráfica de usuarioModelo de Implantación del Usuario |  interfaz Gráfica de usuario
Modelo de Implantación del Usuario | interfaz Gráfica de usuariocelesteorellana
 
Creación de materiales didácticos
Creación de materiales didácticosCreación de materiales didácticos
Creación de materiales didácticosavrmoda
 
Trabajo bañott
Trabajo bañottTrabajo bañott
Trabajo bañottEleny30
 
Trabajo baño
Trabajo bañoTrabajo baño
Trabajo bañoEleny30
 

Similar a Diseño de interfaz de usuario: Conceptos y tips para una experiencia de usuario óptima (20)

Gui
GuiGui
Gui
 
producción de Multimedia y los Diseño Grupo 2.pptx
producción de Multimedia y los Diseño Grupo 2.pptxproducción de Multimedia y los Diseño Grupo 2.pptx
producción de Multimedia y los Diseño Grupo 2.pptx
 
Diseño interfaz de usuario
Diseño interfaz de  usuarioDiseño interfaz de  usuario
Diseño interfaz de usuario
 
Diseño interfaz de usuario
Diseño interfaz de  usuarioDiseño interfaz de  usuario
Diseño interfaz de usuario
 
3Mayo2023 Taller construcción de Prototipos.pptx
3Mayo2023 Taller construcción de Prototipos.pptx3Mayo2023 Taller construcción de Prototipos.pptx
3Mayo2023 Taller construcción de Prototipos.pptx
 
Pressman y sommerville, GUI
Pressman y sommerville, GUIPressman y sommerville, GUI
Pressman y sommerville, GUI
 
Clase 04 diseno_ui
Clase 04 diseno_uiClase 04 diseno_ui
Clase 04 diseno_ui
 
Diseño de interfaces móviles (UX y la arquitectura de software)
Diseño de interfaces móviles (UX y la arquitectura de software)Diseño de interfaces móviles (UX y la arquitectura de software)
Diseño de interfaces móviles (UX y la arquitectura de software)
 
Front End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest MeridaFront End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest Merida
 
Herramientas de diseño UI
Herramientas de diseño UIHerramientas de diseño UI
Herramientas de diseño UI
 
Diseno grafico dojo_v1
Diseno grafico dojo_v1Diseno grafico dojo_v1
Diseno grafico dojo_v1
 
Interfaces Gráficas de Usuario.pptx
Interfaces Gráficas de Usuario.pptxInterfaces Gráficas de Usuario.pptx
Interfaces Gráficas de Usuario.pptx
 
2.1 Diseño, prototipo y construcción
2.1 Diseño, prototipo y construcción2.1 Diseño, prototipo y construcción
2.1 Diseño, prototipo y construcción
 
INTRODUCCION AL DISEÑO WEB.pptx
INTRODUCCION AL DISEÑO WEB.pptxINTRODUCCION AL DISEÑO WEB.pptx
INTRODUCCION AL DISEÑO WEB.pptx
 
Diseño de interfaz de usuario
Diseño de interfaz de usuarioDiseño de interfaz de usuario
Diseño de interfaz de usuario
 
Modelo de Implantación del Usuario | interfaz Gráfica de usuario
Modelo de Implantación del Usuario |  interfaz Gráfica de usuarioModelo de Implantación del Usuario |  interfaz Gráfica de usuario
Modelo de Implantación del Usuario | interfaz Gráfica de usuario
 
Creación de materiales didácticos
Creación de materiales didácticosCreación de materiales didácticos
Creación de materiales didácticos
 
00 Sketching
00 Sketching00 Sketching
00 Sketching
 
Trabajo bañott
Trabajo bañottTrabajo bañott
Trabajo bañott
 
Trabajo baño
Trabajo bañoTrabajo baño
Trabajo baño
 

Diseño de interfaz de usuario: Conceptos y tips para una experiencia de usuario óptima

  • 1. Interfaz de usuario • Originalmente el termino interfaz surgió para referirse al trabajo realizado por algunos especialistas que construían aplicaciones de software. Pero realmente todos los productos y documentos tanto impresos como digitales tienen alguna clase de interfaz de usuario. • Una revista por ejemplo necesita una interfaz ( la tabla de contenidos, la numeración, títulos, subtítulos y demás) para que el lector pueda usarla efectivamente. • Humanizar lo no humano • Indicios Acción
  • 2. Interfaz de usuario El diseño de la interfaz de usuario (GUI - Graphic User Interface -) de un sistema computarizado incluye: • 1- Metáforas de interacción, Imágenes y conceptos usados para transmitir función significando sobre la pantalla de la computadora, Las características visuales detalladas de cada componente de la interfaz gráfica, • Todo esto produce la llamada: "experiencia de uso" de una interfaz.
  • 3. Interfaz de usuario • En Internet, el diseño gráfico y las "marcas" visuales no son usadas simplemente para "decorar" las paginas. Aquí los gráficos son parte integral de la experiencia interactiva del usuario con el sitio. • En documentos interactivos es imposible separar el diseño gráfico del diseño de interfaz.
  • 4. Interfaz de usuario La navegación debe mostrar claramente: • 1- En que lugar o sección del sitio me encuentro, • 2- En que lugares o secciones he estado • 3- Hacia donde puedo ir
  • 5. Interfaz de usuario Tips para el diseño de Interfaz : 1. Conozca y diseñe para su publico objetivo 2. Pruebe sus suposiciones 3. Conozca la tecnología 4. Conozca sus limitaciones 5. No sea inconsistente (o demasiado consistente) 6. Provea retroalimentación 7. Permita la manipulación directa 8. No sobreextienda sus metáforas 9. Diseñe y conquiste
  • 6. Interfaz de usuario Piense globalmente y actúe localmente 1. Use figuras gráficas, iconos o símbolos para representar una acción siempre que sea posible: 2.Cuando esté creando elementos textuales asegúrese de que el texto sea totalmente editable 3. Deje espacio para las traducciones 4. Conozca sus limitaciones 5. No sea inconsistente (o demasiado consistente) 6. Consulte a los nativos 7. Sea listo