PS设计教程网欢迎你!

20款展现汉堡图标的新玩法设计方案(2)

文章来源于 优设,感谢作者 陈子木 给我们带来经精彩的文章!
设计教程/设计理论/设计理论2015-08-03
Hamburgers by Ragnar Vorel 设计师Ragnar Vorel 的这个微妙的GIF动画展示了他对于这些日常图标的认知,其中有几个汉堡图标和X型关闭按钮。 Minimalistic Hamburger Icon 有的设计师喜欢增加细节,有的设计师则喜欢

Hamburgers by Ragnar Vorel

20款展现汉堡图标的新玩法设计方案

设计师Ragnar Vorel 的这个微妙的GIF动画展示了他对于这些日常图标的认知,其中有几个汉堡图标和X型关闭按钮。

Minimalistic Hamburger Icon

20款展现汉堡图标的新玩法设计方案

有的设计师喜欢增加细节,有的设计师则喜欢极简化。这个简约汉堡图标就是简约的案例,不过不同于其他的许多汉堡图标,设计让中间的一横更细一点,可能是他觉得这么设计感觉更好更到位吧。

Menu Icon Animation

20款展现汉堡图标的新玩法设计方案

这是Andrew Kovardakov 所设计的“忍者汉堡”,图标中的每一横都被形象化为“忍者”,似乎旋转变幻间整个图标都拥有了一种独特的萌感。

Burger Menu

20款展现汉堡图标的新玩法设计方案

这是设计师Peeter Tvauri 的另一个设计方案,夹心饼干设计方案中加入了起司和沙拉,看起来更像一个真实的汉堡了……

What is the Hamburger Icon?

20款展现汉堡图标的新玩法设计方案

这其实是一篇好玩的文章,探讨汉堡图标设计趋势,你可以在这里发现一些有趣的争论。汉堡图标和汉堡的关系是怎样的?单色好还是多色好?反正挺开脑洞的。

Open & Close Menu by Romain Passelande

20款展现汉堡图标的新玩法设计方案

汉堡图标并非一成不变的,在APP和网站中,不同状态下图标状态是会改变的,这个案例中,设计用GIF动画展示了这一过程。

Hamburger Menu by Liam Spradlin

20款展现汉堡图标的新玩法设计方案

这个带有明显Material design 风格的汉堡图标像是复古的图书,大胆而略显粗犷。

Burger Icon vs. Word “Menu” by Andrey

20款展现汉堡图标的新玩法设计方案

当“菜单”遭遇“菜单”的时候,下面的设计就是答案。虽然两者重叠看起来有点多余,但是你不能否认这样的设计非常优雅,毫无违和感。

Open / Close by Armantas Zvirgzdas

20款展现汉堡图标的新玩法设计方案

当你看到这个图标的时候会想起“菜单”,汉堡图标被封装到框中之后,按钮的意象得到了强化,当你点击按钮的时候,汉堡图标会在框中旋转打开,菜单之意通过动画展现在你面前。

Animated Menu Icon – The Process by Sebastiano Guerriero

20款展现汉堡图标的新玩法设计方案

这个汉堡图标的设计同样非常值得学习,设计师通过分解动画展现了汉堡图标和返回按钮之间的状态变化。

结语

细小的汉堡图标真的不重要么?我能确定的是,当你为汉堡图标注入想象力的时候,它可以变得如此的生动,有着点睛之笔的作用。

版权所有PS设计教程网公安备案:苏公网安备 32058302001023号工信部备案:沪ICP备09005587号
aaa