大家好，今天来为大家分享谷歌ux浏览器的一些知识点，和谷歌游览器的问题解析，大家要是都明白，那么可以忽略，如果不太清楚的话可以看看本篇文章，相信很大概率可以解决您的问题，接下来我们就一起来看看吧！

本文目录

1. 谷歌设计团队发布了一款动效神器,让 UI 和动效无缝打通
2. Internet Explorer 8 VS 谷歌浏览器
3. 看谷歌设计师如何使用Material

一、谷歌设计团队发布了一款动效神器,让 UI 和动效无缝打通

1、编者按：Google设计团队为了更好地推进 UI和动效设计，自己开发过不少新的工具，打通 Sketch2AE是其中之一，如今的 AEUX也是为了相似的目的而存在的一个全新升级的动效工具~

2、动效在设计当中的重要性是毋庸置疑的，它可以提供背景信息，可以指引用户进行交互和操作，提供有效的导航线索。但是，想要将一个全新的领域和信息整合到既定的、已有的 UX设计流程当中来，并不总是那么容易。

3、在 Lottie这样的动效渲染工具诞生之前，哪怕是距离现在很近的 2016年，现在来看感觉依然像是一个UX动效的黑暗时代，即便那个时候已经有很多新的设计模式。为 AE准备视觉素材通常意味着要用 AI来先制作相应的素材，经过复杂的导入和转换，经过大量不可避免的重设计、调整，这种不可预期的情况太多了，以至于设计师经常因此超出 Deadline。

4、为了尽可能地消除动效制作过程中可能存在的无用的步骤，我在 2016年中期开始在 Google内部构建一个名为 Sketch2AE的内部工具，它本质上是第一个在不同应用中间传输图层信息的工具。但是它并不仅仅是一个文件导入器，它还是一个将时间重新还给动效设计师的工具。2017年，它对外公开发布，并且帮助了很多设计师进行 UX的动效设计，以及借助 AE进行视觉设计的设计师。

5、 Sketch2AE中复古的图层传输过程

6、其实从 Sketch2AE那个时候开始，UX动效设计领域已经逐渐开始成熟了。现在，许多设计团队在设计的时候，已经开始思考，信息是随着时间推进，体验上有哪些改变。自从 Sketch2AE诞生以来，动效设计师大多和视觉设计师一同协作，在不断迭代过程中，寻找成功的解决方案，而这也不断推进着工具的发展，新的工具当中会逐渐集成设计师所需要的功能。

7、现在，我非常高兴能够同大家分享 AEUX这款工具。这是一个更加强大的设计系统，用来在 After Effect中进行 UX动效设计。

8、 Guide to Material Motion in After Effects

9、新系统的目标之一是支持更多主流应用，方便在团队内各个成员之间的协作的灵活性。如今在 Adobe的生态系统中，XD和 AI已经可以很好地进行数据上的共享和交换，但是在生态之外数据的共通性就没那么好了。但是，如果借助 AEUX，你可以从 Sketch和 Figma来导入图层，并且支持 Sketch最新的功能。除此之外它还有这些特色：

10、虽然如今 Sketch已经被广泛地运用，但是越来越多的视觉设计师开始使用 Figma了。AEUX旨在帮助更多的团队进行无缝地合作。

11、 Figma的核心功能是在线协作，因此导入图层数据是通过一个接入 Figma API的 web应用来完成。截至目前，Figma的插件还无法在设计环境中运行，这意味着图层的导入导出还是只能以更为传统的方式来进行。使用在线运行的程序，最大的问题始终是关于安全性的因素。

12、在验证过 AEUX的导出 APP之后，系统会要求你输入 Figma的文档 url，这个 APP会随即搜集好每一帧（画板）中所有的数据，每一帧都可以单独下载。任何所需要的图片也将被处理和压缩，将新的 AEUX.json文件拖放到到 AE中的 AEUX面板中，然后图层就会构建起来。

13、注意：AEUX应用不会跟踪用户数据，也不会以任何方式来查看或者存储你的设计。它会在本地帮你将浏览器中的设计转换为 AEUX JSON的格式。文件数据的访问权限是归数据的所有者所拥有。

14、基于自己对于其他设计师的工作方式的想象，来构建一款设计工具可能是很困难的事情。有时候，你的意图和想法可能并不具备真正的价值，又或者你精心考虑的设计路径并没有别人所勾画的好。实际上，我在构建 Sketch2AE过程中所学到的东西，比开发 Overlord（一款商业插件）过程中学的更多。

15、我在这些项目中所获得的最重要的教训，是要限制心智模型切换的数量。如果有人想要试图设计，就让他们设计下去，而不是强迫他们去阅读使用手册和教程。

