usuario una tipos software que interfaz grafica ejemplos diseño caracteristicas amigable user-interface usability

user interface - una - ¿Cuál es la función de interfaz de usuario más inteligente que ha visto en un sitio web?



que es una interfaz (25)

Hizo que la experiencia del usuario sea más intuitiva

Soporte para el botón Atrás y navegación con pestañas, que GMail es un buen ejemplo.

He usado demasiados (los sistemas de reserva de tiempo basados ​​en Oracle parecen ser los peores para esto) que simplemente salen mal si usa ''atrás'' para volver a la página en la que estaba antes de hacer clic en un enlace.

En un sitio, nationalrail.co.uk, es casi imposible obtener tiempos de tren para dos consultas diferentes abiertas en diferentes pestañas, ya que almacena la consulta por usuario. (por lo tanto, si abre una pestaña, haga una consulta de viaje, abra otra pestaña, haga otra consulta y luego solicite los trenes posteriores en la primera pestaña obtendrá los detalles para el segundo viaje). A veces tengo que abrir Chrome y Firefox o usar más de una computadora para planificar mi viaje.

¿Cuál es la función de interfaz de usuario más inteligente que ha visto en un sitio web? Algo que:

  • Hizo que la experiencia del usuario sea más intuitiva
  • Se agregó significativamente a la utilidad de la aplicación.
  • Agregado al ''factor sorpresa'' de la aplicación
  • o ... cualquier otra cosa que consideres importante;)

Podría ser también algo estándar, pero particularmente bien implementado.

Restrinja esto a las tecnologías web estándar (HTML, AJAX, etc.), ¡sin Flash ni complementos, por favor!

Gracias



Creo que una de las mejores API de mejora de la interfaz de usuario javaScript simple, más antigua, es Highslide ( http://www.highslide.com/ ). Se usa en todas partes (ver Implementations ) y se puede usar para contenido en línea, ajax o fuera del sitio. Fácil, efectivo y brillante.

Lo uso en mi sitio para fotos simples ( www.rogoff.uk.com ), pero también lo utilizamos para aplicaciones web mucho más sofisticadas en el trabajo. Permite múltiples ventanas móviles para maximizar el espacio y el contenido en su navegador.


En

ColorSchemeDesigner

podemos tener una vista previa de la página seleccionando un esquema de color que me ayudó mucho en el diseño de páginas web para mis aplicaciones.


Es difícil para mí seleccionar solo una característica de UI favorita. Pero lo que me viene a la mente cuando pienso en buenas interfaces de usuario es SmugMug. En mi opinión, tienen de lejos la mejor interfaz de usuario entre todos los sitios de la galería de fotos en línea.

Permítame elegir una galería al azar:

http://collierphotography.smugmug.com/Photography/Colorado/9289093_h9zBa

Y enumeraré algunas características de UI que lo hacen genial:

  1. Cuando hace clic en una foto pequeña, lo lleva a un nuevo anclaje de página (no a una página nueva) mientras cambia dinámicamente la foto de tamaño medio que está mirando. En primer lugar, esto significa que el sitio no tiene que volver a cargar la página, lo que sería una pérdida de tiempo cuando solo esté navegando por imágenes. En segundo lugar, como es un anclaje de página, funcionan los botones retroceder / avanzar en su navegador. Estoy de acuerdo con Pete Kirkham, realmente me molesta cuando un sitio web está diseñado de una manera que te pelea cuando presionas "Atrás". Afortunadamente, SmugMug no es uno de esos sitios. De hecho, lo que tienen es la configuración ideal. El resultado final es una galería de fotos que es fácil de navegar y también más rápida que cualquier otra cosa.

  2. Se ajusta al ancho de su navegador. Esto no es necesariamente deseable en todos los sitios, pero definitivamente ayuda en una galería de fotos.

  3. Han implementado su propio efecto Lightbox-esque cuando haces clic en la imagen grande para hacerlo aún más grande. Esto atenuará el fondo mientras mira la foto y también ofrecerá más opciones de tamaño.

Por lo tanto, no es solo una característica, y de hecho no hay una característica innovadora que destaque en nada de esto. Pero es la combinación de buenas prácticas de interfaz de usuario lo que hace que este sitio sea muy agradable de usar.


Esto es un poco esotérico, porque realmente se aplica solo a la tecnología wiki, pero creo que la función de edición por sección de algunos wiki es genial. Tengo que usar varias wiki diferentes, y cuando estás editando una página realmente grande en una wiki que no admite edición por sección (o peor, tampoco admite la vista previa de tu diferencia), sientes que cada cambio podría resultar en un desastre


Facebook es un gran ejemplo de un sitio de Ajax. Se ve bien y funciona bien (no perfectamente;))


Google maps es, de lejos, la interfaz de usuario no flash más inteligente / avanzada en Internet.


He visto algo completamente en contra de todos los estándares y también es más un experimento, pero definitivamente tiene su factor sorpresa. Se llama No hacer clic y se trata de usar una interfaz de usuario sin hacer clic. Pruébelo usted mismo, se sorprenderá de la frecuencia con la que está tentado de hacer clic (al menos esa fue mi experiencia)


