Cómo combinar una acción de pulsación con una respuesta visual o háptica clara
En el botón de una aplicación móvil, ofrezca una respuesta visible inmediata a la pulsación y, a continuación, muestre el resultado cuando finalice la acción. Añada una breve respuesta háptica solo cuando refuerce ese mismo evento y se adapte a la importancia de la acción. Esta secuencia ayuda a los usuarios a distinguir entre «la aplicación ha registrado mi pulsación» y «la tarea se ha completado correctamente», especialmente cuando una respuesta tarda tiempo. Los pasos que se describen a continuación se aplican a un único botón o control; los detalles varían según la plataforma, por lo que conviene utilizar los patrones de interacción estándar del sistema operativo siempre que estén disponibles.
Empiece por decidir qué debe comunicar la respuesta
Una pulsación puede desencadenar varios eventos diferentes: se presiona un control, cambia un ajuste, se inicia una solicitud o una solicitud tiene éxito o falla. Decida qué evento representa cada indicador antes de elegir una animación o vibración. Un indicador de presión confirma la entrada del usuario; un cambio de etiqueta o un estado seleccionado confirma un cambio de estado local; un indicador de progreso comunica que el proceso está en curso; un mensaje de confirmación confirma la finalización.
Mantenga estos significados diferenciados. Si un botón se oscurece brevemente al tocarlo, eso no demuestra que se haya completado una solicitud de red. Si el envío puede tardar algún tiempo, conserve un estado de progreso claro hasta que la aplicación conozca el resultado. Apple recomienda mostrar un indicador de actividad en un botón cuando una acción no se completa al instante, y sugiere cambiar la etiqueta para aclarar lo que está sucediendo. Guía sobre botones de Apple
Construya una secuencia de estados sencilla
Trate la respuesta como una secuencia vinculada al estado real del control, y no como un único efecto que se reproduce cada vez que se pulsa el botón. Una base de referencia útil es:
- Listo: Muestre la acción con una etiqueta o un símbolo conocido que aclare su finalidad.
- Presionado: Proporcione un estado visual inmediato de presión, como un sutil cambio de relleno, escala o resaltado.
- Procesando: Si la finalización se retrasa, muestre el progreso y evite envíos duplicados accidentales cuando sea apropiado para la acción.
- Completado o fallido: Actualice la interfaz con el resultado real. Para un interruptor o control deslizante, muestre su nuevo estado seleccionado; para un envío, ofrezca un estado conciso de éxito o error.
Apple indica que los botones personalizados siempre deben tener un estado de presión, ya que sin él pueden dar la sensación de no responder. Su guía más amplia sobre respuestas recomienda adaptar la intensidad de la información a su relevancia y situar el estado cerca del elemento que describe. Guía sobre botones de Apple y guía sobre respuestas de Apple
Elija un indicador visual que resulte fácil de entender
Haga que el estado presionado sea visible mientras el dedo permanezca sobre el control. Un ligero cambio de color u opacidad, una breve variación de escala o un resaltado pueden funcionar, siempre que el control siga siendo reconocible y su etiqueta sea legible. No utilice el color como la única forma de comunicar el resultado: combínelo con un cambio de estado, texto, un icono u otra distinción visible que explique lo ocurrido.
En el caso de un interruptor o selector, el estado seleccionado debe persistir tras la pulsación; un efecto de onda temporal por sí solo no comunica si el ajuste está activado. Para una acción puntual como «Guardar», el botón puede mostrar primero su estado de presión y, a continuación, la aplicación puede mostrar un estado de guardado o confirmación. Si una tarea falla, explique el error cerca del control pertinente y deje clara la siguiente acción disponible. La presentación exacta depende de la aplicación y la plataforma, pero el indicador debe reflejar el estado que la aplicación pueda verificar.
Decida si una respuesta háptica aporta información útil
La respuesta háptica puede reforzar un evento concreto, como la pulsación de un botón o un cambio de estado confirmado. Es opcional: la respuesta visual debe seguir teniendo sentido si el dispositivo está en silencio, la respuesta háptica está desactivada o el usuario no percibe el efecto. La guía de Android recomienda usar la tecnología háptica con moderación, mantenerla coherente en interacciones similares y adaptarla a la experiencia visual o auditiva. También aconseja prescindir de la respuesta háptica antes que recurrir a un efecto de vibración tosco o zumbante. Principios de diseño háptico de Android
Una opción práctica es utilizar una señal ligera y breve para una confirmación significativa cuando la plataforma ofrezca un efecto estándar adecuado. Evite vibrar con cada pulsación de poco valor, al desplazarse repetidamente o ante un evento que no tenga un cambio visual correspondiente. Si el evento es importante, asegúrese de que el estado visual transmita el significado; no confíe en una vibración para distinguir el éxito del error.
Haga coincidir el indicador con el momento que representa
La respuesta a la presión debe producirse en el momento del toque; la respuesta de confirmación debe llegar una vez que se confirme el éxito. En una acción que se completa de inmediato, estos momentos pueden estar muy próximos. En un guardado o envío remoto, pueden estar separados por una espera notable. Mostrar una respuesta háptica de éxito en el momento de tocar la pantalla daría por completada la acción antes de que la aplicación lo haya confirmado.
En Android, el enfoque recomendado View.performHapticFeedback utiliza constantes orientadas a acciones, respeta los ajustes del sistema relativos a la respuesta táctil y no requiere el permiso VIBRATE. La plataforma proporciona un comportamiento alternativo para estas constantes cuando resulta necesario. Los efectos de vibración más personalizados requieren consideraciones de soporte y configuración distintas, por lo que es preferible utilizar el enfoque estándar orientado a acciones para los controles comunes. Guía de implementación de respuesta háptica de Android
Tenga en cuenta el comportamiento de la plataforma y la frecuencia
Utilice controles integrados siempre que ya proporcionen la respuesta esperada. Apple señala que los controles estándar, como interruptores, controles deslizantes y selectores, pueden emitir respuestas hápticas del sistema en los modelos de iPhone compatibles. Añadir un segundo efecto personalizado por encima puede duplicar la señal, por lo que es conveniente comprobar el comportamiento nativo del control antes de superponer otro indicador. Guía sobre tecnología háptica de Apple
La frecuencia también es importante. Un patrón de respuesta que resulta claro para el envío ocasional de un formulario puede resultar molesto si se asocia a un botón de uso muy frecuente. Mantenga el mismo significado de forma coherente en acciones equivalentes y reserve los indicadores más intensos o perceptibles para eventos que justifiquen una mayor atención. Android recomienda específicamente vincular la intensidad háptica tanto a la importancia del evento como a la frecuencia con la que ocurre. Principios de diseño háptico de Android
Compruebe la interacción antes de publicar
Pruebe la secuencia completa en los dispositivos y sistemas operativos que admite la aplicación. Pulse una vez y confirme que el estado presionado aparece puntualmente; luego, verifique que el progreso permanezca visible durante cualquier demora y que el éxito o el fallo solo se muestren tras conocer el resultado. Intente una segunda pulsación rápida y confirme que la interfaz no genere una respuesta duplicada confusa ni acciones repetidas involuntarias.
Repita la comprobación con la respuesta táctil del sistema desactivada y sin la función háptica del dispositivo disponible o compatible. Los estados visuales deben seguir comunicando la acción y su resultado. Compare las acciones frecuentes con las ocasionales y elimine los efectos que resulten molestos, desincronizados o desconectados de un cambio visible. En la respuesta de vistas estándar de Android, el ajuste del sistema se respeta de forma predeterminada; los enfoques personalizados pueden requerir compatibilidad adicional y comprobaciones alternativas. Guía de respuesta háptica de Android
Una combinación clara sigue una lógica sencilla: muestre que la pulsación se ha registrado, comunique cualquier tiempo de espera y confirme el resultado cuando sea real. Deje que la respuesta háptica refuerce esa misma señal cuando sea oportuno, manteniendo al mismo tiempo la interfaz visual completa por sí misma.