隐式菜单(Navicon)的网站设计...

  • 经验类型规范/资料原作者:Nataly Birch

  • 经验属性自译外文
  • 经验版权署名
7087 2 11 2015-03-21

Navicon 是一个网页设计的趋势,驱使我们去看一看导航菜单,这是它们在设计中的角色和用户体验中的地位。然而这个概念并没有减弱它的意义和在导航中的重要性,并且它可以提供设计人员和开发人员更多的创作自由

        Navicon的设计取决于许多因素。不过多数情况下人们更青睐时尚、简洁、线条柔和的风格。这些小小的图标可以很好地包含精致而复杂的菜单。

          加上动效或者延时效果能让你的设计更上一层楼。相比对美术水准的提升,实用价值更值得称赞。这些效果能适用于各类导航,能准确传递信息,甚至帮助更快地响应系统要求,更好地与移动平台整合。

    下面的列表包括支持隐式菜单与导航图标组合的网站设计的实例。     

     ewebdesign

     在这个案例中,我们看到了一个美丽的图象背景和视差效果。菜单图标位于界面的右上角。它打开了一个非常详细的导航菜单等板块。 

sampedro

放置在首页的是妙趣横生的口号和一个时尚的精美图象,没有什么能够转移用户的注意力因为这是个具有吸引力的组合。隐式导航是一个理想的解决方案,它悄悄地将重点从导航转移到复杂的后台

Chapoleone

一张精致的照片背景,散发着奢华和细腻。这里如果复杂的导航会破坏整体效果,所以滑出菜单隐藏在一个小的符号放置在左上角。

Maecia

Maecia通过它动态和高端的背景来吸引访问者进入项目。为了不让在线访问者感到困惑和迷失,主页包含了一个可以用鼠标点击一次打开的隐藏式导航。

We are Empire

We are Empire基于优秀的经典色彩和大量的留白来展示极简设计,使其别出心裁,耐人寻味。在这里,隐藏的导航与整体风格完美搭配。

Brand Junkie

华丽的圆形复古风格的徽标从第一秒就捕捉了用户的眼球,吸引了所有的注意力。该navicon是理想与环境的融合,尽管很难立即找到它,但很快它便进入了视野。

Intelart

Intelart有一个梦幻般的黑暗主页,背景和前景之间形成理想的对比。在这里,无缝汉堡包按钮与右上角菜单标志相呼应,自然地引出了图片式导航。

Monograph


Monograph的特点是navicon不是看似典型的的三横条纹按钮,通过这种有趣的方式有助于它成为环境的一个组成部分,理想地与整体效果相适配。

Camp David Film

主导航占据了正确的位置,团队明智地隐藏了二级导航。后者可以节省​​了大量空间,并给予额外的位置展示瑰丽的照片。

Michael Villeneuve

Michael Villeneuve选择采用更简单的感觉,无疑正中用户的下怀。结合漂亮的轮廓图形,视觉上富有吸引力的小动画,和干净的纯色背景创造了一个惊人的和独特的用户体验。

ExitFilm


Exit Film是一种基于吸收最新网页设计趋势的居中版面设计,类似汉堡包式按钮占据了中心位置,并且完美地与非传统的页面设置保持和谐。

lalignerouge

这里,navicon的意图是完善整体设计以及增强效果。拥有精心设计的曲棍球式按钮,这种按钮适应主页,使得它发挥了重要的作用。

Xander

在线访问者不会因没有主导航而苦恼,也不会感到乏味主要得益于风景如画的照片和通过全屏的图像滑块。在这里隐式菜单是一个很好的选择。

Tannbach

使用汉堡式按钮和隐藏式简单的拖拽式的面板菜单可以让你成为主流的一部分。Tannbach采用这样的解决方案。然而,它并不缺乏互动性和精致。主页看起来独一无二归功于加入了动态导航元素的图片背景。

Cofa Media

Cofa Media通过其耐人寻味的视频背景(描述该机构的工作流程)来吸引用户。为了更好的用户体验,它采用稍微拉长的汉堡式按钮引出了占据了整个屏幕的主导航。

Alt_Cph14

Alt_Cph14无疑有一种能够捕获注意力的界面外观。这种创意设计运用计算机故障的视觉特效和独特的蓝色单色背景了给人留下一种生动的印象。简单和原始的汉堡式按钮完美地与整个主题搭配。

ballclaw

ballclaw展示了一个精致的内饰,精致的图形,精巧的排版和优雅的配色方案。该navicon配合完美的主页设计释放出一种雅致的感觉。

HoochCreative


标题从首页的整个画面中脱颖而出,像太阳一样闪耀着并占据着首要的位置。标语在这样一个没有特点的环境中有一种厚重的力量。而菜单图标则成为一个巧妙的衬托。

SamDallyn


Sam Dallyn致力于引导用户的注意力至其作品集。这种网格样式和居中布局做的很完美,极其强调视觉效果。一切看起来都很精致,甚至极小的汉堡式按钮也不引人注目地位于左侧边栏,紧密地与设计线对应。

dreamandreach


主页被整齐地分成两个部分,需要由鼠标点击激活,并控制动画控件。汉堡式按钮虽然对于肉眼很难看见,但在整体构图中相当必要。

Demodern

Demodern具有鲜明而醒目的navicon在一个鲜明对比视频背景和黑色帆布上。此外,它有一个优美的几何形体,可以让菜单整洁地与主页设计相配,为用户提供了出色的可读性。

结论

Navicons完美地补充和丰富了不同的网站设计。其主要目的是把注意力集中于工作或正规公司的网站,无疑占据了一个有力的市场。

 

全部评论:2条

更多作品

发表评论

取消

点击右上角
分享给朋友吧

分享到

取消

每人每天仅限5票,快给你心仪的作品鼓励的一票。

投票