aulify · Sebenta

UC · Unidade de Competência · UC02638

Realidade Aumentada

AR, tracking, WebXR, casos de uso, UX

25h · 2.25 pontos crédito Curso: T. Multimédia ↗ Referencial oficial SNQ

Índice

Introdução
1. AR, VR, MR, XR
- 1.1 Definições
- 1.2 Hardware
2. Tipos de AR
3. Pipeline técnico
4. Ferramentas
5. Modelos 3D em AR
6. Design e UX para AR
7. Casos de uso fortes
8. Quando NÃO usar AR
9. Distribuição
10. Privacidade e ética
11. Liga a outras UCs
12. Conclusão
Apêndice A · Stack recomendada (2026)
Apêndice B · Recursos

Introdução

A realidade aumentada (AR) sobrepõe conteúdo digital ao mundo real, tipicamente através do ecrã do telemóvel ou de óculos com passthrough. Esta UC introduz a tecnologia, as ferramentas e — sobretudo — as decisões de design que separam um AR útil de um gimmick.

1. AR, VR, MR, XR

1.1 Definições

AR (Augmented Reality) — vês o mundo real + camadas digitais sobrepostas. Ex.: Pokémon Go, IKEA Place, filtros Snap, Google Maps Live View.
VR (Virtual Reality) — ambiente 100% digital, headset isolado. Ex.: Meta Quest, PSVR2.
MR (Mixed Reality) — digital interage com real (oclusão, sombras, ancoragem persistente). Ex.: Apple Vision Pro, HoloLens 2, Quest 3.
XR (eXtended Reality) — guarda-chuva para todos.

1.2 Hardware

Mobile AR — telemóvel/tablet como janela. Apple ARKit (iOS) e Google ARCore (Android) são as bases nativas.
Headsets MR — Vision Pro, Quest 3, HoloLens, Magic Leap.
Óculos AR leves — Xreal, Rokid, RayNeo (display básico, sem 6DoF avançado).
Projection AR — projetor + mapping (instalações, concertos).

Para esta UC, mobile AR (web ou nativo) é o foco.

2. Tipos de AR

2.1 Marker-based

Marker fiducial — desenho preto/branco geométrico (semelhante a QR). Funciona muito bem, mesmo em mobile fraco. Usado em livros AR, embalagens, museus.

Image tracking — qualquer imagem com bom contraste e detalhes únicos pode ser marker (foto de capa, póster, etiqueta). Mais natural mas requer iluminação adequada.

Object tracking — modelo 3D pré-treinado (peça mecânica, estatueta, brinquedo) reconhecido pelo dispositivo.

2.2 Marker-less (SLAM)

SLAM (Simultaneous Localization and Mapping) — o dispositivo: 1. Detecta features visuais (cantos, texturas) à sua volta. 2. Calcula profundidade (LiDAR no iPhone Pro; estereoscopia + IMU no Android). 3. Constrói um mapa do espaço enquanto se move.

Resultado: pode-se ancorar conteúdo no chão, mesa, parede sem nada físico. ARKit e ARCore detectam planos automaticamente.

2.3 Location-based

GPS + bússola + giroscópio → posicionar conteúdo no mundo. Pokémon Go (original), Google Maps Live View, apps turísticas.

Limites: precisão GPS (5-10 m), pior em interiores. Para precisão maior, combina-se com VPS (Visual Positioning System, Google) que usa câmara + base de dados de imagens.

2.4 Projection AR

Projecta luz num objecto real para o "aumentar". Concertos, retalho, instalações. Hardware específico (projetores calibrados + tracking 3D), normalmente fora do âmbito mobile.

3. Pipeline técnico

3.1 Loop

60 vezes por segundo:
  1. Captar frame da câmara
  2. Detectar features / marker
  3. Estimar pose (6DoF) do dispositivo
  4. Atualizar mundo virtual
  5. Render conteúdo 3D na perspectiva certa
  6. Compor com frame da câmara
  7. Mostrar no ecrã

3.2 6 graus de liberdade

3 translações (x, y, z) + 3 rotações (pitch, yaw, roll)

AR moderna usa 6DoF. Telemóveis antigos só tinham 3DoF (rotação) → conteúdo "voa" quando andas.

3.3 Anchors

Anchors são pontos virtuais ancorados a features reais. ARKit/ARCore mantêm: - Plane anchors — planos horizontais (chão, mesa) ou verticais (parede). - Point anchors — features pontuais. - Image anchors — quando seguem uma imagem. - Face anchors — para filtros.

