This document discusses progressive web apps (PWAs) and their advantages over traditional mobile apps. It highlights how PWAs can provide an app-like experience through being responsive, fast, and able to work offline. The key aspects of PWAs that allow this include web app manifests, service workers for caching, and push notifications when used appropriately. The document encourages continued learning to keep growing.

1. P R O G R E S S I V E W E B A P P S
AO I N F I N I TO E A L É M ! 🚀
@ O L A R C L A R A | | T D C S P ‘ 1 6

2. Q U E M S O U
E U ?
• Front-end Engineer @
Fleety;
• Juíza @ Technovation
Challenge;
• UX entusiasta +
Community Lover;

3. O M U N D O É M O B I L E .
D I S S O A G E N T E J Á S A B E .

4. W E B V S . N AT I V O
A LU TA S E M F I M ( S E R Á ? )

5. F L U XO D E U S O
U M A P P N AT I V O
• Abre a App Store/Play Store;
• Procura o app;
• Aceita as permissões;
• Faz o download;
• Espera instalar;
• Finalmente usa o app;
F L U XO D E U S O
U M A P P W E B
• Abre o navegador;
• Digita a URL;
• Usa o app;

6. Fonte: The U.S. Mobile Report 2015

7. Fonte: http://gph.is/29gt8MP

9. É T U D O S O B R E U X .
A . K . A . FA Z E R O U S UÁ R I O F E L I Z .

10. FUNCTIONALITY
RELIABILITY
USABILITY
PLEASURABLE
AESTETHICS
Inspirado em: http://bit.ly/1OFxlKI

11. – A L E X R U S S E L L
“Progressive Web Apps are just websites that
took all the right vitamins.”

13. Fonte: http://bit.ly/1sMw5yn

14. F L U XO D E U S O D E
U M P G A
• Abre o navegador;
• Digita a URL;
• Usa o app;
• Progressive enhancement…

15. “When you stop learning, you stop growing.”
Fonte: http://bit.ly/29tqPGp

16. R E S P O N S I V O S

18. A P P Y- L I K E !

21. R Á P I D O ! ( M U I T O )

22. - M O B I L E A P P L I C AT I O N T E S T I N G & P E R F O R M A N C E
A N A LY S I S
“74% of mobile users won’t wait longer that 5
seconds for a page to load.”

23. W E B A P P M A N I F E S T

26. O F F L I N E - F I R S T !

28. • >> fastest;
• >> networkFirst;
• >> networkOnly;
Caching strategies

30. E N G A J A M E N T O

31. P U S H É S E N S A C I O N A L .
M A S U S E C O M M O D E R A Ç Ã O .

32. Pushes são enviados
apenas se o usuario aceitar.

34. – K A R L I E K LO S S
“When you stop learning, you stop growing.”

35. O B R I G A DA !
H T T P S : / / A B O U T. M E / M A R I AC L A R A S A N TA N A