NEWS$show=/search/label/news

Here's where you'll find all the latest news about technology for children. We love to follow cool new inventions on Kickstarter and we hunt out all the latest announcements about tech toys and gadgets for the coming Christmas holidays. You'll also get our take on children's technology stories in the media.

REVIEWS$show=/search/label/review

Our kids technology product reviews are intended to help you work out whether a toy, gadget or kit is a good fit for your child or family. There's lots of cool stuff available, but is it the right choice for the child or teenager that you are buying for? We'll help you make the right choices and get the best value for money.

GIFT GUIDES$show=/search/label/gift%20guide

Parents, grandparents, aunts, uncles, and friends assemble. We create gift lists to help you make good choices for kids technology which helps them develop the right skills for the future. We research the best in Coding Toys and Games, Making / Craft Tools and Kits, STEM/STEAM related gifts, Programmable Robots, Electronics Kits and Gadgets for Tech Age Kids and Teens.

PROJECTS$show=/search/label/project

Get crafty with technology. Here we'll post all our ideas and projects using technology to get creative and making with kids. You'll find anything from making a lemon battery to a glow-in-the-dark Minecraft sword. Our projects are tried and tested on our own kids or at events we run, so we are sure you can have a go at home with your kids. Some of our projects use specific tech gadgets which we provide links for you to purchase.

STEM$show=/search/label/stem

STEM stands for Science, Technology, Engineering, and Mathematics. In recent years there is an increased focus in these areas of study. We like to include Art and Design too, so we often talk about STEAM (A stands for Art). At Tech Age Kids we believe Coding is a new literacy and children need to understand how technology works, practice making skills and grow in their curiosity to make a better future for us all.

CODING$show=/search/label/coding

Coding is increasingly being recognised as an important skill for children to learn. Some will learn to code at school or at a coding club, but it's brilliant if they get support at home too.

ELECTRONICS$show=/search/label/electronics

We think it's really important for kids to get hands-on with electronics and learn how to make circuits and write code to control hardware. Younger kids can start with conductive playdough. For kids who like to combine craft and tech, littleBits are fab. And we love SAM Labs wireless electronics components for making it easy for kids to make Internet of Things inventions. Lots of electronics kits for kids have support for the Arduino microprocessor environment. The DuinoKit Jr is one of our favourites. Arduino is a fab skill for older kids and teens to develop.

ROBOTICS$show=/search/label/robotics

We love robots at Tech Age Kids, especially programmable ones. We've got lots of them and write reviews and projects that use them. Our programmable robots for kids buying guide is a good place to start if you're not sure what's available. Roby the mBot Meccano robot dog is one of our popular projects and has been with us to lots of events. Our Ozobot LEGO trailer is fab for kids who love LEGO and robots.

MAKING AND CRAFT$show=/search/label/making

We're advocates of the creative use of technology, but this needs to be balanced with developing physical skills such as papercraft, woodwork, clay modelling, technical drawing and soldering. If children don't develop these skills as they grow up then physical making projects can become frustrating rather than fun. The Maker Community uses the term 'making' as a broad term to include all sorts of artisan skills or craft activities. Being able to make things can lead to life-long hobbies or even careers. It's a great feeling to be able to take a project from an idea in your head to a real object that does something. We're particularly interested to explore products that combine maker skills with tech skills such as electronics but others focus purely on the physical making skills that are still important to modern making.

πŸŽƒ Code a 3D VR Halloween Scene with A-frame for the Meta Quest

Code a 3D VR Halloween Scene with A-frame for the Meta Quest (2)


This project shows you how to make your own 3D VR Halloween scene that you can view using a Meta Quest (2) VR headset or on a phone. This is a good project for teens who have a Meta Quest headset. There's something very cool about designing your own scene and then moving around it in VR! It's early days for VR and the metaverse but it looks like it will play an important role in the future so it's a good idea for young people to understand how to create for these platforms.

This project runs in the Browser on the Meta Quest and allows you to create a fully immersive VR experience.

What is A-frame?

A-frame is a platform that allows you to write code that creates 3D objects and scenes that you can view in a web browser. You can develop and view A-frame projects in a web browser on a computer. You can also open A-frame projects in a web browser on a VR headset or a phone for a VR or AR (augmented reality) experience.

There are lots of ways to create VR experiences with code. We chose A-frame because it's easy to get started with, has good documentation, offers a proper VR experience, and has lots of options for extending to more advanced techniques when you are ready. 