Bons anchors = AR estável. Sem anchors = drift (conteúdo "escorrega").

3.4 Oclusão e luz

AR moderna: - Oclusão — pessoa real à frente esconde o objecto virtual (precisa de mapa de profundidade). - Iluminação estimada — render usa luz aproximada do espaço real. - Sombras virtuais no chão real.

Cada uma destas técnicas aumenta o realismo mas custa performance/qualidade do hardware.

4. Ferramentas

4.1 WebXR + AR.js + A-Frame

WebXR Device API é o standard do browser para XR. A-Frame (mozilla) torna 3D web simples; AR.js acrescenta marker tracking.

<!DOCTYPE html>
<html>
<head>
  <script src="https://aframe.io/releases/1.5.0/aframe.min.js"></script>
  <script src="https://cdn.jsdelivr.net/gh/AR-js-org/AR.js@3.4.5/aframe/build/aframe-ar.js"></script>
</head>
<body>
  <a-scene embedded arjs="sourceType: webcam;">
    <a-marker preset="hiro">
      <a-box position="0 0.5 0" material="color: #2D6CDF;"
             animation="property: rotation; to: 0 360 0; loop: true; dur: 4000">
      </a-box>
    </a-marker>
    <a-entity camera></a-entity>
  </a-scene>
</body>
</html>

Imprime o marker "hiro", abre o ficheiro em mobile (HTTPS necessário), aponta a câmara → vê o cubo.

Vantagens: sem app, multi-plataforma, fácil de partilhar via QR. Desvantagens: iOS Safari ainda limitado em WebXR; performance abaixo do nativo; image tracking pago/limitado fora do AR.js básico.

4.2 Lens Studio (Snap)

Editor visual + scripting JS para criar Lenses Snap. Audiência: 800M+ Snap users. Face tracking excelente, world tracking competente.

Bom para: campanhas de marca, filtros sociais, AR criativa.

4.3 Spark AR (Meta) — descontinuado

Spark AR Studio foi descontinuado pela Meta em janeiro 2025 para criadores externos. Lenses prévios continuam a funcionar mas não há novos via Spark.

Alternativa para AR no Instagram: parceria com criadores via plataforma da Meta, ou Lens Studio + porting.

4.4 Unity + AR Foundation

Para apps nativas iOS/Android. AR Foundation é a camada que abstrai ARKit + ARCore. Suporta plane tracking, image tracking, face tracking, body tracking, environmental probes, oclusão de pessoas.

Workflow: cena Unity → script C# → build para iOS/Android → distribuir via App Store/Play Store.

Bom para: apps dedicadas, performance importante, distribuição comercial.

4.5 Apple ARKit / Apple Reality Composer Pro

ARKit é nativo iOS, com features que os outros não têm (LiDAR, Object Capture). Reality Composer Pro (Vision Pro) usa USDZ para cenas.

USDZ — formato Apple de modelos 3D para AR, abre direto no Safari iOS com Quick Look.

4.6 8th Wall, ZapWorks, Adobe Aero

8th Wall (Niantic) — AR web profissional, pago, usado por marcas grandes.
ZapWorks — semelhante.
Adobe Aero — visual, sem código; bom para portfolios e protótipos.

5. Modelos 3D em AR

5.1 Formatos

GLTF / GLB — standard web/AR; suportado em A-Frame, WebXR, Android AR.
USDZ — Apple Quick Look, Vision Pro.
FBX, OBJ — comuns em pipelines, mas convertem-se para GLTF/USDZ no fim.

5.2 Polycount para AR

Mobile: < 50k polígonos por cena (entre todos os objectos).
Quest/Vision Pro: muito mais.
Texturas: 1024×1024 ou 2048×2048 comprimidas (KTX2/Basis).

5.3 Otimização

LODs (Level of Detail) — versões com menos polígonos à distância.
Texturas comprimidas.
Baked lighting quando possível.
Animações simples.

6. Design e UX para AR

6.1 Onboarding

Explica que tem de andar com o telemóvel para mapear o espaço.
Mostra o plano detectado (grelha ou círculo) para o utilizador perceber onde tocar.
1ª interação possível em < 15 s desde abrir.

6.2 Espaço

Avisa para olhar à volta antes (não chocar contra mobília).
Espaço mínimo indicado (1×1 m para mesa, 3×3 m para sala).
Sessão curta (segurar telemóvel cansa em > 2 min).