16、和以前的机制不同，现在在新工具中，我们选择使用后台传输图层数据，以避免混淆。它们并不是完全实时的，但是当你从 Sketch切换到 AE的时候，图层面板会显示准备构建新的图层，这种机制简化了传输过程，让你更加专注于设计本身。

17、对我来说，整个设计过程中最令我印象深刻的地方，也是最为费神的地方，就是试图找到哪些东西是有用的，哪些是无效的。这和文件导入本身是截然不同的，通常文件导入的时候如果出了差错，就必须重新导入全部内容。但是 Overlord的核心理念非常不同，用户在需要的时候才传输必要的数据和内容。我希望这种理念能够成为 AEUX的核心理念，让用户彻底远离复杂菜单和插件面板之类的东西，让用户能够享用和预期中 AE相匹配的体验。

18、在之前的版本中，数据的同步和导出仅仅是在完成之后推送通知，并且是在 Sketch的窗口底部显示，很容易错过。这导致很多用户在导入数据的过程中，需要一直盯着，害怕错过信息。（这个设计确实非常糟糕，对此我很抱歉）

19、现在在 Sketch中新的悬浮面板为导入通知提供了专门的位置，并且这种设计也都延续到 AE当中。从内容更新、进度条显示到无法绘制元素的提醒，一应俱全，都会清晰地说明和呈现。

20、 UX动效设计正在不断发展，我们仍在试图寻找更合理的设计，确定哪些方法和技术是有效的、哪些是无效的，确定如何找到最好的设计方法。我希望我们所创造的 AEUX能够帮你更快地推进动效设计，拥有更加顺畅的设计流程。

二、Internet Explorer 8 VS 谷歌浏览器

连个目前都还是测试版，不过IE 8的一个优势就是全面支持微软的SilverLight科技。Silverlight，中文译为“银光”，是微软所发展的 Web前端应用程序开发解决方案，是微软丰富型因特网应用程序（Rich Internet Application）策略的主要应用程序开发平台之一，以浏览器的外挂组件方式，提供 Web应用程序中多媒体（含影音串流与音效串流）与高度互动性前端应用程序的解决方案，同时它也是微软 UX（使用者经验）策略中的一环，也是微软试图将美术设计和程序开发人员的工作明确切分与协同合作发展应用程序的尝试之一（另一个为 WPF）。

目前 Silverlight已受到各主流浏览器的支持，包含Internet Explorer、Firefox、Opera与Safari等，同时也支持Mac OS X操作系统，在Windows Mobile 6.0和Symbian(Series 60)手机等行动装置上也受到支持。与 Silverlight相同的开放原始码解决方案「Moonlight」则提供在Linux上的支持。

所以微软的IE8应该在功能上可能要比Google来的好些，尤其是多媒体方面的支持。而且目前的互联网的一些支持，比如网银只能在IE上运行，不能在其他的浏览器上运行，这也导致了IE无法舍弃的一个原因。

三、看谷歌设计师如何使用Material

1、   

Material Design提供了设计APP时所需的整套工具和指南，帮助你在用户体验设计过程中遇到困难时做出明智的决策。但当你的app不那么符合特定的使用案例该怎么办？在谷歌，当设计师要做的产品不那么适合这份指南的时候会如何？

2、Material Design提供了设计APP时所需的整套工具和指南，帮助你在用户体验设计过程中遇到困难时做出明智的决策。但当你的app不那么符合特定的使用案例该怎么办？在谷歌，当设计师要做的产品不那么适合这份指南的时候会如何？

3、Material Design指南应当因事制宜。透过此文，我们将细看Keep和Inbox这两个谷歌app，来理解它们设计过程中是如何改变一些规则，领会Material Design指南的整体精神后进行实际应用。

4、在谷歌设计一款全新的电子邮件Web应用可谓一个相当有野心的任务，尤其是在Gmail已经存在的情况下。借助新的Materail Design规则，Inbox团队企图创建更密集的UI、更特别的用户体验和品牌标识。就在Inbox设计团队在整合最初的设计时，Material Design尚仍在开发中。这提供了他们一个绝佳的机会：建立Material Design网页标准，以解决密集UI的设计问题。

5、Inbox最初的设计不够灵活，因为在13英寸屏幕上只有7封邮件的空间。这相比较于Gmail能展示16-20封邮件而言实在太少。Inbox的视觉设计首席Tim Smith解释道：

6、“如果你分别打开Gmail和Inbox，在视觉密度上有很大区别。在内容和留白之间找到理想的平衡就成了我们最大的挑战之一。”