Using Glitch to create an A-frame project

We used the Glitch online editor to create our project. Glitch has a handy A-frame starter project that you can remix to get started. 

You can view the project at: https://halloween-pumpkin.glitch.me

Online safety: You must be at least 13 to create a Glitch account. Glitch projects are public by default so do not share personal information.

Controls: Use WASD, arrow keys and dragging with the mouse to move around on a computer. 


Viewing our Halloween scene on a Meta Quest (2)

Open the Browser app on the Meta Quest (2). Enter the url 'https://halloween-pumpkin.glitch.me'. Click 'VR' in the bottom right to enter full VR mode. 

The camera will move when you look around. Use the thumbstick on the right controller to move around. See if you can look behind the pumpkin.

Press the Menu button on the left controller to exit to the browser or the Home button on the right controller to quit the browser. 

Coding with A-frame

A-frame allows you to write code in a web page using a language that builds on HTML (the language web pages are written in.)


We'll take you through the concepts that are used in this example so that you can understand the code and make changes. 

Using an A-frame environment 

A-frame environments are a really quick way to get started with a VR scene. 

We've used the 'checkerboard' environment with purple 'spikes' as dressing and some 'fog' for atmosphere. 

You can find other things to change in the environment documentation.

Adding objects

The table is made of 'box' 3D shapes, the pumpkin is a 'sphere' (squashed using 'scale') and its stalk is a cylinder.

Important concepts: 
  • The unit of measurement is meters, so a radius of 0.25 gives you a pumpkin that measures 50cm across. This is important for making things are the right size for a person in a VR environment. 
  • The player camera is positioned at "0 1.6 0". 
  • The table top is positioned at "0 1 -6" which is 1 meter off the ground and 6 meters in front of the player. 

Using Entities

Entities can be used for lots of purposes, they are less specific than the 3D objects such as sphere. We have used Entities to group objects together to scale the pumpkin and its stalk, and to make all the objects use shadows. 

Wrapping an image around a sphere

To make more visually interesting objects, you can wrap a 2D image around a 3D shape. The pumpkin has a 2D 'skin' as a material. This was created using the Google Drawings tool but you can you any 2D drawing tool that can export png or jpg images.  You can use our Pumpkin skin on Google Drawings as a starting point for a different Pumpkin face.



Maths: If the width of the image is the circumference (so it can wrap around the pumpkin) then the height needs to be half the circumference (so it can wrap from the base to the top of the pumpkin.) The actual measurements don't matter, it just needs to be a 2:1 ratio.

Adding movement controls

The example includes code for using the Meta touch controllers. Use the right joystick to move around. 

Make it yours

  • Create a Glitch account and remix our example project
  • Try changing the environment settings
  • Add more pumpkins and scenery, see the A-frame documentation
  • Use different colors - you can use any of the CSS color names or Hex color codes. 
  • Create different pumpkin skins (export from your drawing tool and drag into Glitch to create an Asset that you can use in your project.)
  • View your scene on a Meta Quest headset. Use the menu button on the left controller to go back to the browser and 'refresh' when you make changes to your scene.

Summary

We showed you how to use A-frame to create a VR scene that you can view and move around in on a Meta (Oculus) Quest headset. We looked at the concepts involved in creating 3D objects and scenes, adding 2D skins as materials, and creating controls for movement. 

Not got a Meta Quest 2 headset yet? Check our of review of the Meta (Oculus) Quest 2 VR headset for teens or our review of the new for 2023 Meta Quest 3
  
24 days of Scratch coding book cover and cute penguin
Name

