¿Qué son los Botones y Realmente los Necesitamos?

Desde el inicio de las interfaces de usuario gráficas, hemos usado botones. Considera que el GUI original del Xerox PARC tiene 44 años, y aún así nuestras interfaces aún se ven bastante parecidas a eso.Recientemente trace la historia de los estilos de botones creando la líneas de tiempo de Dribbble. Aunque los botones evolucionaron en sintonía con las tendencias actuales y junto con la tecnología, su origen se inspira sin duda en objetos reales del pasado.

Imagen escaneada de Sears First Electric Buzzer 1897 Catálogo de otoño

Durante más de una década, hemos estado creando dispositivos sin una interfaz física que no dependen del toque humano, pero que pueden ser activados por voz o gesto. ¿Por qué persistimos en la creación de formas con las que interactuar que se basan en los objetos familiares que nos rodean? ¡La forma de un botón digital sigue siendo modelada en las herramientas y los mecanismos que desarrollamos en el siglo XIX!

Hemos creado dispositivos electrónicos completamente nuevos, inteligentes — podemos manejarlos en casi cualquier forma que elijamos, pero por pereza o fuerza de hábito, seguimos obligando a nuestros usuarios a hacer clic en una pequeña área complicada sólo unos pocos píxeles de ancho .

Es hora de hacer algo al respecto — es hora de pensar sin botones.

UI Sin Botones – Donde Todo Interactúa

Una “utopía sin botones”, es un concepto en el que cualquier intento de aferrarse a más de 130 años de la forma en que las cosas siempre se han hecho está completamente destrozado. El futuro es ahora - debemos seguir adelante y despojarnos de las soluciones anticuadas de nuestros predecesores.

¿Es posible imaginarnos una interfaz completamente libre de botones? ¿Algo tan intuitivo, que sólo con mirarlo, sabrá cómo actuar? Ya no necesita ser sólo en nuestra imaginación — estas interfaces ya existen.

La app de Microsoft HoloTour en AR

¿Podemos, de una vez por todas, eliminar el venerado botón? Micrófonos, cámaras, pantallas táctiles, vibraciones, acelerómetros, giroscopios, GPS, realidad ampliada, realidad virtual — la lista continúa — y todo esto manejado desde tu smartphone o PC. Ya no hay ninguna razón para seguir forzando a sus usuarios a presionar ese pequeño rectángulo.

Eliminemos los Botones en las UIs

¿Has leído Type Design?— el diseñador de Toptal Michael Abehsera hace las preguntas: ¿dónde están las interfaces desprovistas de cualquier elemento gráfico? ¿Por qué lo único que importa es el contenido? Muchos de ustedes preguntaron: “¿Qué pasa con los botones?” Ya no los necesitamos, vamos a eliminarlos completamente.

Aquí hay un par de ideas interesantes:

Facebook acaba de preguntar, “¿Cuál es tu estado de ánimo?” No hay necesidad de ** presionar un botón ** para contestar — utilizar su voz — sólo decirle que se sienta bien y la cabeza para la playa. A continuación, arrastre el texto que Facebook reconoce de su respuesta a donde desea que aparezca.

Animación de la interfaz de voz

Buscar por voz Neel Raj

¿Le has puesto ‘me gusta’ un artículo de Medium? Hace un tiempo en Medium podrías simplemente “recomendar” un artículo. Hoy hacemos clic en “aplausos”. Sólo “aplaudir”. ¿Qué pasa si no hay necesidad de hacer clic en este pequeño botón extraño, y sólo literalmente aplaudimos?

Hombre aplaudiendo al artículo sobre Medio

Concepto sin botones por Wojciech Dobry (...No lo tomes demasiado en serio.)

¿Qué pasa con algunas acciones más complejas? Tal como un pago en una tienda en línea. Arrastrar y soltar un elemento en el carrito de la compra, deslizar para proceder a la comprobación y, a continuación, confirmar con su huella digital. Pan comido.

Animación UI

ASOS - Animacón de añadir al carrito por Zachary Zhao

Piensa en Contenido y en Toda la Pantalla

Comencemos con las superficies que actualmente toca para realizar una acción. Dado que la gran mayoría de las interfaces gráficas de usuario modernas son pantallas de pantalla táctil — a menudo manejado con nuestros pulgares — es lógico que tales interfaces estarán con nosotros durante mucho tiempo. Y definitivamente tendremos esa necesidad irresistible de tocar — el tacto es nuestra sensación más importante después de todo. Tocar la superficie nos da una sensación de acción real, de control. ¿Cómo sería, que en vez de hacer clic en un punto en particular, le enseñáramos a nuestros usuarios a interactuar con la superficie en su totalidad?

Veamos cómo lo hace Instagram:

Navegación de una Historia de Instagram Instagram Story

¿Alguna vez has visto un botón que te permite navegar por una historia de Instagram y volver a la historia anterior? Probablemente no, porque todo lo que necesita hacer es tocar el borde izquierdo de la pantalla para que esto suceda.

Los usuarios han llegado a esperar nuevas formas de interactuar con nuestros productos digitales, ya menudo no implica un botón. Las tarjetas responden en todas sus superficies; haciendo clic en cualquier palabra, esperamos encontrar su definición; al tocar imágenes, esperamos alguna acción. Los usuarios ya están acostumbrados al hecho de que áreas enteras responden al tacto.

