Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Física na UI com PhaserJS

331 vues

Publié le

Slides da apresentação do Front in Rio 2016

Publié dans : Technologie
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Física na UI com PhaserJS

  1. 1. Efeitos de física na UI com o PhaserJS
  2. 2. Sobre mim David Melo da Luz MBA em Engenharia de Software IBTA – Instituto Brasileiro de Tecnologia Avançada (Atualmente) Pós graduação em Programação e produção de jogos Serviço Nacional de Aprendizagem Comercial – SENAC SP Graduação em Psicologia Pontifícia Universidade Católica de São Paulo (PUC-SP) Últimos trabalhos formais: Consultor em tecnologia | Designer instrucional (Atual) Fundação Vanzolini Designer instrucional Fundação Padre Anchieta (TV Cultura) Consultor Plataforma Geekie
  3. 3. Meus projetos pessoais Plataforma de educação especial Escola de design intrucional
  4. 4. O que é faço hoje exatamente ? Jogos e objetos de aprendizagem para EAD e Elarning (famoso joguinho educativo) Jogo das placas Detran.SP Regaste Solidariuns Secretaria Educação Estado SP joANNINHA SP GameJAM 2015
  5. 5. Porque usar física na interface?
  6. 6. Porque usar física na interface?
  7. 7. Porque usar física na interface? • Interfaces mais realistas / intuitivas
  8. 8. Porque usar física na interface? • Interfaces mais realistas / intuitivas • Feedback visual e imediato
  9. 9. Porque usar física na interface? • Interfaces mais realistas / intuitivas • Feedback visual e imediato • Melhoram a experiência do usuário
  10. 10. Porque usar física na interface? • Interfaces mais realistas / intuitivas • Feedback visual e imediato • Melhoram a experiência do usuário • É mais fácil de implementar
  11. 11. Duas maneiras mais comuns de uso de física na interface
  12. 12. Animações Duas maneiras mais comuns de uso de física na interface
  13. 13. Animações Interações Duas maneiras mais comuns de uso de física na interface
  14. 14. Mas trabalhar com física não é muito difícil?
  15. 15. Meu objetivo nesta conversa rápida Mostrar como usar física hoje (2015) é muito fácil
  16. 16. Exemplos:
  17. 17. Playground http://dynamicsjs.com/ Dynamics JS http://www.phaser.io/ PhaserJS hammerjs.github.io HammerJS (inputs)
  18. 18. PhaserJ S
  19. 19. Sobre a PhaserJS • É um framework para o desenvolvimento de jogos HTML5 (otimizado para mobile). • Possui inúmeros recursos que facilitam a implementação de de funcionalidades complexas no desenvolvimento de jogos (física, partícula, animações e etc). • É gratuito e open source.
  20. 20. O Phaser possui 4 sistemas diferentes de física ArcadeP2 Phisics Ninja Phisics
  21. 21. O Phaser possui 4 sistemas diferentes de física ArcadeP2 Phisics Ninja Phisics Box2D
  22. 22. Exemplo prático rápido! https://github.com/davidluz/frontinrio2015
  23. 23. Estrutura básica de arquivos
  24. 24. Play it!
  25. 25. Obrigado! davidmelo8@gmail.com

×