2013,13,2023,1,3d printing,5,3DTin,2,accessories,1,activities,1,adafruit,1,advent calendar,2,adventure games,1,amazon,13,amazon fire,2,amazon prime,1,android,6,angry birds,1,animation,6,anki,1,app,19,app toy,4,app toys,8,appcessories,1,apple,1,apps,25,arcbotics,1,architecture,4,arckit,9,arduino,33,art,1,artificial intelligence,5,astronauts,2,astronomy,1,augmented reality,11,automaton,1,awards,1,battle bots,2,battling robots,2,bedtime,1,big kids,103,big tablets,1,bigtrak,1,bike,1,binary,1,birthday,4,bitsbox,1,black friday,2,blockly,1,blogging,1,bloxels,1,bluetooth,2,board games,7,book,2,books,35,boolean box,1,breadboard,2,bricks,1,brixo,1,buying guide,11,camera,4,cameras,1,card game,1,careers,2,catroid,1,celebration,1,cellphone,1,ces,2,chemistry,2,chess,1,christmas,44,circuit cubes,1,circuit playground,8,circuit scribe,10,cleaning,1,climbing,1,code clubs,1,code-a-pillar,1,codebug,1,coder,2,coding,173,cognitive learning,1,communication,1,comparison,1,competition/challenges,9,computational thinking,3,computer,2,computer games,2,computer science,2,computer vision,2,computers,1,computing,1,conductive playdough,2,connected toys,7,construction,40,conversational ai,1,cozmo,1,craft,34,craft cutter,3,creative thinking,1,creativity,3,crochet,1,crowdfunding,120,css,1,cubs,1,curiosity,1,curious chip,1,cyber monday,1,dads,1,data,2,deals,4,dens,2,design,10,design process,1,design thinking,7,digital parenting,2,digital skills,13,disability,1,disney infinity,1,dog tech,1,dolls,2,drawing,2,drones,2,duinokit,1,earth day,1,Easter,4,ebooks,11,eco,1,edblocks,1,edison,5,edtech,1,education,79,egypt,1,electricity,1,electronic pets,2,electronic toys,2,electronics,141,electronics kit,4,electronics kits,1,electtronics,1,elementary,1,elenco,2,energy,1,engineering,17,entertainment,1,ereader,2,ereaders,6,esafety,1,escape the room,1,event,21,ewriter,1,exercise,4,family,12,family tech,2,fathers day,1,Festival of Code,1,fiction,1,fire,1,fitbit,1,fitness,1,fitness tracker,3,flotilla,3,flow charts,1,flutterbye fairy,1,flying,1,force awakens,2,force friday,2,future,2,gadgets,36,games,35,games console,2,games consoles,8,gaming,3,gift guide,55,gifts,12,girls,24,giveaway,4,glow in the dark,1,google,1,grace hopper,1,grove,1,hackaball,2,hacksoton,1,halloween,13,halloween costumes,1,hardware,3,headphones,1,health,1,hexbug,3,hexbug aquabots,1,hexbug project,1,high school,1,history,26,home,1,home education,2,homeschool,4,hot toys,7,hour of code,3,html,4,humanoid,4,ICT,1,in app purchasing,1,indiegogo,13,industry event,9,innotab,5,innotab 3,3,innotab 3s,1,internet access,1,interviews,1,invention,4,ios,3,IoT,4,ipad,7,ipad mini,1,iphone,2,jacquard,1,japan,1,java,1,javascript,5,k'nex,7,k'nex robotics,1,kano,8,keyboard,1,kickstarter,92,kids,3,kindle,7,kindle fire,8,kit,2,kits,5,kodu,1,kubo,1,label printer,1,languages,1,laptop,1,laptops,1,last minute,1,leap motion,1,leapfrog,2,leappad,7,leappad 2,3,leappad ultra,3,leappad2,1,leapreader,1,learning,5,learning resources,5,learning tablet,2,learning tablets,9,leds,2,lego,36,lego boost,1,lego chain reactions,1,lego mindstorms ev3,5,lego power functions,2,lego technic,5,lego wedo,2,let's start coding,1,lights,1,lightseekers,1,little kids,110,littlebits,16,logiblocs,1,logic,3,logical thinking,4,loom,1,machines,1,magnetic,1,make it,2,makeblock,16,makedo,1,maker,6,makey makey,6,making,54,mardles,1,mars,1,mars rover,1,marty,1,math,3,maths,1,mbot,6,mbot ranger,1,me arm,1,meccano,6,meccanoid,5,meccanoid 2.0,1,merge vr,1,mews,1,michael faraday,1,micro:bit,9,microbit,6,microcontroller,5,microscope,1,microsoft,2,middle school,6,miles kelly,1,mindstorms,3,minecraft,21,minecraft mods,1,mixed reality,1,mobile,2,modular electronics,2,monsters university,1,morse code,2,mothers day,4,motion capture,1,motors,2,mover kit,3,movie,1,movies,4,mu,1,mu toys,1,munzee,1,music,10,my first robot,2,national dog day,1,nature,1,new,1,new year,1,news,170,news coding,1,nikola tesla,1,nintendo,2,nintendo switch,3,ohbot,3,ollie,3,on the web,1,opinion,19,origami,1,osmo,4,outdoors,13,ouya,1,ozobot,10,papercraft,3,paperwhite,1,parental controls,2,parenting,34,parrot,1,pc,1,people,8,pet tech,2,pets,3,phone,1,photography,1,photon,1,physics,3,pi day,1,picks,2,pimoroni,1,pinoccio,1,pixel kit,1,pixelart,4,play,2,playstation 4,3,plezmo,1,pocket code,1,pocket money,1,pokemon,4,pokemon go,4,poll,1,pre order,1,pre-teens,2,prehistory,1,preschoolers,42,primary,41,printable,1,products,34,professor einstein,1,programming,15,project,102,projects,12,puzzles,4,python,10,racing,1,raspberry pi,29,reading,12,reivew,1,remote control,1,research,3,resource,34,resources,2,retro,2,review,223,rights,1,robot,11,robot dog,1,robot fish,1,robot wars,3,ROBOTERRA,1,roboticals,1,robotics,32,robots,140,role models,1,role play,1,romo,1,romotive,1,root,1,rover,1,safety,2,sam labs,6,samuel morse,1,sandbox,1,schools,3,science,16,scratch,48,scratchjr,3,screen time,2,screenless,15,screens,1,sensors,5,servos,1,simbrix,7,skills,1,skylanders,3,skylanders superchargers,1,skylanders swap force,1,smart pens,1,smartphone,1,smartwatch,1,snap circuits,2,social media,1,solar power,2,soldering,2,sonic pi,1,sony koov,1,sound,3,space,9,sparki,2,speaker,3,speech sythesis,1,sphero,12,sphero mini,1,spider,2,star wars,6,stars,1,STEAM,1,stem,10,stikbot,1,stop motion,2,stop motion studio,1,storage,1,story,2,strawbees,2,students,1,subscription,5,subscriptions,1,sugru,1,summer,7,swift,1,tablet,3,tablets,23,tangible coding,2,tech,3,tech age,1,tech craft,4,tech is bad,7,tech is good,4,tech toys,21,tech will save us,10,technology,2,technology will save us,3,teens,64,teknikio,3,tekno,1,teksta,1,tenka labs,1,tesla,1,textiles,1,thames & kosmos,2,the extraordinaires,1,tim berners lee,1,tinkercad,1,tinybop,3,toddlers,9,toot-toot,1,top pick,9,touch,1,toy,1,toys,5,travelling,1,TTS,1,TV,1,tween,1,tweens,119,tynker,2,typing,1,ux,1,vehicles,1,videos,3,view-master,1,views,10,virtual reality,8,voice assistants,1,voice recognition,2,vr,4,vtech,8,web,2,websites,1,wifi,1,wii,2,wii u,2,windows 8,1,wonder workshop,9,wowwee,2,writing,7,writing. education,1,xbox one,2,xyzprinting,1,
ltr
item
Tech Age Kids | Technology for Children: πŸŽƒ Code a 3D VR Halloween Scene with A-frame for the Meta Quest
πŸŽƒ Code a 3D VR Halloween Scene with A-frame for the Meta Quest
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaXnNM_h248nqZzuxFtoOG9-IyHi1vw76taXw4F9xF1uorpyr2Wr1bm70Y0OGDoUt6C_PWWx4hLfW1i6gW6Q-BmfR53QsXSfg6V4I_3MdKtRouSQ1g1mfV7dk8uajdBxOl-YbJl1VmnAJuDXbwgqqkhX_O_qHTwsWML-vv2tfnf3_7bpwy6RtoSwAG/s16000/meta-quest-halloween-pumpkin-a-frame-head.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaXnNM_h248nqZzuxFtoOG9-IyHi1vw76taXw4F9xF1uorpyr2Wr1bm70Y0OGDoUt6C_PWWx4hLfW1i6gW6Q-BmfR53QsXSfg6V4I_3MdKtRouSQ1g1mfV7dk8uajdBxOl-YbJl1VmnAJuDXbwgqqkhX_O_qHTwsWML-vv2tfnf3_7bpwy6RtoSwAG/s72-c/meta-quest-halloween-pumpkin-a-frame-head.png
Tech Age Kids | Technology for Children
https://www.techagekids.com/2022/09/code-3d-vr-halloween-scene-meta-quest-a-frame.html
https://www.techagekids.com/
https://www.techagekids.com/
https://www.techagekids.com/2022/09/code-3d-vr-halloween-scene-meta-quest-a-frame.html
true
15639169850959392
UTF-8
Loaded All Posts Not found any posts VIEW ALL Read more Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy