Share
Los diseños impresionantes y útiles suceden porque la interfaz de usuario se ha trabajado sin descanso. Se necesita un maestro de la interfaz de usuario real para comprender cómo crear una excelente experiencia de usuario en un sitio web. Aquí hay 10 principios extremadamente útiles de algunas de las mentes más brillantes en el campo Interfaz de usuario.
Las interfaces de usuario (UI) son lo que separan los sitios web de primer nivel de los sitios web de mierda. La ausencia de una interfaz de usuario útil puede hacer que una aplicación web extremadamente útil sea inútil. ¿Por qué? Debido a que la interfaz de usuario no fue pensado y probado a fondo. Si un usuario no puede navegar fácilmente por un sitio web, se saltará felizmente a otro sitio similar que brinda una mejor experiencia de usuario.
Casi todos los desarrolladores web han oído hablar de 37 señales. Son campeones abiertos de prácticas de desarrollo ágil, pero lo más importante es que hacen algunas aplicaciones web bastante impresionantes. Tan asombroso, de hecho, que generalmente son considerados como algunas de las personas más inteligentes cuando se trata de meterse en la cabeza del usuario..
El presidente ejecutivo de 37 Signals, Jason Fried, es un gran defensor de pasar menos tiempo en detalles delicados y de crear
Interfaces más útiles, teniendo en cuenta al usuario..
"Se habla demasiado sobre CSS y XHTML y sobre Estándares y accesibilidad, y no se habla lo suficiente sobre personas. CSS y el Código que cumple con los estándares son solo herramientas. Debe saber qué construir con estas herramientas. Genial, me alegro de que su interfaz de usuario no lo haga. "No use tablas. Entonces, ¿qué? A quién le importa si aún no lo hace, deje que las personas alcancen sus objetivos. Los estándares web son excelentes, pero los propios estándares de la gente incluyen hacer las cosas (y eso todavía es demasiado difícil de hacer en línea)".
Los diseñadores de IU están cometiendo los mismos viejos errores fundamentales, y olvidándose del ser humano en el otro lado solo para que su código se vea mejor. Los humanos, no los validadores de código, usan interfaces ".
Cuando se trabaja con capas de código durante semanas, es difícil a veces retroceder y recordar que nuestros sitios están siendo utilizados por humanos, no por robots. Esto no implica que no debemos preocuparnos por los estándares por completo. Las normas son excelentes y debería ser adherido a Simplemente no podemos asumir que el cumplimiento de los estándares es todo lo que se necesita para crear una buena interfaz de usuario.
Las páginas de error son el tipo de cosas que a la mayoría de los desarrolladores web, (incluido yo mismo), les gusta simplemente barrer debajo de la alfombra. Es un pequeño detalle que afecta solo a una pequeña fracción de los visitantes de nuestro sitio, a la derecha?
El experto en usabilidad Jakob Nielsen afirma que tal vez estemos viendo las páginas de error 404 con la luz equivocada. Tal vez deberíamos estar viendo la página de error como herramienta de enseñanza.
La infracción de la guía más común es cuando un mensaje de error simplemente dice que algo está mal, sin explicar por qué y cómo el usuario puede solucionar el problema. Tales mensajes dejan a los usuarios varados.
Los mensajes de error informativos no solo ayudan a los usuarios a solucionar sus problemas actuales, también pueden servir como un momento de enseñanza. Por lo general, los usuarios no invierten tiempo en leer y aprender acerca de las funciones, pero sí lo hacen para entender una situación de error si se explica claramente, porque quieren superar el error..
Jeffrey Zeldman es el fundador de la firma de diseño web Happy Cog, autor, y también comenzó A List Apart, un excelente recurso para desarrolladores web. Si alguien sabe cómo hacer una interfaz de usuario adecuada, es Zeldman.
Jeffrey señala que un poco de código que se pasa por alto en el desarrollo web es la ausencia de establecer un color de fondo..
Es sorprendente la cantidad de diseñadores web que se olvidan de especificar un color de fondo en su sitio. Pasarán meses iterando wireframes y composiciones de diseño; escribe hacks CSS para los navegadores anteriores a este siglo; prueba su trabajo en todo, desde Blackberries hasta Macs antiguas que ejecutan System 7; Y, por supuesto, validarán sus hojas de marcado y estilo. Pero después de todo eso, se olvidarán de aplicar un color de fondo a su sitio y no pensarán en comprobarlo..
La accesibilidad es algo fantástico para los desarrolladores a la hora de crear una aplicación web. Sin embargo, parece que a veces podemos dejarnos llevar un poco por hacer que nuestros sitios y formularios sean accesibles. El gurú del diseño Roger Johansson señala que el exceso de accesibilidad a veces puede ser costoso para nuestras interfaces de usuario.
A veces, cuando las personas aprenden por primera vez sobre la accesibilidad a la Web, buscan formas rápidas de mejorar los sitios que construyen. A menudo, esto conduce a un uso incorrecto o excesivo de ciertas funciones HTML que están diseñadas para ayudar a la accesibilidad, pero cuando se usan incorrectamente no tienen ningún efecto y pueden tener el efecto opuesto al hacer que la página sea menos accesible y menos utilizable..
Muchas de las funciones de accesibilidad comúnmente mal utilizadas son atributos HTML. Tengo la sensación de que son mal utilizados por los desarrolladores, que tienen buenas intenciones pero no entienden bien cómo los atributos ayudan a los usuarios finales, o por los desarrolladores que los agregan simplemente para poder marcar 'Accesibilidad' de su lista de tareas pendientes y cerrar a su gerente, cliente o quien los esté molestando para que el sitio sea más accesible.
El Sr. Fried de 37 Signals hace otra aparición en nuestra lista, gracias a sus excelentes consejos sobre cómo garantizar que el aspecto más importante del diseño siempre se diseñe primero. Él ha acuñado este método como 'Diseño de epicentro'..
El diseño del epicentro implica centrarse en la verdadera esencia de la página (el 'epicentro') y luego construir hacia afuera. Esto significa que no debe comenzar con la navegación / pestañas, el pie de página, los colores, la barra lateral, el logotipo, etc. Significa comenzar con la parte de la página que, si se cambia o elimina, cambiaría el propósito completo de la página. Ese es el epicentro.
El uso del método de diseño de epicentro mantiene nuestras interfaces de usuario enfocadas y garantiza que no nos "perdamos el punto" de la página.
El propio Collis Ta'eed de NETTUTS tiene una excelente sugerencia para desarrolladores web en todas partes: utilice las pruebas de los usuarios. Cuando pasas incontables horas mirando el mismo diseño en tu monitor, a veces es fácil olvidar cómo el usuario podría usar el sitio web. De hecho, el usuario promedio podría usar su aplicación de manera muy diferente a la que podría haber imaginado..
Lo primero que debes reconocer es que cuando realices cualquier tipo de prueba de usuario, te convertirás en un mejor diseñador web. Podrá ver exactamente cómo la gente usa sus diseños web y hay una buena posibilidad de que se sorprenda de cómo lo hacen. Las cosas que cree que son obvias a menudo no lo son, el texto que pensó que explicaba algo ni siquiera se lee, y en general los usuarios hacen cosas que no debían hacer. Incluso si el único usuario que está probando es pedirle a algunos amigos que usen un sitio mientras los observa, ya será mejor para él, independientemente del proyecto en sí..
Saber cómo los usuarios interactúan y usan su sitio web es una información increíblemente valiosa, y si se usa correctamente puede cambiar enormemente sus interfaces de usuario para adaptarse mejor a sus usuarios.
Lo que puede parecer una idea tonta, es fácil olvidar que los usuarios del sitio necesitan incentivos para hacer cosas como rellenar formularios e interactuar en su sitio web. Nadie entiende esto mejor que un comercializador de Internet exitoso. Jim Kukral señala que para tener una interfaz de usuario exitosa, los usuarios deben beneficiarse de alguna manera para completar cosas como comentarios o formularios de registro..
El usuario debe sentir que el valor o el resultado supera el costo (o el tiempo) de tener que completar el formulario. Por lo tanto, a menos que proporcione a los usuarios algo de valor a cambio, las posibilidades disminuyen de que el usuario finalice la tarea..
Los incentivos pueden ser lo que usted esté dispuesto a proporcionar. Aquí hay ejemplos de posibles incentivos:
- Regale un certificado de regalo para algunos de sus productos a cambio de la información de contacto del usuario..
- Proporcionar al usuario la oportunidad de participar en un sorteo u otro tipo de concurso.
- Ofrezca una descarga gratuita de algún contenido experto o información pertinente al negocio en cuestión..
Jakob Nielsen ha investigado a los usuarios de la web durante más de una década. Ha brindado innumerables consejos sobre el tema de hacer que las UI sean más fáciles de usar, pero uno de sus mejores consejos es mantener los elementos de diseño coherentes..
La consistencia es uno de los principios de usabilidad más poderosos: cuando las cosas siempre se comportan igual, los usuarios no tienen que preocuparse por lo que sucederá. En cambio, saben lo que sucederá en base a la experiencia anterior. Cada vez que sueltes una manzana sobre Sir Isaac Newton, caerá sobre su cabeza. Eso es bueno.
Cuanto más correctas sean las expectativas de los usuarios, más se sentirán en control del sistema y más les gustará. Y cuanto más rompa el sistema las expectativas de los usuarios, más se sentirán inseguros. Vaya, tal vez si suelto esta manzana, se convertirá en un tomate y saltará una milla en el cielo..
Es demasiado fácil dejar caer algunas palabras de moda o una pizca de jerga en su copia de la interfaz de usuario. ¿Por qué? Porque nosotros saber Lo que significa ese poco de jerga. Sin embargo, podemos estar alejando al usuario promedio al usar términos que tal vez no conozcan. La estratega web Erin Kissane nos aconseja mantener la jerga al mínimo por esta misma razón..
Hay un momento para la jerga profesional: cuando sabes que estás hablando con un público que te entiende, y necesitas la especificidad y la precisión adicionales que puede proporcionar la jerga. Si lo está utilizando fuera de esa situación, es probable que no se esté comunicando de manera clara, honesta o efectiva..
Sin embargo, la jerga no es realmente el problema aquí. El problema con la copia en esta página, y muchos otros que promueven productos de información, es que no dice nada. La jerga mal colocada, las palabras de moda y otros tipos de pelusa se precipitan porque la falta de significado transportable crea un vacío.
Cuando se trata de construir nuestra interfaz de usuario, muchos desarrolladores comienzan con un esquema de cómo será el sitio. Sin embargo, como las aplicaciones de Internet enriquecidas impulsadas por Ajax (RIA) se están volviendo cada vez más comunes, no tiene mucho sentido construir un sitio web dinámico y en movimiento con una estructura de alambre simple. A veces es más efectivo construir un prototipo..
El Director de Tecnología de Path Adaptive David Verba sostiene que la estructura alámbrica puede no ser la mejor opción para diseñar interfaces de usuario, ya que simplemente no cortan la mostaza para desarrollar una aplicación compleja..
La creación de prototipos nos permite ver los problemas con mayor claridad, y con frecuencia antes, en el proceso de diseño y desarrollo. A medida que nos movemos más allá de los sitios de contenido corporativo y hacia las aplicaciones que tienen una funcionalidad rica y compleja, nuestra capacidad de sentarnos al comienzo del proyecto y prever posibles interacciones y problemas disminuye. El espacio del problema es demasiado complejo. Esta es la razón por la que comenzamos a usar wireframes en primer lugar. A menudo, la única forma de entender realmente dónde van a surgir los problemas o de descubrir posibles soluciones es dibujarlos. Utilizamos wireframes para dibujar el contenido y el diseño, pero a medida que avanzamos hacia interfaces más interactivas, los wireframes no son tan efectivos. Necesitamos hacer un boceto con la funcionalidad real, un boceto en código, por así decirlo, para poder ver cómo se comportará realmente la aplicación.
Glen Stansberry es un desarrollador web y bloguero que ha luchado más veces de lo que desea admitir con CSS. Puedes leer más consejos sobre desarrollo web en su blog Web Jackalope..
Accentsconagua