A-Frame 是一个用于构建 VR 场景的 Web 框架。它不仅仅是一个个 3D 场景元素，或是一个标记语言，更是一个可以给 three.js 提供可描述、可扩展、可组合结构的实体组件库。

![6f011d10-298c-11e7-845e-c3c5baebd14d.jpg](https://lc-kjcS77HU.cn-n1.lcfile.com/0c7919c448d9f26d8967.jpg)

A-Frame 支持大部分 VR 设备，包括 Vive、Rift、Daydream、GearVR、Cardboard、Oculus Go 等，也可以用于 AR。你可以用它构建出非常有意思的 VR 场景。

## 特性
👓**简单易学**：只需要添加一个  `<script>` 和 `<a-scene>`，就可以开始创作了，无需安装也无需构建。想马上尝试？打开 https://codepen.io/leadream/pen/KjqBKM 看看下面这段代码实现的效果。

```html
<html>
  <head>
    <script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
      <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
      <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
      <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder>
      <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
      <a-sky color="#ECECEC"></a-sky>
    </a-scene>
  </body>
</html>
```

❤️**描述性的 HTML**：HTML 是易读易懂的标记语言，基于 HTML 来创建 VR 场景，不仅方便编写，还很容易被其他人理解，比如开发者、设计师、创客，等等。

🔌**实体组件结构**：A-Frame 是一个实体组件框架，可以给 three.js 提供可描述、可扩展、可组合结构的实体组件库，开发者可以完全访问 JavaScript、DOM APIs、three.js、WebVR 和 WebGL。

🌐 **跨平台 VR**：支持大部分 VR 设备，包括 Vive、Rift、Daydream、GearVR、Cardboard、Oculus Go。即使你没有这些设备也没关系，A-Frame 也可以在电脑和手机上运行。

⚡️**高性能**：A-Frame  从底层就进行了很多优化，因此即使是大型 WebVR 应用也可以以 90fps 完美运行。

🔍**3D 审查器**：A-Frame 提供一个内置的 3D 审查器，`<ctrl> + <alt> + i` 就可以打开它，来对里面的元素进行审查了。

![WX20190625-100225@2x.png](https://lc-kjcS77HU.cn-n1.lcfile.com/c267d52dc0a3754e99a3.png)

🏃**组件**：A-Frame 提供了很多底层组件，比如几何图形、材质、光线、投影等等；还有很多社区组件可以使用，比如粒子系统、物理模拟、海水等等。

🌍**已被广泛使用**：A-Frame 已经被诸多国际化大公司使用，比如  Google、Disney、Samsung、Toyota、Ford、Chevrolet、Amnesty International、CERN、NPR、NASA 等等，还有一些公司为 A-Frame 贡献了代码。

## 开始吧！
下面有一些链接，可以帮助你快速入门：
- 文档：https://aframe.io/docs/0.9.0/introduction/
- 示例：https://codepen.io/leadream/pen/KjqBKM
- Weekly Blog：https://aframe.io/blog/
- 作品展示：https://aframe.io/showcase/
- 代码仓库：https://github.com/aframevr/aframe/

**A-Frame 由 zhiyima 推荐**


下載.png

A-Frame，构建 VR 场景的 Web 框架

Torch AR 是一款移动应用，他可以让你只需要拖拖拽拽就能设计出非常专业的 AR 原型。它还支持 Figma、Sketch 等元素导入，并将最终的成果分享出去。

![Torch AR](https://lc-kjcS77HU.cn-n1.lcfile.com/5397fc707580286cb209.png)

# 拖拖拽拽完成设计
Torch AR 不需要额外学习，一切都是非常直觉式的操作。你只需要拖拖拽拽将那些元素拖放进去，调整它们的属性，就可以实现复杂的交互效果。

![拖拖拽拽地设计](https://lc-kjcS77HU.cn-n1.lcfile.com/c09fa9b5f8edd1b59cce.png)

# 从其它设计工具导入
你还可以先在 Figma、Sketch 等你常用的设计工具中设计一些基本元素，再将它们导入到 Torch AR，给他们添加交互效果。

![从 Figma、Sketch 导入](https://lc-kjcS77HU.cn-n1.lcfile.com/96e67f17dd9e521e90d1.png)

# 分享与发布
将你的设计生成链接，分享给其他人，让大家可以立即体验到你设计的的 AR 效果。对于企业版，你们还可以在一起协作。

![与团队一起协作](https://lc-kjcS77HU.cn-n1.lcfile.com/923b90314aaed0575f3c.png)
