Universos paralelos com JS

Todo mundo vive dizendo das coisas maravilhosas que podemos fazer com o JavaScript. Mas você sabia que podemos utilizá-lo para nos ajudar a empoderar pessoas e fazê-las acreditar que elas também conseguem "chegar lá"? Vem comigo nessa jornada explorar uma das várias maneiras que temos de levar a internet realmente para todos através do A-frame e dos componentes nativos.

Transcript

1. View Slide

2. Gamer,
   future Suicide Girl
   and Front-end Dev
   @TheSweet_Lari
   Larissa Abreu
   @LarissaAbreu
   [complete aqui]
   Nem eu!
   

   View Slide

3. Coisas de
   criança
   

   View Slide

4. HTML é coisa de criança!
   - Otário desconhecido
   

   View Slide

5. Quem trabalha com HTML
   Não é programador de verdade!
   - Mais otário ainda
   

   View Slide

6. Um profissional deve se preocupar muito com a
   semântica pois ela é fundamental para questões de
   acessibilidade e de possíveis milhares de acessos
   vindos de um bom SEO. Em outras palavras, dizer
   que “HTML é coisa de criança” de forma pejorativa,
   faz de quem diz, uma pessoa
   completamente idiota.
   - Pacifer, Afonso
   

   View Slide

7. Quando todos
   Começamos
   

   View Slide

8. index.html
   Primeiro
   contato!
   Olá mundo!
   

   View Slide

9. Segundo
   contato!
   

   View Slide

10. Todos tem as
    Mesmas
    oportunidades?
    

    View Slide

11. VR para todos?
    Desafio
    Artistas, designers, educadores,
    criadores, crianças, etc…
    

    View Slide

12. aframe.io/
    O A-Frame é um framework web
    para construir experiências de realidade virtual (VR).
    

    View Slide

13. 
    
    
    
    
    
    
    
    
    
    
    
    
    
    index.html
    

    View Slide

14. Resultado!
    

    View Slide

15. No celular!
    

    View Slide

16. No óculos!
    

    View Slide

17. Por que
    A-Frame?
    

    View Slide

18. VR de forma simples
    Basta colocar uma tag e <a-scene> que<br/>o A-Frame vai lidar com todo o 3D, configuração<br/>de VR e controles padrão. Nada para instalar,<br/>sem etapas de compilação..<br/>

    View Slide

19. HTML declarativo
    HTML é fácil de ler e entender.. Então é só copiar
    e colar. Sendo, assim, acessível a todos:
    desenvolvedores da Web, entusiastas da VR,
    artistas, designers, educadores, criadores,
    crianças, etc...
    

    View Slide

20. Performance
    O A-Frame é otimizado desde o início para o
    WebVR. Enquanto o A-Frame usa o DOM, seus
    elementos não tocam no mecanismo de layout
    do navegador.
    

    View Slide

21. Agnóstico de ferramentas
    Como a Web foi construída sobre a noção de
    HTML, o A-Frame é compatível com a maioria
    das bibliotecas, estruturas e ferramentas…
    Incluindo React, Preact, Vue.js, d3.js,
    Ember.js, jQuery.
    

    View Slide

22. Inspetor Visual
    O A-Frame fornece um prático inspetor visual
    de 3D incorporado. Basta abrir qualquer cena A-
    Frame e pressionar + + i
    

    View Slide

23. Inspetor Visual
    

    View Slide

24. Através do html
    empodera
    

    View Slide

25. Demo
    larissaabreu.github.io/vr-demo/
    

    View Slide

26. Vá além do VR
    Crie seus próprios elementos HTML
    

    View Slide

27. polymer-project.org
    Uma biblioteca que facilita a criação de Web Components
    

    View Slide

28. Tudo é possível se você trocar os olhos que enxerga o mundo!
    - Caixa de VR
    

    View Slide

29. Thanks!
    #UseThePlatform
    @TheSweet_Lari
    @LarissaAbreu
    

    View Slide