Sitios web con navegación excepcionalmente creativa y única

Navegación es, obviamente, una de las cosas más importantes para acertar en el diseño de sitios web. Tradicionalmente, los menús se han colocado al costado o en la parte superior (o en ambos) de una página web, pero en estos días las cosas están cambiando. Nunca podremos cambiar la importancia de una buena navegación, pero se puede llevar a niveles más altos en estos días, con algunos menús de navegación ocupando todo el espacio de la página de destino.

Es más probable que los usuarios permanezcan en un sitio si, en primer lugar, comprenden lo que están viendo y no se confunden con la página, y en segundo lugar pueden interactuar con la página, haciéndolos sentir involucrados. Estos ejemplos cumplen con uno o ambos de esos criterios, e incluso si no está interesado en el producto o servicio ofrecido por los sitios, vale la pena echarle un vistazo a sus diseños de navegación, ya que los diseños son creativos y únicos.

Navegación creativa, interactiva y única

Lebenswerk
La navegación en este sitio no está disponible hasta que el usuario haya hecho clic en el botón ‘iniciar’. Una vez hecho esto, al pasar el cursor sobre la imagen dividida se expandirá la sección y aparecerá un cuadro de texto desde la parte inferior. Un sistema de navegación agradable y diferente, simplemente no entiendo la necesidad del botón de inicio antes de que pueda navegar por este sitio.

Lebenswerk

Hallazgos de Westin
La página de inicio de este sitio consta de una presentación de diapositivas de fondo en pantalla completa con hermosas imágenes de destinos y un cuadro de texto en el centro de la pantalla: “En Westin, todo lo que hacemos está diseñado para ayudarlo a aprovechar al máximo su estadía. Ahora incluso te ayudamos a encontrar excelentes lugares locales cerca de tu hotel. Para que seas mejor «. En la parte inferior del cuadro hay una barra de búsqueda, y hay una punta de flecha, que cuando se hace clic en ella aparece el menú de navegación. Este parece ser un estilo de navegación bastante único, alejándose de la navegación superior, inferior o lateral.

Hallazgos de Westin

Graf von Faber-Castell
Esta página de inicio tiene una presentación de diapositivas que muestra sus cuatro categorías principales. Cada imagen tiene un botón de llamada a la acción en el centro para que el usuario navegue a esa sección en particular. Un diseño muy limpio, claro y diferente.

Graf von Faber-Castell

Estudio secreto
A primera vista, esta navegación ubicada en el centro quizás no sea particularmente única, pero a medida que pasa el mouse sobre las categorías, la forma del diamante rojo se hace más grande y más pequeña… ¡es un efecto interesante!

Estudio secreto

Carbon Studio
Este es definitivamente un tipo diferente de navegación … para seleccionar cualquiera de las categorías, tiene que arrastrarla y soltarla en la burbuja central, tal vez más novedosa que única, ¡pero creativa sin duda!

Carbon Studio

Instituto Van Alen
Esta es una línea de tiempo de los proyectos del Instituto Van Alen en arquitectura pública, ¡y hay muchos de ellos! Las hendiduras de papel se deslizan, pero solo ligeramente, al pasar el mouse, por lo que no se revela suficiente información para ver cuál es el proyecto, sino una forma decente de presentar tanta información.

Instituto Van Alen

Rejilla orgánica
Una página de inicio muy colorida en la que la navegación ocupa la mayor parte del espacio. Limpio, claro e interactivo no le deja ninguna duda a dónde conducirá cada enlace.

Rejilla orgánica

Nick Jones: diseño estrecho
Este sitio web tiene un sistema de navegación muy interesante. Al principio, parece un poco desordenado, pero pronto ves la organización. Hay enlaces en toda la página de inicio y, al mover el mouse, se resaltan en rojo, por lo que es bastante difícil pasarlos por alto.

Nick Jones: diseño estrecho

Estudio Stemmler
Aquí hay otro sitio donde la navegación ocupa toda la página de inicio. Un enfoque diferente y algo retro que utiliza un diseño de estilo de tabla con las categorías principales sobre las columnas de cuadrados que contienen las subcategorías. Cada cuadrado da un poco de brillo al pasar el mouse.

Estudio Stemmler

Diseño de movimiento ligero
No se trata tanto de la navegación única en este sitio, aunque es bastante buena, es que lo primero que enfrenta cuando abre el sitio son instrucciones sobre cómo navegar, ¡eso es único!

