Uma coleção de experiências imersivas construídas com A-Frame e AR.js, explorando como os ecossistemas digitais estendem o espaço físico através de sistemas de Realidade Virtual (VR) e Realidade Aumentada (AR).
🎓 Material pedagógico para estudantes do ISTEC
MyXRProjects apresenta exemplos práticos de computação espacial, onde ambientes tridimensionais e marcadores físicos são traduzidos em comportamento, movimento e interação imersiva.
Em vez de focar apenas no espetáculo visual, estes trabalhos enfatizam:
- O espaço tridimensional como interface dinâmica
- A fusão entre o ambiente físico e o digital
- A interação mediada por perspetivas espaciais (óculos VR e câmaras móveis)
Transforma um navegador web num ambiente de Realidade Virtual imersivo (WebXR). Através de um componente personalizado de teletransporte e de um cursor baseado em olhar (gaze-based interaction), o utilizador pode navegar de forma fluida entre diferentes cenários 360º ("Solar", "Cyber" e "Home").
Uma experiência de Realidade Aumentada baseada em marcadores (marker-based AR).
Ao detetar um padrão visual impresso ou digital (BELLO_MARKER), o sistema injeta um avião de papel em 3D que executa uma órbita suave e paramétrica com turbulência simulada em tempo real, jogando com a poética do desaparecimento e do voo.
Estes projetos introduzem conceitos fundamentais de tecnologias imersivas (XR), incluindo:
- Desenvolvimento WebXR utilizando a framework declarativa A-Frame
- Criação de componentes customizados em JavaScript para manipular o ciclo de vida da cena (
tick,init) - Visão computacional básica e deteção de marcadores com AR.js
- Modificação dinâmica de materiais, matrizes de rotação e translações no espaço 3D
Os códigos são intencionalmente limpos e modulares, permitindo aos estudantes:
- Compreender a hierarquia da cena (Entity-Component System)
- Modificar as propriedades físicas e comportamentais dos objetos
- Expandir a lógica para novos cenários e marcadores
- A-Frame (v1.2.0 / v1.5.0) – Framework WebXR
- AR.js – Realidade Aumentada para a Web
- JavaScript (ES6) – Lógica de componentes e animações matemáticas
- HTML5 / CSS3 – Interfaces de sobreposição (Intro GUI)
Clona o repositório:
git clone [https://github.com/o-teu-utilizador/MyXRProjects.git](https://github.com/o-teu-utilizador/MyXRProjects.git)