7、通过调整网格、行高、文字表达，Inbox成功建立了密集型网页UI的设计标准，做到能展示12-17封邮件，每个邮件存在于一张Material Design卡片中。字体大小和外观也被设计成因个人设备不同而有所调整改变。例如，电子邮件的主题行会根据屏幕尺寸的增长而变化字体尺寸。

8、INBOX为了在小尺寸屏幕上适应尽可能多的信息而设计，设定了密集网页外观的MATERIAL DESIGN标准。

9、与Gmail比较，Inbox的视觉差异体现于头图的使用，头图会与捆绑的邮件内容相关。如果一个人使用Inbox来计划去纽约的一次旅行，举个例子，他们将会看到曼哈顿天际线的图片。Inbox还在左侧导航栏中使用了大量的icon，这些icon会根据它们在app中的功能被赋予不同的色彩。例如，当用户点击或轻触绿色的“完成”按钮，标题栏的背景色也会变成绿色，让用户持续的知晓变化和前后联系。

10、这种承前启后的图像使用也是Inbox不同的品牌体验的另一个鲜明特征。

11、INBOX会给绑定的邮件增加图像从而赋予它们意义。例如，去纽约旅行的飞机票和酒店预订邮件会配上城市的天际线照片。

12、对Inbox团队的另一个挑战是app标题栏的设计。最初的提议是设计成一个可调的标题栏，不会拉伸填满整个浏览器窗口，但取而代之的是会匹配内容的宽度。

13、“我们研究了这个方案的十几个变体，知道最终确定为你今天看到的全宽度标题栏。我们还通过几个原型的探索来决定最佳的搜索区域样式。”——视觉设计首席Tim Smith

14、既然Inbox的卡片能够缩放，这意味着每一次用户和邮件交互的时候都必须进行头部的调整。App的标题栏还包括了搜索区域和展示其他谷歌应用的菜单。这一处理方式让Inbox无需复杂化它的外观就能保持良好的响应。

15、Keep是一款跨平台的笔记应用，扩展折叠屏幕上的Material卡片让用户在添加笔记时集中注意力。改进过的底部导航栏也让人们能够通过一个轻触快速地新建笔记。

16、空状态主要出现在没有任何内容展示给用户的时候。Keep通过这种设计模式给用户一个空画布来起草他们的想法。贫乏的UI鼓励用户更多去探索app的搜索栏元素，扩展到显示图标筛选器；分类菜单让用户在列表显示和网格显示之间切换；左侧导航抽屉用于调整app的主要设置。卡片通过放大和缩小来提示用户其前后关系。

17、KEEP利用空状态来鼓励用户创建新的笔记。“动效方面我们耗费了诸多努力，从笔记流动展示的动态，到你打开和关闭它们的方式。”——谷歌KEEP软件工程师GENEVIEVE CUEVAS

18、当你重新设计一款app时，Keep团队的设计师和研发人员仔细研究了Material Design模式，并且最终应用了一些组件，比如让笔记与笔记区分开的卡片、让app设置更容易操作的左侧抽屉式导航和根据笔记内容不同而变化的菜单，比如在列表内容上加上勾选框以便于检查每条内容。总而言之，这些不同的设计模式最终创造了一个全新的功能体验，它建立在用户的使用场景和需求之上，是Keep这个应用的简单易用的关键。

19、再设计的过程中，Keep团队对Material核心导航做了一些实验，测试让一个可扩展的悬浮按钮替代现有的底部导航栏。需要指出的是，底部导航提供了简单的一键式动作来创建新的笔记。新型悬浮按钮则需求两步操作，第一步扩展选项，第二步才创建笔记。

20、“当我们发布了悬浮按钮后，一些用户抱怨没有了能够一键创建笔记的功能。”——谷歌KEEP软件工程师GENEVIEVE CUEVAS

21、这个改变看似对app的老用户和已经习惯了单触式导航的用户而言是个退步。Keep在测试后最终放弃了诸如悬浮按钮这样的核心Material组件，这是一个很好的例子来告诉人们，在使用Material指南时应该坚决拒绝强行套用不适合产品的指南的行为。

22、Inbox和Keep团队都利用了Material Design指南来帮助设计和开发应用。但当他们遇到一个对产品无用的案例时，他们会相应地调整设计。Material Design给了非常多的指引，这是建立于谷歌多年的UX之上的，但它不可能包罗万象。希望以上这些例子能告诉你，在符合其整体精神的基础上，设计时要按照实际需求来改变你的运用方式。

文章到此结束，如果本次分享的谷歌ux浏览器和谷歌游览器的问题解决了您的问题，那么我们由衷的感到高兴！