La forma en que algunas aplicaciones de foros web muestran una ventana, como una ventana de sugerencias de herramientas, que contiene el primer párrafo o dos de la publicación. Cuando está viendo una lista de temas, tratando de decidir cuáles valen la pena leer, puede resultar tedioso hacer clic, esperar la actualización de la página completa, hacer clic en el botón Atrás, esperar a que la página se actualice nuevamente. No es obvio si hay una forma AJAXy para manejar esto, ya que el diseño de la página (y el proceso de pensamiento) para las listas de temas y los temas es muy diferente. Pero esta pequeña característica, que podría implementarse con o sin AJAX, ayuda en gran medida a que sea una experiencia más placentera navegar en los foros.

Muchas páginas se utilizan para todo tipo de visiones y, a veces, se exageran hasta el punto de ser molestas o dificultar el uso de las páginas, pero este hover de previsualización de publicaciones es excelente.


La forma en que es tan simple crear una cuenta en y la gran integración con OpenId.

Ahora consideraré usar OpenId cada vez que necesite un sistema de inicio de sesión para un sitio web, ahora que he experimentado lo bien que puede funcionar.



La simplicidad eficiente de la página principal de Google.


Las sugerencias desplegables para un cuadro de búsqueda, como eBay, Amazon, etc., se usan en sus sitios para facilitar a los usuarios encontrar palabras clave de búsqueda. Google tiene esto también, pero la característica es aún más útil en una búsqueda específica del sitio, ya que no se obtienen palabras clave aleatorias que no se apliquen a ese sitio.

Estuve involucrado en la búsqueda de la función de sugerencias de búsqueda en MSDN Search hace varios años, y las métricas de uso desde entonces han sido fenomenales: hasta el 20% de las búsquedas en inglés utilizan la función de sugerir automáticamente. En la búsqueda, una característica suele ser exitosa si lo usa más del 3% de las búsquedas, ya que casi todo el tiempo cuando se busca, las personas simplemente eligen la IU predeterminada y continúan. Se desconoce el 20% de uso: ninguna otra función de búsqueda que he visto (en ningún sitio) se acerca.

Lo que es particularmente bueno acerca de las sugerencias de búsqueda es que solo ocupan el espacio de la pantalla cuando alguien realmente las necesita (escribiendo a máquina en el cuadro de búsqueda) y toman cero página de bienes raíces en caso contrario.

Además, puede ampliarlos más allá de simples listas de sugerencias: puede mostrar UI de previsualización (como las imágenes de vista previa de IE8''s browser-toolbar-search-box, o incluso permitir enlaces con un solo clic para buscar resultados si los usuarios quieren omitir la búsqueda).


Me gusta el jQuery UI ThemeRoller] 1 , que te permite personalizar un tema de GUI para jQuery. Especialmente genial es 1 , que te permite tomar una página de la interfaz de usuario jQuery y jugar con su apariencia de forma dinámica.


Me gusta el verdadero efecto de pantalla completa real basado en flash ...



Me quedé impresionado por el control Timeline de Similie Widgets .

Muy fácil de usar, comprender y navegar. Completamente escrito en Javascript; no hay Flash para ser visto, y lo mejor de todo es código abierto, por lo que cualquiera puede usarlo.

El primer lugar en el que lo vi en uso fue en el sitio de Netbeans, para su página de hoja de ruta .


Para mí, la funcionalidad más inteligente de la interfaz de usuario es simplemente cuando, después de haber ejecutado algún tipo de acción, me llevan / centrarse en el lugar de la aplicación que es probable que necesite a continuación.

Ejemplo: aplicación ToDo: agrego un elemento a mi cuadro de texto de la lista de tareas pendientes. Presione enter. la aplicación agrega mi artículo y luego le da al cuadro de texto su foco para que pueda seguir y agregar el siguiente elemento de tarea pendiente.

Encuentro que este tipo de cosas hacen que una aplicación sea mucho más elegante y fácil de usar que cualquier elemento realmente elegante: pensar un poco en cómo el usuario hará uso de una funcionalidad en particular marca la diferencia ...


Realmente me gusta la interfaz de Freckle . Facilitan el seguimiento del tiempo con su interfaz.


Google Analytics supera a todo lo demás que he visto de manera directa (IMO). Ejemplo perfecto de una interfaz de usuario intuitiva para presentar información voluminosa de manera nítida.


Hyperlinks .

Sé que no es glamour ni resbaladizo, ¡pero imagínate pensando eso en 1965!

Eso fue inteligente!


Pandora . Por supuesto, me sorprendió que pudiera encontrar música desconocida que me gustaría, pero la belleza general y la suavidad de la interfaz también hicieron que la primera experiencia fuera un placer memorable. Y fue fácil también, por supuesto.

Una de las características que recuerdo específicamente, y todavía está allí, es la forma en que la tarjeta de título de la siguiente canción que se tocará se asoma un poco desde el borde derecho de la ventana. Una burla sutil que hay más por venir.

(Toda esta descripción sonaba un poco más sexual de lo que quise ...)


Gmail : por la increíble capacidad de respuesta y por los atajos de teclado (todos, pero especialmente los atajos de etiqueta: aplicar una etiqueta, mover a la etiqueta, ir a la etiqueta).

Google Calendar : para la interfaz de usuario inteligente que permite ver, agregar y arrastrar y colocar eventos de una fecha a otra sin tener que volver a cargar la página.

En ambos casos, el modo fuera de línea con Gears es una buena ventaja.


La barra de alerta de es hermosa . Lo amo. Ahora soy ese tipo de chico que tiene ~ 200 pestañas abiertas a la vez, así que cada vez que reinicio Firefox, hay al menos una docena de sitios web con las más estúpidas indicaciones ALGUNA VEZ ... y eso realmente <some word here> fuera de mí.