¿Es legible el siguiente diseño de navegación?

Utilicé la biblioteca JavaScript D3 para crear un navegador de publicaciones lineal basado en el tiempo para mi blog personal que se aparta significativamente de la forma "tradicional" de vincular publicaciones. Quería recopilar algunos comentarios sobre si este diseño funciona o no: y, más específicamente, si hay o no elementos visuales que pueda agregar que pueda usar para reforzar la "obviedad" de la barra de navegación.

Aquí está desactivado:

ingrese la descripción de la imagen aquí

Los nodos se activan cuando pasas el cursor sobre ellos:

ingrese la descripción de la imagen aquí

Mi gran pregunta es: ¿este diseño es funcionalmente obvio?
y ¿qué se puede hacer para que lo sea más?

Una línea de tiempo debería ser realmente una línea de tiempo para que quede claro. Poner una línea horizontal detrás de los círculos, con pequeños tocones verticales en cada extremo y los meses/años iniciales y finales debajo de ellos, haría mucho más obvio que se trata de una línea de tiempo. Tal vez también ayudaría aún más agregar el mes y el año debajo de cada círculo de publicación.

Respuestas (1)

Hay algunos problemas bastante grandes aquí.

No vi la navegación incluso cuando buscaba uno . Me tomó tres veces mirar la página para encontrarlo. Si eso es cierto, no hay forma de que lo vea cuando no lo busque. Esto es probable porque

  1. Está en una ubicación incómoda para la navegación; la mayoría está en la parte superior. Esto es más un tipo de funcionalidad de "vista previa de otra publicación", no realmente una navegación clásica. Creo que el puesto está bien si ese es tu propósito.
  2. Es muy pequeño en cuanto a la altura: parece casi un borde de aspecto extraño, no algo para ser suspendido.
  3. Los colores son suaves, no me llama la atención en absoluto.

No hay indicación de lo que hace el pasar el mouse sobre ellos hasta que un usuario lo hace . Como tal, los usuarios no tienen idea de si pasar el cursor sobre él o no. No se parece a nada a lo que esté acostumbrado, por lo que probablemente no intentaré moverlo; Puedo por accidente.

No siempre es fácil pasar el cursor sobre círculos individuales . Si publicaste algunos uno cerca del otro, se superponen. Supongo que si publicaras dos al mismo tiempo, estarían exactamente uno encima del otro. Eso no es muy útil. Esto empeora cuanto más espacio hay entre las publicaciones. Entonces, si no publicaste durante un tiempo, la escala sería con un grupo completo agrupado y luego uno solo porque la ubicación se basa en el tiempo.

Esto sería terrible en el móvil . Sería muy difícil tocar el círculo correcto, especialmente cuando se superponen. Además, irían ciegamente a otra publicación porque la vista previa solo se muestra al pasar el mouse sobre ella. ¡Eso es inaceptable!

Las flechas no hacen nada (y son demasiado pequeñas en primer lugar) . Supongo que es por si hay más publicaciones a la izquierda o a la derecha. No estoy seguro. Pero dado que no hay borde alrededor del contenedor, no sé dónde comienza o termina de todos modos, por lo que podrían estar relacionados con otra cosa por completo.


Como tal, aquí hay algunas mejoras:

No mostrar todas tus otras publicaciones . A los usuarios no les importa ver una lista completa de todas las publicaciones, especialmente en forma de puntos que no les da información sobre las publicaciones. En su lugar, muéstreles los relevantes y deje una opción para mostrar más o para ver una lista completa.

Hágalo de modo que la superposición no sea un problema . Es una molestia tratar de prevenirlo, simplemente evítelo en primer lugar.

Muestra la vista previa de ciertas publicaciones en todo momento . Puede hacer esto de muchas maneras, pero me imagino mostrando una grande en todo el ancho del contenido y tal vez algunas (3 o más) debajo de él. De esa manera, los usuarios ven visiblemente, "Oye, aquí hay otra imagen vinculada a la publicación" en lugar de solo algunos círculos aleatorios.

Si realmente quisieras mostrar muchas publicaciones, podrías agregar otra fila más pequeña y hacer que reemplacen la ranura de la vista previa principal cuando se haga clic o se desplace.

Esto es lo que me estoy imaginando:

ingrese la descripción de la imagen aquí

Ok --- ganas algo, pierdes algo. Teniendo en cuenta lo que dijiste, junto con mi propio deseo de no tener que lidiar con (y escribir el código para) la categorización y el enlace de publicaciones, he creado un sistema que sirve páginas al azar usando un diseño de caja como (2) ( 3) (4) en su estructura alámbrica. Echa un vistazo . A veces sirve la página en la que ya estás (escribir un corrector es técnicamente bastante fácil pero bleh) pero aparte de eso, debería funcionar bien. ¿Pensamientos?
@ResMar Eché un vistazo a su enlace en Firefox y no mostraba el nuevo diseño del cuadro, así que cerré Firefox y lo volví a abrir en el mismo enlace, y tampoco lo mostró esa vez. No tuve problemas para verlo en Chrome, pero la última imagen de navegación a la derecha sigue recortada a la mitad "fuera de la pantalla". Si hubiera algo como una flecha, podría usarlo para mover la última imagen hacia la izquierda para poder verla toda. Firefox y Chrome están actualizados a las últimas versiones.
@ResMar ¡Eso es mucho más útil! Para que critiquemos algo así, debe hacer una nueva pregunta ya que esta pregunta ha sido respondida.