恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
汉堡图标编年史
0.0°
2014-11-12 自译外文 规范/资料 原作者: Oshyn.com 举报 26626 15 27 4

汉堡图标的历史,从设计者到以后的应用的阐述。

我们都看到了汉堡包图标。事实上我们大多数人可能每天都在使用它。

它已经成为网站和应用程序设计的主要图标。

甚至可以看到它在谷歌浏览器的右上角。

最近,人们有很多争论---把汉堡图标用在侧面的菜单是否是一个好主意,

但更多的人想知道它是从哪里来的,它是如何得到如此广泛的应用的。

设计者

来源: Cox and Hall

设计师Norm Cox是为“施乐之星”做设计的,他是世界上第一个图形用户界面设计师。

自1982年以来设计师Norm Cox是Cox&Hall的联合创始人同时也是交互/体验设计顾问。


Geoff Alday是一名很称赞的软件设计师,他去寻找汉堡包图标的设计者并

找到下面的视频

这是在1990年,由ACM CHI1990大会赞助,告诉这个小部件的历史。来源:Brad Myers


在Vimeo里,他发电子邮件给Norm Cox领导,高兴地分享汉堡包图标的起源故事。

以下是他所说:“它的图形设计意味着非常简单的“路标”,功能令人难忘,模仿了最终显示的菜单列表的外观。

组合一些像素在一起,它是非常明显的,而且简单的。

我认为我们只有16×16像素渲染图像。 (也可能是13×13...记不太清了)。”

“施乐之星”之后,汉堡包图标消失了一段时间。


复活

随着更新,更小的智能手机界面出现,设计师不得不寻找一种方法,使一切契合在一块4英寸的

屏幕上。目前还不清楚是什么应用程序先使用它,但有些人还记得用汉堡包图标的第一个

应用程序有:

iOS的语音备忘录

这似乎是最古老的汉堡包图标(不包括施乐)

作为一个菜单按钮。它出于2009年6月17日,是适用于iPhone3Gs的。

点击它会弹出录音和选项的列表。

来源: osxdaily.com


iPad里的Twitter

推特是第一个应用程序,由Loren Brichter在苹果工作时创建。

在此之前于2008年,一直用汉堡包图标表示列表。

现在看来似乎并非巧合的是苹果的设计师使用过此图标。

来源: iTunes


Facebook使用的趋势

Facebook的似乎也得到了巨大的贡献在传播使用汉堡包图标的菜单中。

它在2008年开始该网格图标。

来源: The Full Signal

在2009年,

来源: Arstechnica

在2010年

来源: Apk Dad

Facebook已经使用了侧面菜单和所有他们所做的连接网格。

这似乎是汉堡包图标的第一踪迹。

它看起来像苹果公司的汉堡包图标复活的最大原因。

他们提出了智能手机以及需要简洁,紧凑的显示。

他们已经是施乐创意的粉丝,并开始使用它在自己的界面上。

从那以后,巨大的社交媒体应用程序使用了它。

目前,在网站和应用程序上它正在被用来表示侧菜单栏,以及列表。

一些最大的应用程序使用包括:

Reeder阅读器

Reeder阅读器使用的图标在订阅列表。

Path社交应用

Path社交应用也是汉堡图标的第一个采用者之一,并仍然使用它来显示导航。

您还可以找到它的Twitter的引导和星巴克进行导航。

在大多数的应用程序中,它都如雨后春笋般冒出来,并已成为行业标准去显示增加的选项。

来源: lmjabreu.com

网站近来也开始使用它。隐藏的菜单很适合简约的设计,并且流行于很多设计师设计网站时使用。

来源: http://kirichik.com/

这里是一个建筑公司的网站

来源: Siena Construction

未来

汉堡图标已经成为Web和应用程序设计最基本的icon,它似乎去任何地方所用时间都很快。

上图中汉堡图标做出了回应,似乎是表示要在这里停留。在UX/ UI设计界里汉堡图标已经火了。

有人说现在必须停下来,把它替换成一个简单的菜单或者方便的标签栏。

有些人不喜欢它,有些喜欢它。

其它在网站上的复杂列表用了简单的汉堡包图标看上去是美妙的设计。

所以,是不是有更多的问题探讨何时以及如何使用?

更新:2014-11-12

收藏

15人已收藏

viewworld909

越努力,越幸运。

  • 31

    作品

  • 307

    粉丝

  • 48

    关注

  • #每周临摹#ps制作文字长阴影
  • 在Photoshop里设计一个圣诞节的电子邮件通讯
  • 如何在ps里创建扁平图标
  • 5个思路来设计网站上看到的大块横幅

    猜你喜欢

      2014-11-12 自译外文 规范/资料 原作者: Oshyn.com 举报 26626 15 27 4

      汉堡图标编年史

      0.0°

      你确定要举报汉堡图标编年史

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2014年11月12日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      27
      15
      4

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录