maxkrieger / awesome-aframe Goto Github PK

A collection of awesome things regarding A-Frame VR. Easily build WebVR experiences.

• Official Resources
• Community
• Learning
• Components
• Integration
• Scenes

Straight from the horse's mouth.

• Official Site
• Team Site
• Examples
• MozVR Codepen

Find human beings using A-Frame.

• Slack
• Made with A-Frame Tumblr
• Twitter
• IRC: irc://irc.mozilla.org:6697/#VR

Learn how to use A-Frame.

• A-Frame - Virtual Reality on the Web Simplified
• Hands-on With Virtual Reality Using A-Frame, React and Redux
• Schneller Einstieg in die WebVR Entwicklung mit A-Frame (German) - Translated
• WebVR mit A-Frame: Einführung & Grundlagen (German) - Translated
• Introduction to A-Frame - Slides from talk at Mozilla Taipei (by @daoshengmu)

• "A Review of Mozilla's A-Frame WebVR Framework" (by AR/VR Magazine)
• "Responsive Web Design with A-Frame" (by @alexrkrass)

Learn about the entity-component system which A-Frame is based on.

• Entity Systems Wiki
• Wikipedia Entry
• How A-Frame is Different from Other 3D Markup Languages
• Das Objekt-Komponenten System von A-Frame verstehen (German) - Translated
• Eigene Komponenten für A-Frame programmieren (German) - Translated
• Kommunikation zwischen A-Frame und JavaScript (German) - Translated
• How to Write an A-Frame VR Component

Third-party A-Frame components (of the entity-component system).

• Component Boilerplate - Boilerplate for creating and sharing A-Frame VR components
• Along Path - Interpolating an entity's position along a path
• Extrude and Lathe - Extrude and lathe geometries
• FPS Look - Facilitates controlling entity rotation directly with captured mouse
• Gamepad Controls - Gamepad controls using HTML5 Gamepad API
• Layout - 3D layout of child entities
• No-click Look Controls - Intuitive desktop view controls without requiring mousedown + drag
• OBJ and MTL Loader - Loader for .OBJ models and .MTL materials
• Physics - Rigid-body physics
• Proxy Controls - Connect input devices from your desktop to your mobile phone with WebRTC.
• Text - Polygonal text
• Collider, Explode, Spawner - Collection of components for collision, geometry explosions, and entity spawning
• Asset Lazy Load - Assign asset loading order and delays

Integration with existing tools, frameworks, and libraries.

• aframe-jade-boilerplate
• aframe-role
• D3.js - A-Frame with D3.js [Video Tutorial]
• Vue.js + TweenMax demo (by @cheapsteak)

Use React with A-Frame. Share your A-Frame React Components!

• aframe-react
• aframe-react-boilerplate (with Webpack)
• aframe-react-starter
• React + Redux Demo (incl. switching between 2d and 3d)
• React + TweenMax Demo (by @cheapsteak)

• a-invaders - Space invaders game [Code]
• a-wakens - Star Wars Audio Visualization [Code]
• VR Website Navigation (by @drawvr)
• Tron-Inspired VR Website Experience (by @drawvr)
• Minecraft-Inspired VR Website Experience (by @drawvr)
• Movie Theater (by @drawvr)
• EEVO - 360-degree image with transitions
• Hershey Sweet Lights - Holiday scene [Code]
• MeetupVR - Switching interaction between 2D and 3D [Code] [Post]
• Ricoh Theta S Live Preview - Live video preview with the Ricoh Theta S [Code]
• threeschwifty - 360-degree photo and video viewer [Code]
• VR GIF - GIFs in VR [Post]
• Virtual Art School Tour (by @withersc) - 360-degree photos with navigation
• 360-Degree Photosphere Viewer - 360-degree photo viewer with navigation [Code]
• Space Themed Ecommerce Store (by @drawvr)
• Tunnel Ride (by @drawvr)
• Wheel Ride (by @drawvr)
• Equalizer Ride (by @drawvr)
• Test Scape (by Michael Verdi)

Your contributions and suggestions are heartily welcome. Check out the guidelines and make a pull request.