工作流程：动画项目到Web背景。WebGL/HTML5/Javascript是视频背景限制的可行替代方案吗。需要建议。

Question

和我之前的许多人一样，我现在面临着任何web开发人员/设计师都必须遇到的最大挑战：创建个人投资组合。如果你像我一样是个完美主义者，那么你知道在任何一个想法中找到满足感是多么困难，尤其是当这个想法直接反映你的天赋、技能和整体能力时。为客户制作网站：没问题。为自己做一个网站：世纪之战。在

我以前的个人公文包网站总是很基本的，因为它们使用了许多在典型的网络公文包中可能找到的共同元素。这里有一点jQuery同位素，有一点滚动.js在这里，把它包装在响应式设计的基础框架后面。繁荣。Instopresto，你有一个投资组合…一个看起来和感觉都像其他人的投资组合。在

现在我不想重新发明轮子。一个投资组合应该完成它的本意，展示一个人以前的经验/工作，并概括一个人的总体“能力”或技能水平。在

对于这一轮，我真的想要一个全宽视频背景。其他的设计元素都很容易实现。给网站提供一个偏移菜单，也许使用单页的极简设计，或者使用Ajax进行页面/内容导航。在

我一直对视频背景有问题。这是我们面对的HTML5视频的局限性，以及它在移动设备上的显示方式。强迫或诱使用户不得不按下播放按钮是扼杀这一想法的额外步骤，而使用图像作为后备手段首先会挫败使用视频的威严。在

不过，还有一种选择。使用三.js利用当今机器中通过图形渲染提供的技术，让我们创建一个用作全宽背景的动画。它跨浏览器兼容，在平板电脑和移动设备上运行良好。在

我的问题是那些有丰富Javascript或python经验的人，以及那些使用过三.js以前。我通常使用Cinema4D制作动画，因为它在自身和后效之间提供了流畅、无缝的工作流程。我已经创建了一个三维元素，赋予它动画，并创建了一个相机来捕捉它。在

如何从Cinema4D导出以供WebGL使用和三.js. 网上的大多数教程/信息都已经过时了。即使是从C4D到Blender再到WebGL的可行工作流也会对我有用，只要有人了解这个过程就可以了。在

下面是几个例子，激发了这个项目的灵感：

http://mrdoob.com/lab/javascript/threejs/css3d/periodictable/-使用CSS3来实现整体功能，这是非常棒的，也是我要做的美学复制。在

http://blogs.truthlabs.com/2013/11/12/illustrator-webgl-workflow-tips/-这篇教程很棒，但是基于搅拌机我是在无人区。对于一个简单的解决方案，这是很好的。在C4D中创建完全不需要时间，这是如何将其导入WebGL。在

感谢您的任何建议，并花时间通读这篇文章。在

-干杯， 布兰登·戴恩