Hi PlayCanvas community!
I wanted to share my latest project—a gyro controller plugin I developed in just a few hours. This project required custom code to handle specific rotation challenges when converting device orientation angles (alpha, beta, gamma) to PlayCanvas-compatible rotations.
Rotation Mapping and Order Challenge
In this plugin:
- Alpha is mapped to Y
- Beta is mapped to X
- Gamma is mapped to Z
However, PlayCanvas applies rotations in an XYZ order (X ➔ Y ➔ Z), while gyro functionality needs a YXZ order (Y ➔ X ➔ Z) to produce the correct results. To address this, I wrote custom code that applies rotations in the right sequence for smooth and precise interaction.
Video Timeline
- 0-10s: Full 360° rotation
- 12-20s: Portrait-to-landscape orientation change, then back
- 22s: Adjusting camera rotation sensitivity
- 30s: UI setup overview
Check out the video demo to see the plugin in action! 
I’ll be sharing this code soon, and I plan to add a one-hand character controller for an even more interactive experience. If you’re working on a similar project or have any questions, feel free to reach out—I’d be happy to help! 
Looking forward to your thoughts!
#PlayCanvas #GyroController #3DInteraction #GameDev #RotationSystem