来源:网络 作者:佚名
与其他用户界面细节一样,菜单的设计也在随着当今的潮流改变。一些变化能带来积极的效果,改善用户体验,还有一些却会破坏有利的形象。追随潮流是件棘手的事,尤其是在菜单上。
比如,隐藏式菜单和极简式导航栏最近正处于风口浪尖。但是,,它们并不适用于所有网站。相比之下,全屏菜单多数时候几乎都适用于所有项目。后者正在汇聚人气,因为它灵活易变,能够提升而非破坏用户体验。它在不经意间呈现了很多数据,整洁地排布文字与多媒体内容。当然,这使得主页又多了一层点击,但有时为了更好的用户体验,应该做这样的牺牲。
今天我们进行一场头脑风暴,来看20个新颖绝妙的全屏导航网页设计案例。
全屏菜单案例 MaeciaMaecia采用了讨人喜爱的蒸汽朋克外观,增添了一分独特的精细和机械感。基于图片的导航占据整个屏幕,与动态主页和主题高度吻合。
OlceseOlcese有好几个菜单,便于用户更彻底地探索这个网站,同时也强化了品牌识别。基于图片的网格式全屏导航中,充满了有趣的照片、漂亮的图表和令人愉快的效果。这些元素的结合扮演着至关重要的角色。
Moeko ABE摄影师的在线作品集还能是什么样?以照片为核心的主页明亮耀眼,导航运用了多媒体,为这位艺术家高调代言。菜单在整个页面投下柔和的阴影,呈现出美丽的照片链接。
Conference Awwwards颇具开创性的主页,一流的HTML/CSS/JS动画立刻引人注目,让人印象深刻。简单的导航占据了整个屏幕,视觉聚焦于导航链接。这是非常合理的方案。
DrygitalDrygital的主菜单流露出欢乐积极的情感。华丽鲜艳的渐变背景,非常有利于展现亮白色的导航。一如往常,菜单覆盖了整个主页。不过得益于半透明的背景,用户可以在着陆页欣赏一段视频。
Aleman’s DesignAleman’s Design有着无缝式的导航,与整个场景搭配良好,对美感有重大贡献。这个团队采用了非同寻常的方案,利用动画背景来强调菜单项。
Mas IndustriesMas Industries的特点是基于图片的全屏导航菜单,它从“汉堡”菜单中优美地展开。对金属部件的完美渲染散逸着冰冷严肃的氛围。虽然前景与背景的反差很弱,但另一方面,这种方案对系列设计有强调作用。
Danne Olsson壮观的照片背景,映入Danne Olsson的用户的眼帘,充满自然意象。为了弱化如此吸引眼球的核心元素,将视线引向更简单朴实的导航,他采用了很直接的解决方法,将全屏菜单与纯色背景相结合。