Mobile search ui/ux improvement

I find when I initiate a search in a mobile view I can become stuck due to the lack of an obvious cancel button to return me to my prior screen.

I can swipe back or use a browser back button; however, displaying a simple “cancel” button could be a worthwhile UX improvement.

3 Me gusta

Not sure I agree with this. Do you also feel stuck on a user page on mobile?

I think what feels inconsistent is that the other two buttons alongside the search one open pop-ups that can be dismissed by clicking on the button again.

Not sure I have a great suggestion as to how to resolve the inconsistency though…

La diseñadora UX de mi equipo se asustó cuando probó la búsqueda en el móvil.
Aunque la versión de escritorio en móvil es ordenada, el cambio predeterminado de página en el móvil es poco intuitivo.

Estamos intentando modificarlo para que la experiencia de búsqueda en el móvil sea idéntica a la de escritorio (una ventana emergente que se puede cerrar).
¿Alguna idea sobre cómo ajustar eso?

1 me gusta

Lo evitamos debido a algunos errores muy graves de Safari que lo hacían inoperable por el uso de position: fixed. Estoy bastante seguro de que @pmusaraj consideró este problema recientemente. No creo que te vaya a resultar fácil ajustar esto.

1 me gusta

Es bueno saber por qué se tomó la decisión.
Supongo que un error anterior a 2016 en Safari ya debe haber sido corregido.
¿No tendría más sentido simplificar esto nuevamente para aplicar el comportamiento de escritorio en todos los casos?

1 me gusta

¿Podrías describir con más detalle a qué te refieres? Me encantaría ver algunas capturas de pantalla o una grabación de pantalla del problema. Esto me ayudaría a determinar si estás experimentando problemas legítimos en el núcleo o si se trata de algo más.

¡Hola, gracias por preguntar!
Grabé un pequeño video de la experiencia de usuario en el escritorio al escribir una búsqueda y volver al contenido:

search-dropdown

Y también una grabación de la experiencia actual en un dispositivo móvil, donde no puedes cerrar la búsqueda y acceder nuevamente al contenido:

search-fullpage

Me di cuenta de que tenía que volver a la página anterior al ver la URL /search en la barra de direcciones, pero me llevó un poco de tiempo entenderlo, y el diseñador de UX quedó muy confundido con esa experiencia.

4 Me gusta

Gracias por las grabaciones de pantalla. Entiendo lo que quieres decir: el problema es que no es evidente que la búsqueda te lleva a una página separada. Probablemente podamos hacer algo para que el usuario tenga más claro que ha navegado a una página de búsqueda independiente.

O tal vez podríamos usar el mismo widget que en el escritorio, como mencionaste. En general, me gusta tener la misma interfaz de usuario en escritorio y móvil, pero no estoy seguro de que este sea un buen caso para ello.

2 Me gusta

Me encanta mucho el patrón de usar una página completa en móviles para reemplazar modales y menús desplegables; aprovecha mucho mejor el espacio y evita muchos problemas de desplazamiento… Me pregunto si añadir algún tipo de x o un botón de retroceso ayudaría. ¿Y quizás que al tocar el :mag: te devuelva a la página anterior a la búsqueda?

¡Aún no funciona muy bien! Tenemos muchos trucos para sortear los problemas de desplazamiento en iOS con modales y menús desplegables. Por lo que sé, ni siquiera consideran muchas de esas diferencias como errores.

5 Me gusta