esqueuomorfismo

Todo el propósito del skeuomorphism es abordar los problemas que enfrenta. Emular la estética de los objetos físicos a los que las personas están acostumbradas en el mundo real les ayuda a comprender la funcionalidad de su interfaz.

Skeuomorphism tiene un poco de mala reputación recientemente, principalmente debido a que Apple lo llevó demasiado lejos. Antes de iOS 7, el diseño skeuomorphic que usaba Apple tenía más que ver con la estética que con la función, pero el skeuomorphism tiene un beneficio funcional real al ayudar a los usuarios a comprender nuevos conceptos usando metáforas.

Mire estos controles deslizantes: todos tienen botones/perillas que parece que podría agarrarlos y arrastrarlos o hacer algo con ellos, exactamente lo que debería estar haciendo con ellos:

^Fuente

Ejemplo

Esta es una maqueta rápida de su interfaz con algunos controles deslizantes agregados:

No se ven muy bien, pero eso me tomó 2 minutos y ahora es obvio que son para arrastrar/deslizar. Dado que su interfaz no es una, la mayoría de las personas estarán acostumbradas a agregar flechas para sugerir movimiento.

Tiene un espacio bastante limitado, por lo que una idea es mostrar los controles deslizantes obviamente grandes en el primer lanzamiento/instalación, luego reducir su tamaño una vez que se hayan cambiado los valores; en ese punto, el usuario sabe que están allí y lo que hacen. Una extensión de esa idea es hacer que las manijas se muevan más hacia adentro o crezcan en tamaño al pasar el mouse por encima.

Hay muchas soluciones diferentes pero, en términos generales, la respuesta es: esqueuomorfismo.

Actualizar

Después de usar su extensión (¡realmente me gusta por cierto!), diría que también necesita etiquetar los diferentes controles deslizantes; no está claro al instante qué controla qué. La información sobre herramientas explica claramente, pero no es lo suficientemente obvia, si las personas ni siquiera son conscientes de que pueden mover los controles deslizantes, definitivamente no son conscientes de la información sobre herramientas que explica lo que controlan esos controles deslizantes.

Las etiquetas 'Día', 'Noche' y 'Transición' serían suficientes, con la información sobre herramientas brindando una mejor descripción como lo hacen ahora.

Una maqueta rápida con algunas posibles mejoras:

Actualmente, las tres pequeñas protuberancias no parecen un objeto deslizable, por lo que es posible que las personas no intenten usarlas.

Sugiero echar un vistazo a algunos controles deslizantes/complementos deslizantes para ver cómo manejan sus brazos deslizantes.

Es posible que desee usar algo con un punto para que también pinpointsse deslice exactamente. Algo como esto quizás.

Este es el por qué:

Como usuarios que utilizan con avidez sitios web y herramientas, sin saberlo, entramos en un proceso de autoaprendizaje. En este proceso comenzamos a aprender muchos elementos clave sobre la navegación web, algunas cosas básicas comunes se enseñan sin saberlo:

1. Rojo generalmente significa unsuccessfuloclose
2. Verde generalmente significa successoopen
3. Las flechas indican navegación hacia adelante y hacia atrás
4. Los cursores de puntero significan que se puede hacer clic en el objeto

Lo crea o no, los controles deslizantes se han convertido en una parte importante de muchas herramientas web, por lo que también tienen los suyos standard appearance.. Aquí es donde entran las pruebas A/B, seleccione 2 o 3 estilos diferentes y pruébelos, aquí hay 3 de los más comunes :

1. control deslizante circular
2. deslizador de puntero
3. control deslizante redondeado

Sugeriría ir con una opción ya existente, pero me inclinaría mucho hacia un control deslizante puntiagudo para su caso de uso específico.