Diseño de movimiento ligero

Sección siete
Esta es una idea maravillosa para la navegación. A medida que se carga la página, las columnas multicolores crecen hacia arriba, luego, cuando se completa la carga, giran y revelan la portada de un libro con un pequeño botón de «abrir» debajo. Cuando haces clic en ese botón, las páginas del libro salen volando. La captura de pantalla siguiente muestra tanto la página de inicio como la navegación ampliada.

Sección siete

Películas de sal
La mano se convierte en el cursor y agarra las diferentes salinas. Para los iconos pequeños, el dedo apunta al pasar el mouse. Otro estilo de navegación novedoso.

Películas de sal

Sensisoft
Hay dos formas de navegar por este sitio: pasando el mouse sobre el botón ‘Acerca de nosotros’ en la parte inferior, o haciendo clic en las flechas en cualquier dirección. Una vez más, no hay nada más que navegación en la página de inicio.

Sensisoft

Yuna Kim
Aquí se utiliza un estilo de navegación muy creativo. Una vez más, la navegación ocupa toda la página de inicio, pero las categorías se organizan como formas. Hay tres categorías principales que se indican mediante cuadrados, triángulos y círculos.

Yuna Kim

Cathy Beck Communications
En este sitio se utiliza un sistema de navegación interactivo eficaz. Al pasar el cursor sobre cualquiera de los conjuntos de iniciales en la parte inferior, aparece un menú. La abeja en la parte superior izquierda es una novedad, pero no estoy seguro de su practicidad o el motivo: cuando haces clic y mantienes presionado, todo en la página se reduce de tamaño y se colapsa en la esquina inferior izquierda hasta que sueltas el botón del ratón de nuevo.

Cathy Beck Communications

Re-cordones de piedra pequeña
Quizás un poco cursi, pero definitivamente sobre el tema: la navegación en este sitio de música se presenta como un amplificador, y las perillas son los enlaces. También me gustan los botones grungy para las redes sociales justo debajo del amplificador: todo funciona bien en conjunto.

Re-cordones de piedra pequeña

Investigación de Alzheimer en el Reino Unido
Este es un sitio de desplazamiento vertical y, a medida que se desplaza hacia abajo, los enlaces vuelan hacia la pantalla en forma de círculos morados. Muy creativo e interactivo.

Investigación de Alzheimer en el Reino Unido

Zervice
En este sitio, puede simplemente hacer clic en los botones de navegación en el lado izquierdo de la página, pero ¿por qué haría eso cuando al hacer clic en el botón rojo justo debajo de la camioneta lo lleva a un viaje por la ciudad? Te detienes a intervalos y puedes aprender más dónde estás o continuar, y una pequeña camioneta en el extremo izquierdo de la página muestra tu progreso a través del menú. ¡Muy creativo en verdad!

Zervice

TBWA / Hakuhodo
Página de inicio increíblemente interactiva y creativa: es una de esas páginas en las que cuanto más la miras, más ves, observa al hombrecito saltando arriba y abajo de los cables del telégrafo. Solo hay cuatro categorías para este sitio, pero muchos de los objetos de la imagen lo llevarán a ellos; simplemente mueva el mouse por la pantalla y disfrute de la interactividad.

TBWA / Hakuhodo

65 publicaciones
Otro sitio más que utiliza toda su página de inicio con fines de navegación. Sin embargo, este es un poco diferente: puede perder mucho tiempo simplemente moviendo el mouse por la pantalla; cada pequeño movimiento cambia las sombras de todos los colores de la página.

65 publicaciones

La forma sigue la funcion
El contenido de este sitio es una colección de experiencias interactivas HTML5. La navegación se presenta como hojas de casos que se expanden cuando se hace clic en ellas.

La forma sigue la funcion

Envíos de Oz
Este es un estilo de navegación simple, pero no obstante creativo y bien presentado. Los enlaces de navegación son las imágenes que cuelgan de la pared, lo que las convierte en una parte integral de la imagen general. Este estilo de navegación es algo que solíamos ver de vez en cuando, pero es más inusual hoy en día.

Envíos de Oz

Conclusión

Es de esperar que haya visitado algunos o todos los sitios enumerados y haya visto por sí mismo lo creativos que son sus menús de navegación.

¿Qué estilo es tu favorito? ¿Ha creado un estilo de navegación único que le gustaría que veamos? Comparta sus comentarios y enlaces en la sección siguiente.