Reconocimiento de Gestos

Entendemos muy bien los gestos porque son naturales para nosotros y reflejados en nuestras acciones físicas. En la actualidad, casi todas las aplicaciones las utilizan para acelerar la navegación; podemos doblar una foto en lugar de presionarla como un botón; podemos deslizar para navegar por la galería, o pellizcar para ampliar cualquier contenido.

Animación de la interfaz de usuario de dibujo de corazón en la pantalla táctil

Interfaz UIInterfaz UI

Interfaces de Usuario por Ramotion & Jarek Berecki

Hacemos gestos no sólo en pantallas táctiles planas — los gestos también se realizan en los espacios AR y VR, donde podemos navegar con todo nuestro cuerpo.

Hombre usando gestos en realidad aumentada

Hombre usando el reconocimiento de gestos para controlar IoTHombre usando el reconocimiento de gestos para controlar IoT

Interfaces de Voz

Siri, Cortana, Alexa y Google Assistant están en funcionamiento. Muchos argumentan que las interfaces de voz son el futuro — es difícil no estar de acuerdo como sus usos potenciales son más allá del número. Podemos controlar vehículos, edificios inteligentes y máquinas simplemente hablando con ellos, tal como hablamos con una persona real. Con la inteligencia artificial y la máquina de aprendizaje, las máquinas son ahora capaces de entender nuestro lenguaje con más precisión. Ya no nos limitamos a pronunciar cuidadosamente “hechizos mágicos”; podemos hablar en frases completas.

Anuncio de OK Google

Usando el habla, podemos moverse libremente en el mundo de las transferencias de dinero. Actualmente, Siri te permite transferir dinero a través de PayPal a otra persona usando sólo una solicitud rápida: “Siri, envía $ 200 a XYZ mediante PayPal”. No hay botones — la única confirmación y chequeo de seguridad requerido es Touch ID.

Siri utilizado para la transferencia de PayPal en el iPhone

Acciones Físicas, Dispositivos Conectados y Reconocimiento de Vídeo

¿Sonríe para pagar? ¡Claro que sí! Alibaba y KFC lanzaron conjuntamente un sistema que le permite pagar simplemente sonriendo a la cámara — sin botones para presionar. El sistema funciona en el reconocimiento facial y ahora está disponible en China.

El sistema de KFC y Alibaba al sonreír para pagar

This is just one of the potential uses. Our devices are already equipped with a whole host of sensors, and can monitor your entire body. Nothing is preventing you from using one finger to perform any action on your smartphone.

iWatch utilizado para desbloquear MacBook Pro

Otro ejemplo de una acción física que acelerará la desaparición de los botones es simplemente estar cerca del dispositivo. Echemos un vistazo al iWatch, por ejemplo — sólo es necesario conectarlo con tu computadora portátil y esperar para desbloquear tu MacBook. Los dispositivos usables se pueden utilizar para confirmar nuestra identidad, así como predecir inteligentemente nuestras necesidades en función de la ubicación y los datos del sensor. Gracias a ellos, ya podemos evitar el uso de botones en muchas interfaces.

Giroscopio utilizado para controlar el dispositivoGiroscopio utilizado para controlar el dispositivo

No olvidemos las tecnologías que han estado ampliamente disponibles durante varios años. Uno es el giroscopio — disponible en casi todos los teléfonos inteligentes, pero rara vez se utiliza en las interfaces. Arriba, puede ver interfaces experimentales creadas por Patryk Adaś.

El Futuro del Diseño UI

Con tantas opciones disponibles, ahora es posible olvidarse del uso de botones rectangulares típicos para que los usuarios interactúen. Con la tecnología actual, tenemos la capacidad de crear interfaces completamente nuevas que pueden:

  • Ahorre tiempo a los usuarios

  • Prevenir errores, resbalones y errores, y

  • Compensar cualquier acción accidental

Conceptos UIConceptos UI

Interfaces conceptuales por Cosmin Capitan and Ramotion

Ha llegado el momento — la tecnología nos lo está adelantando. Nosotros los diseñadores DEBEMOS perseguirlo… ¡y asegurarnos de ponernos al día!

About the author

Wojciech Dobry, Poland
member since November 1, 2016
Wojciech is a product designer with 6 years of professional experience in the design field. He's educated as an architect-engineer. Wojciech is responsible and has worked on web product design through information architecture to the user interface all the while keeping mindful of business goals. [click to continue...]
Hiring? Meet the Top 10 Freelance UI Designers for Hire in April 2018

Comments

comments powered by Disqus
Subscribe
Free email updates
Get the latest content first.
No spam. Just great design posts.
Free email updates
Get the latest content first.
Thank you for subscribing!
Check your inbox to confirm subscription. You'll start receiving posts after you confirm.
Trending articles
Relevant Technologies
About the author
Wojciech Dobry
Designer
Wojciech is a product designer with 6 years of professional experience in the design field. He's educated as an architect-engineer. Wojciech is responsible and has worked on web product design through information architecture to the user interface all the while keeping mindful of business goals.