Five ideas for innovative navigation with practical tips

Inspirational concepts for offbeat website navigation from on-hover animation to sandwich menus, plus video how-tos on them.

readymag blog_five ideas for innovative navigation

There are numerous ways to make a navigation menu — and since almost all websites have some form of navigation — designers have to push their creative limits to make one that’s both remarkable and functional. In this piece, you’ll find a showcase of outstanding, unconventional, and stylish navigation menus in projects of Readymag users accompanied by video tutorials explaining how to recreate them.

Mitchell Haydn/Clements

readymag blog_mitchell clements' portfolio
https://m-clements.com/

One popular style of menu navigation uses on-hover changes on the main screen. This portfolio by Mitchell Clements pushes this idea to its limits.

Hello, I’m Panna

readymag blog_panna's portfolio
Panna's portfolio

This sparse yet inventive portfolio makes great use of sketch aesthetics, creating a sense of intimacy.

Light For Our Freedom

readymag blog_light for our freedom project
Light For Our Freedom

“Light For Our Freedom” is a project highlighting the fundraising campaign to illuminate the Latvian Monument of Freedom. The project offers thorough left-side navigation utilizing a scrollbar combined with a menu.

Actualidea

readymag blog_actualidea portfolio by michael pangilinan
http://actualidea.com/

A simple and well-structured sandwich menu adds a lot of strong visual presence to this portfolio.

Innovation Made Tangible

readymag blog_innovation made tangible
Innovation Made Tangible

The landing page for this prognostic survey by a Copenhagen creative agency comes as close to browser tabs as a webpage can get.


Note: some of screenshots and videos in this post reference our old user interface, so the current Readymag workflow may not look identical.

Find more tips from Readymag.