比花瓣还专业！200多款顶级游戏的UI和交互设计都在这里！

很时，做设计需要找参考。果是普通的 UI 界面或者 Banner 之类的，在Dribbble、Pinterest、 花瓣、Behance 样的网站上翻看一下，至少能够梳理出一思路。果你需要的是更加规范的指引，个时在各种设计规范、官方指以及各种设计系统的 PSD、Sketch、 Figma 文件里面，能够寻找到具的某一类控件的具设计。

可问题于，如果设的一专业领域的产品，满足一些复杂的交互，需应对一系列麻烦的需求，能找到的参考又多少？

其实，还有一个重要的计参考来源：游戏。

不同的游戏，交互差别大。简的交互比如「Flappy Bird」只需要点击屏幕，甚至不需要考虑点击的位置就可以完成操作，但是大型即战略类游戏比如 Dota2，涉及的交互就会复杂多。

游戏集了多经考验的交互方式，承载着巨大的息量，有着成熟的计，可以说是非常有价值的学习对象了。

实，如果真要有针对性的游戏交互和UI 参考并难，但是通会遭遇到几种情况：

• 找游戏后，和游戏界面计无关的搜索结果多
• 官方的APP商店，或者游戏官，营销宣传容过多
• 自己安装个游戏、测试、截图、分析成本太高
• 同类、同风的游戏信息太分散，整合成太高

这个时候，Interface in Game 这个网站价值体现出来了:

Interface in Game

网站链接：https://interfaceingame.com/

游戏业庞大，是这也使它在设计层上，信息常分散。概念设计师汇在 ArtStation，界设计师在 Behance 和 Dribbble 合作品，而玩家和开发者则汇聚在各自社区。这大概也是促成 Interface in Game 这个网站诞生理由吧。

个网站搜罗200 款最顶级的优游戏的相关的 UI 和互方面的资料。

首页，这些游戏会按照「题」、「元素」、「风格主题」以及时间（也就「近添加」）行划分，以满足寻找资料的不同需求。

可以直接挑选感趣的游戏行浏览：

不同的界面都根据它的「元素」功能行了划分，可以使用侧栏行速的筛选，比如游戏中的操作交互，其中不仅截图，还短视频行动态演示：

比如游戏中所涉及到的单，也被非常全面被截取出：

具体的界面截图当中，可以看到相关的标签，其实这些标签对应的就游戏界面中的不同的「元素」，点击它们就能跳转到同类的「元素」的合集界面。另外，通过右下角的功能按钮点赞、下载或者返回对应的游戏主页：

可以单游戏的页面中，挑选相应 UI，也可以通过顶部的 Screenshots 选项，无差别所的游戏截图视频当中，挑选所需的类别/元素：

比如加载页面的设：

虽然网站整体服务于游戏行业的设师，并且它创建的初衷也面向游戏行业的，但它所提供的功能服务对于很多其他领域的设师同样非常高的参考价。这些优秀的游戏，横跨多不同的题风格，所的这些作，每一都一设宝库，比如封面的字体，配色，布局整体的视觉风格设就很多得学习的方：

Interface in Game 这游戏界面设网站，填补了 UI 界面设灵感搜集领域的一空白，网站提供游戏界面截图的，主一帮游戏好者需游戏设团队，他们基于自身的需求搭建这网站。

总体，Interface in Game 将游戏界面设的灵感参考服务，到了相当不错的程度，帮设师节省了相当多的分类搜集的作。

目前这个网站唯一的问题可能就是访问速读略慢了一点，有梯的同学用梯会快多。