6.3 Permissões

Câmara é sensível — pedir bem (texto curto, contexto, no momento certo).
Em iOS/Android nativo: pedir só quando vais usar (não no arranque).
WebXR: explicar antes do popup do browser.

6.4 Performance e bateria

AR consome 10-20% bateria em 10 min.
Telemóvel aquece rapidamente.
A 60 FPS é o ideal; abaixo de 30 sente-se mau.
Fallback quando o tracking falha (mensagem + tentar de novo).

6.5 Acessibilidade

Alternativa não-AR ao mesmo conteúdo (vista 2D ou vídeo).
Legendas em narração/áudio.
Alvos grandes (mão tremendo).
Sem flashes.
Conteúdo não exclusivamente ancorado ao chão (utilizador sentado pode não conseguir manobrar para o ver).

7. Casos de uso fortes

Domínio	Exemplo	Por que funciona
E-commerce	IKEA Place	Reduz devoluções, ajuda decisão
Beauty	Sephora Virtual Artist	Try-before-buy maquilhagem/cor
Educação	Anatomia, química 3D	Ver o invisível
Museus	Apontar quadro → história	Camada de info contextual
Manutenção	Apontar máquina → passos	Mãos livres + visual
Imobiliário	Render do interior	Vender antes de construir
Marketing	Cartas/embalagens AR	Diferenciação, partilha

8. Quando NÃO usar AR

Quando uma foto ou vídeo chega para o efeito.
Quando o utilizador está em movimento (no metro, a andar).
Quando luz é baixa (interior escuro, exterior à noite).
Quando exige > 2 min seguidos (cansaço físico e mental).
Quando é gimmick sem resolver problema.

Pergunta sempre: "o que faço melhor em AR do que sem AR?"

9. Distribuição

9.1 AR Web

URL + QR code — utilizador abre no browser, sem instalação.
Hosting normal (Vercel, Netlify) com HTTPS.
Funciona em iOS Safari e Android Chrome (com algumas limitações WebXR).

9.2 AR Nativo

App Store / Google Play — exige conta de developer (Apple 99 USD/ano, Google 25 USD único).
Tempo de revisão (1-7 dias).
Mais features (ARKit/ARCore avançado, LiDAR), mas mais barreira ao utilizador.

9.3 Snap Lenses, TikTok Effects

Lens Studio → Snap Camera Kit → submeter para Snap.
Effect House (TikTok) → semelhante.
Distribuição instantânea via redes sociais.

10. Privacidade e ética

A câmara está a gravar durante a AR — indicar visualmente.
Não transmitir imagens para servidor sem consentimento explícito.
Faces de terceiros capturadas em AR pública: cuidado RGPD.
Dados de movimento podem identificar utilizadores — tratá-los como sensíveis.

11. Liga a outras UCs

UC02236 — princípios visuais aplicam-se ao conteúdo AR.
UC02209 — Blender é o pipeline natural para criar/optimizar modelos 3D para AR.
UC02242 — formatos GLTF/USDZ, compressão.
UC02631 — animação dos modelos.
UC02636 — acessibilidade em experiências AR.

12. Conclusão

AR é uma ferramenta, não um fim. As experiências boas resolvem um problema (ver móvel na sala, perceber anatomia, manter mãos livres em manutenção) e fazem-no em menos de 2 minutos sem exigir hardware exótico. Para portfolio de aluno: experimentar A-Frame + AR.js no browser e construir 1-2 protótipos focados é mais valioso que um pacote Unity inacabado.

Apêndice A · Stack recomendada (2026)

Necessidade	Ferramenta
Protótipo rápido web	A-Frame + AR.js (marker) ou MindAR (image)
AR profissional web	8th Wall ou WebXR Device API
Filtros sociais	Lens Studio (Snap), Effect House (TikTok)
App nativa	Unity + AR Foundation
Apple ecosystem	Reality Composer Pro + USDZ
Sem código	Adobe Aero, Reality Composer

Apêndice B · Recursos

WebXR Device API — immersive-web.github.io
A-Frame — aframe.io (docs + exemplos)
AR.js — ar-js-org.github.io
MindAR — hiukim.github.io/mind-ar-js-doc (image tracking gratuito)
Apple ARKit — developer.apple.com/augmented-reality/
Google ARCore — developers.google.com/ar
Lens Studio — ar.snap.com/lens-studio
Khronos GLTF — github.com/KhronosGroup/glTF