Blog
A-Frame 1.1.0 - AR, Quest 2 Support, hand tracking, compositor layers, immersive navigation
A-Frame 1.1.0 is out! Core functionality is more polished and robust than ever. Full support for WebXR AR module and initial and experimental integration for upcoming and exciting WebXR APIs like immersive navigation, hand tracking, compositor layers or hit tests
A-Frame Newsletter 2
What's up with A-Frame, a WebVR framework for building virtual reality experiences, from Dec 16, 2019 to May 16, 2020.5⃣ hours of @aframevr tutorials are now available on my YT channel 🤓
— Danilo Pasquariello (@theDart76) March 20, 2020
👉 https://t.co/L0lHa2F5qM
🗣️ RT and spread the word to help beginners learn, support me as a content creator, or just for good karma 🙏#WebXR #WebVR #Immersive #training #elearning #upskilling #skills pic.twitter.com/xYdd8Xr58e
Finished laying out the maze. Added a simple camera control. Going to flesh it out into an orbiting camera. This builds on the AABB collision detection and animation work. @aframevr #THREEjs #indiedev https://t.co/uyh1YeF3Pe
— ripter001 (@ripter001) February 13, 2020
What would the night sky look like if we replaced the Moon with planets in the Solar System?
— Kodub (@KodubDev) April 28, 2020
My new VR experience, Planets by Earth, built with @aframevr and #threejs is finally finished!
You can try it out here: https://t.co/y32TAPAUvM pic.twitter.com/Ped8eyxb7V
Incredible feeling to win the Best of AR grand prize at @mitrealityhack! During the weekend hackathon, our team built Draft360, a spatial storyboarding tool made with @aframevr, @threejs_org, @glitch, and @nreal. pic.twitter.com/t8wHYoNxz5
— James 서 (@lossless) January 20, 2020
VR scene with spatial sound and dynamic lighting made with @aframevr #webxr here: https://t.co/oqdgqm5tez pic.twitter.com/67keKD0VtK
— mhellar (@mhellar) January 13, 2020
Hacking Spider-Man VR physics by yourself! https://t.co/QDLD672BNB
— Tal Kol (@koltal) January 10, 2020
WebXR is so easy to modify on @glitch, game made with @aframevr
https://t.co/0NjDyYvVoL is officially LIVE 🚀 Its a virtual living room for watching tv with friends, and I built it atop @aframevr @sveltejs and @Firebase over the past couple months. Its been a labor of love and I'm proud of what it has become 😊 Claim your username #vr #WebXR https://t.co/iSGbWAwi0s
— Devon Bradley (@devonsbradley) March 10, 2020
Great news! Magic Leap controller support now available on @aframevr 👏 3 cheers for Alfred! 🔥🥳 https://t.co/lBOH6JaMI3
— Magic Leap Developers (@magicleapdevs) February 6, 2020
A-Frame 1.0.4 is out 🎊 Bug fixes thanks to the community family 🙏@magicleap controller support ✨ by Alfred Tarng and new hand models 🤲 from @arturitu Enjoy! Release notes: https://t.co/kczGke4ZBb
— A-Frame (@aframevr) February 6, 2020
Hand tracking 🤲 is now available for WebXR content on Oculus Browser! Set hand tracking in chrome://flags to “Hands an Pointers” and enter VR on @aframevr example https://t.co/bzPDwdGCuN Pinch to select 🤏 palm to exit VR mode 🤚 Thanks to @abolgar Check library for updates 👊 https://t.co/JcMRpauaJm
— Diego (@dmarcos) February 5, 2020
Virtual fireworks!
— Lee Stemkoski (@ProfStemkoski) April 20, 2020
Particle effects created in A-Frame @aframevr with the Shader Particle Engine library. Live example at https://t.co/yStTEPM08g (audio make need time to load).https://t.co/a3Wjzyfz8w
Just released a new video tutorial on the environment component of @aframevr "Easy Environment in A-Frame" https://t.co/zByPDjLzxX#WebXR
— 🌷𝗦𝗼𝗿𝘀𝗸𝗼𝗼𝘁🌷 (@Sorskoot) February 21, 2020
A-Frame 1.0.3 is out to wrap up the decade! 🎇 It irons out a few more kinks post 1.0.0 Thanks to everyone that helped with bug reports and QA 🙏 Details in changelog: https://t.co/gVSCOlzRp9
— A-Frame (@aframevr) December 30, 2019
Experiment today with Immersive navigation ⛵️ in the @Oculus browser!
— Diego (@dmarcos) May 6, 2020
Enable WebXR navigation permission in chrome://flags and use @aframevr master builds (see code)
Try: https://t.co/LFAlDocAbZ
Code: https://t.co/jjpEDjGM87
Subscribe: https://t.co/aPJZOcaWQo pic.twitter.com/vaMHIfBL2V
#3D #website created by Planet Voodoo using @aframevr technology to introduce an interactive VR story about a real life #UFO encounter https://t.co/K4iSkxTWYl pic.twitter.com/eorEag9TvP
— Planet Voodoo (@PlanetVoodoo) January 4, 2020
https://t.co/Mx7VSz0MQp is a web based virtual museum prototype we are working on @augmersive !
— Tamrat (@tamrrat) <a href=”
It's built with @aframevr & viewable on @oculus quest, @magicleap, desktop & mobile browsers!
If any museum wants to hire us for a custom VR experience my DM is open 😀 pic.twitter.com/b8a9TfB2PM?ref_src=twsrc%5Etfw”>April 27, 2020https://t.co/Mx7VSz0MQp is a web based virtual museum prototype we are working on @augmersive !
— Tamrat (@tamrrat) April 27, 2020
It's built with @aframevr & viewable on @oculus quest, @magicleap, desktop & mobile browsers!
If any museum wants to hire us for a custom VR experience my DM is open 😀 pic.twitter.com/b8a9TfB2PM
first draft of my new website, not even sure if i wanna spill this drip on it. uses ur webcam for immersive ascii art via @p5xjs, interactive 3D scene using a star wars x-wing for testing with @aframevr, UI with @jquery… bet pic.twitter.com/hvXtabrFB2
— RAREGEMS (@_RAREGEMS) April 22, 2020
https://twitter.com/tamrrat/status/1254751202249760768Woke up with a weird idea, and just had to work it out. Spent all morning high fiving the air.
— Ruben van der Leun 🕴️ (@rvdleun) April 13, 2020
I present you: Don't leave 'em hanging.#aframe #OculusQuest #webxr pic.twitter.com/Gbj2S4Uq5T
Image Tracking and Location-Based AR with A-Frame and AR.js 3
We’re happy to announce AR.js 3 and A-Frame integration featuring new image and location based tracking.
For detailed API reference and source code check the official documentation and the Github repository
Experiment with AR and A-Frame
Google Chrome and Oculus Browser are now shipping WebXR enabled by default for VR headsets. The Web magic doesn’t stop there. AR is also coming to the standard and you can experiment today on Android ARCore compatible devices and Chrome 79 or newer.
Enable the experimental WebXR AR module in chrome://flags and make sure your page is served over HTTPS. A-Frame 1.0.3 or newer automatically detects AR and shows the new Enter AR button:
A-Frame v1.0.0 - WebXR Support, AR Mode
Today marks A-Frame’s fourth birthday. Four years ago, on December 16th, 2015, we released the first version of A-Frame to make it easier to build VR experiences and make the Web keep pace with the VR industry.
With the help of a community of hundreds of thousands of developers over the years, we’re releasing A-Frame v1.0.0 to support the coming out of the WebXR spec which has been under discussion for the past several years. The upgrade to A-Frame v1 and beyond will become necessary on more and more browsers as they deprecate WebVR and only support the WebXR specification.
To clear confusion, WebXR refers to both AR and VR support on the Web. To that end, we’ve included an AR mode out of the box in A-Frame for browsers that support ARCore and ARKit. In production, make sure to use HTTPS for VR and AR support.
We’d like to thank in part Google for providing a bit of funding to us at Supermedium to help develop and maintain WebXR support for A-Frame. And to thank people within Google, Oculus, and importantly the Web community for testing this version for us. We’ll continue to provide necessary updates to A-Frame.
We’d also like to celebrate now 300+ contributors, 10,000+ GitHub stars, and 300+ email subscribers to the A-Frame project.
If you’d like to continue to support us, please subscribe to the A-Frame newsletter where we’ll not only provide updates and showcase community projects, but requests for testing and user feedback support every now and then to keep us going in this grassroots project.
Read the release notes and changelog.
A-Frame 1.0.0 is out! 🥳 With full WebXR support shipping now in Chrome 79 and Oculus Browser stable channels. Deliver VR experiences instantaneously to millions of users today! Happy immersive Christmas! 🎄
— A-Frame (@aframevr) December 16, 2019
We're still at it! Today marks the exact date of @aframevr's fourth birthday, and we're excited to release v1 with the help of the #WebVR community. https://t.co/rlvFSpjBvu https://t.co/DHgRoEgb9f
— Supermedium (@supermediumvr) December 16, 2019
For those who are using AR.js with #aframe in WebAR apps, please import latest #aframe, v1.0.0 has been shipped 🚀
— Nicolò Carpignoli (@nicolocarp) <a href=”
This will avoid problems with new Chrome 79 that has WebXR Device API enabled by default.
Thanks to @aframevr team for the great work. It's outstanding.?ref_src=twsrc%5Etfw”>December 15, 2019For those who are using AR.js with #aframe in WebAR apps, please import latest #aframe, v1.0.0 has been shipped 🚀
— Nicolò Carpignoli (@nicolocarp) December 15, 2019
This will avoid problems with new Chrome 79 that has WebXR Device API enabled by default.
Thanks to @aframevr team for the great work. It's outstanding.
Hey devs! 👋 Remember to serve your content over HTTPS to enter VR mode in Chrome with A-Frame 1.0.0. WebXR is not available over HTTP.
— A-Frame (@aframevr) December 16, 2019
🎉I'm SUPER excited for the 1.0.0 release of @aframevr now that #WebXR is shipping in Chrome 79🎉
— Kent Bye VoicesOfVR (@kentbye) December 16, 2019
There's SO much potential of merging spatial computing with the open web to form the #widerweb & early seeds for what may become "The Metaverse."
Congrats to the @supermediumvr team! https://t.co/FuEgbBstFS
A-Frame Newsletter 1
What's up with A-Frame, a WebVR framework for building virtual reality experiences, from Jul 12, 2019 to Dec 6, 2019.The return of the A-Frame roundups! Thank you for subscribing to the email newsletter if you have! If you have not already, subscribe through aframe.io/subscribe.
A-Frame v1 with WebXR and AR support will be releasing shortly as the industry-wide rollout of WebXR commences. Everything is ready to go after a bit more testing. After years of work, we’re excited to be ready for the wave on day 1.
And we’re excited to release Night Sky, a VR planetarium built with A-Frame to look and learn about the stars! You can set your location and see constellations above you in real time.
Without further ado, check out cool A-Frame projects from the recent months.
Built a huge 5ft Gameboy you can fully play in Web VR - https://t.co/RxkwFVwtPO - open source & made with @aframevr @dmarcos @Tojiro pic.twitter.com/nUsdLOqLTd
— Tal Kol (@koltal) December 6, 2019
Built Flappy Birds VR with @aframevr ! WebVR is awesome. Warning, game is intense - https://t.co/Z1b4fqoX9E pic.twitter.com/fCGvYcWEq2
— Tal Kol (@koltal) November 20, 2019
A demo of the different modes and opportunities to workout with Towermax Fitness Drill Track.
— TowermaxFitness (@towermaxfitness) November 19, 2019
The length of running you see is 6 meters, in VR it's 12 meters with the room extender.
Full Video here:https://t.co/dHF3bsg4E2#vrfitness #OculusQuest #webxr #runningmotivation pic.twitter.com/UtukWV5zAe
Thank you @spaceappslondon âï¸Had a blast playing with @aframevr again + NASA models to make this with @Rushlet_ and @PrinaShah2 The story from Apollo to Artemis in webVR: https://t.co/bh4U7bBrr6 ð ð§ pic.twitter.com/oN3Yly5GRi
— Sumi Senthi (@SumiSenthi) October 20, 2019
Slowly learning how to play a #WebVR marimba.
— Oliver Fei (@OliverFei_VR) November 26, 2019
You can try it out here: https://t.co/xpS5mIwia2
Made with @aframevr and #threejs #VR #music #instrument pic.twitter.com/uRfsoS3QUY
Done and submitted. Here's a clip of yesterdays stream playing the finished the @aframevr #webxr game build for the #js13k competition. It's intense… pic.twitter.com/xENSMiSgLA
— ɬıɱɱ᧠ÆÆ¡ÆÆÉ ð· (@Sorskoot) September 13, 2019
Amazing AR poster made by @tzs007 for @HBO using @aframevr Awesome work! ð pic.twitter.com/Jdm7XbG65P
— A-Frame (@aframevr) December 1, 2019
Added haptics, keyboard support, a basic menu system, and a name to the #WebVR rhythm game prototype I made a while ago with @aframevr.
— Oliver Fei (@OliverFei_VR) August 11, 2019
You can now play Cadenza!! here: https://t.co/wDzrUnvRtW
We got new enter AR / VR icons!🎉Thanks to @klausweidner @theDart76 @brendanciccone @andgokevin designs and everyone that provided feedback. Leave your thoughts in the comments👇 pic.twitter.com/loDglNJjXA
— A-Frame (@aframevr) December 2, 2019
Here's a sneak peek at a feature in the upcoming "Barista Express" update!@MadeWithAFrame @aframevr #webvr #webxr #vr #barista #gamedev #aframe pic.twitter.com/5t6vaMhmuH
— Construct Arcade (@ConstructArcade) October 22, 2019
Yay! New office doggy ��@googlechrome is now shipping AR ð experimental features as part of the WebXR implementation. You can play with them today using @aframevr thanks to @klausweidner Have fun! Instructions in the comments pic.twitter.com/PyFHUDbjrN
— Diego (@dmarcos) October 29, 2019
US Civil War resurrection with @aframevr using #ARjshttps://t.co/FDVTUdIywc pic.twitter.com/rj1Jrtz7VH
— Vinh T Nguyen (@VinhTTU) August 22, 2019
A Week of A-Frame 170 - 172
What's up with A-Frame, a WebVR framework for building virtual reality experiences, from Jun 21, 2019 to Jul 12, 2019.OculusQuestのコントローラーの座標とアクションを読み取って、動的にアニメーション生成するVRできたーーー！JavaScript初心者すぎて、めちゃくちゃ苦労したけど、丸一日頑張ったらなんとかなったー！やったー！#OculusQuest #aframevr pic.twitter.com/buT2gLRNVK
— 零 (@shadow_burst) June 23, 2019
Messing about with client side per-vertex AO baking in @aframevr, over the top right now, but cheap & easy 😉 Props to #threejs, @mrdoob & @aframevr team 👍. I had to code next to nothing myself, octree for raytracing in <80 lines…mind blown🤯#webxr #webvr pic.twitter.com/MVh55Ytj8w
— Paul Brunt (@super_eggbert) July 11, 2019
A new component for aframevr that allows you to include normal html and css in your scene. Plus, it allows for direct manipulation and interaction from inside aframe, so you can quickly build UI using simple html and css. https://t.co/wLD0WrzJSM@aframevr #vr #webxr #webvr pic.twitter.com/ME4LkwN0aH
— Paul Brunt (@super_eggbert) June 30, 2019
VR portfolio in Oculus Quest with A-Frame https://t.co/SfnT5ZX2wl #aframevr pic.twitter.com/rWKV2kTziH
— だら🍔技術系投稿サービス運営中 (@dala00) July 5, 2019
"The Journey To My New #WebVR Website" 🚀
— Danilo Pasquariello (@theDart76) July 5, 2019
( series of steps before bringing it to life ) 👣
3. "Come To Daddy" 🎣@aframevr #TheJourneyToMyNewWebVRWebsite#WebXR #VR #UXofVR #Immersive #WebDesign pic.twitter.com/OYCqiGvgns
VR radio controled car with stick. (also wasd control is available for pc browser) https://t.co/EqJo4jW7IJ #oculusquest #oculusquestdev #aframevr pic.twitter.com/0pm7MBXYx4
— だら🍔技術系投稿サービス運営中 (@dala00) June 22, 2019
A Week of A-Frame 164 - 169
What's up with A-Frame, a WebVR framework for building virtual reality experiences, from May 10, 2019 to Jun 21, 2019.Thanks to @aframevr for making it so easy to develop this easter minigame! Took two of us maybe 15 hours from start to finish. #vr #webvr pic.twitter.com/ugYJf5Szh5
— Ted Wallace-Williams (@ted_w_w) June 3, 2019
本日の進捗です。
— すぎどん (@sgidon) June 3, 2019
コントローラーからブロック置いて削除できるようになりました。#oculusquest #oculusquestdev #福岡XR部 #aframevr pic.twitter.com/8qh62x39nG
Finished a basic prototype for a rhythm game made with @aframevr .#WebVR #VR #indiedev #gamedev pic.twitter.com/RTifrSKjoE
— Oliver Fei (@OliverFei_VR) May 15, 2019
A change from the usual fitness routine?
— TowermaxFitness (@towermaxfitness) May 28, 2019
Try out Moon Rider in the Punch Mode:https://t.co/P3X1LNSs5R
It is ideal for practicing for the tower, also WebVR!
Here is an article about it on VRScout:https://t.co/uMneAcciI i pic.twitter.com/xFaRI831QF
Tonight’s rabbit hole: a few hours of @aframevr on @glitch and you have an optical illusion you can step into. W A S D to explore 🔎 https://t.co/Ur3xWLkiAw https://t.co/Ph14RHebHu
— Kate 🎉 (@SBinLondon) June 17, 2019
"The Journey To My New #WebVR Website" 🚀
— Danilo Pasquariello (@theDart76) June 18, 2019
( series of steps before bringing it to life ) 👣
2. "A Bit Of Both" ⚖️@aframevr #TheJourneyToMyNewWebVRWebsite#WebXR #VR #UXofVR #Immersive #WebDesign pic.twitter.com/XE7noRUKYG
Ever felt like re-arranging your #bathroom furniture? We developed this application a few months back to test @aframevr using a #cannonjs physics engine. The# interactive tool can be used on all desktop browsers at https://t.co/Qd10hsl5aW #webGL #3d #aframe #3dtools #cannonjs pic.twitter.com/xBMYZfoeMh
— Pikcells (@PikcellsUK) May 29, 2019
Like 15% done, but working on an @aframevr guide for building user interfaces. Will include using slice9, layout, raycaster, state components for building menus that dynamically affect the application, hand-attached menus, pagination, XHRs, texture atlas. https://t.co/FOiuaY43wq pic.twitter.com/bYmg3EytpT
— Kevin Ngo (@andgokevin) May 10, 2019
A Week of A-Frame 162 + 163
What's up with A-Frame, a WebVR framework for building virtual reality experiences, from Apr 25, 2019 to May 10, 2019.We've released @aframevr v0️⃣.9️⃣.1️⃣! Follow up fixes and improvements to 0.9.0 such as WebXR compatibility and browser updates, new component events API, and improved animation performance. https://t.co/bFF0mUVZho
— Supermedium (@supermediumvr) April 25, 2019
🔧 We've released @aframevr v0.9.2 with fixes and improvements around link traversal and auto-entering VR where supported (e.g., @supermediumvr). Thanks to @sromline @towermaxfitness for reporting the issue and helping us track it down! https://t.co/MKVUkvyX1H
— Supermedium (@supermediumvr) May 7, 2019
🔷 What will be the equivalent of the Hugo Award for VR? Come catch a glimpse with Blue Cyber, a science fantasy VR series. You are charged to protect the galaxy, given the powers from a mysterious artifact. Experience episode 1, now playing on @supermediumvr. pic.twitter.com/RbpqA1VN8G
— Supermedium (@supermediumvr) May 3, 2019
👾 A multi-legged procedural creature swirls around you. Does it want to play? Built with @aframevr by @snayyss and @kif11. Visit Monster or Friend in @supermediumvr. pic.twitter.com/mC1m2jB4Xo
— Supermedium (@supermediumvr) May 8, 2019