Building Pocket Kitten

Building Pocket Kitten

How to get started and build an intro app for Firefox OS

C08248149e67f2c4f02b8fe32cb9952b?s=128

Ruth John (Rumyra)

September 04, 2013
Tweet

Transcript

  1. ì   Getting  Started  

  2. Hello   ì  I’m  Ruth   ì  Work  in  The

     Lab  at  o2   ì  UX,  Design,  Front  End  Dev   ì  @rumyra  
  3. Simple  app   New  technology  -­‐ just  wanted  to  

    try  it  out  
  4. Anger  Management  App  

  5. Pocket  Kitten  

  6. Pocket  Kitten  

  7. rumyra.github.io/Pocket-­‐Kitten  

  8. Bunzorcam  

  9. Web  App   rumyra.github.io/Pocket-­‐KiKen  

  10. Simulator   ì  Firefox  Add  On   rumyra.github.io/Pocket-­‐KiKen  

  11. HTML   rumyra.github.io/Pocket-­‐KiKen  

  12. CSS   rumyra.github.io/Pocket-­‐KiKen  

  13. Manifest   ì  Manifest  –  root  of  app,  JSON  format

        rumyra.github.io/Pocket-­‐KiKen  
  14. Vibrate   ì  App  vibrates  phone  on  tap,  user  feedback

      ì  Check  compaVbility     rumyra.github.io/Pocket-­‐KiKen  
  15. What  if?   ì  I  own  a  dog   rumyra.github.io/Pocket-­‐KiKen

     
  16. Ambient  Light  API   ì  When  it’s  night,  show  dogs!

      rumyra.github.io/Pocket-­‐KiKen  
  17. Install   ì  hKps://developer.mozilla.org/en-­‐US/docs/ Mozilla/Firefox_OS/Apps/ WriVng_a_web_app_for_Firefox_OS   rumyra.github.io/Pocket-­‐KiKen  

  18. I’ve  made  an  app  –  now  what?   ì  Packaged

     Apps  -­‐>   Mozilla   marketplace   ì  Hosted  Apps  -­‐>   Host  it  anywhere   (even  Github   pages)  
  19. Resources   ì  hKps://addons.mozilla.org/en-­‐US/firefox/addon/firefox-­‐ os-­‐simulator/   ì  hKp://manifest-­‐validator.com/   ì 

    hKps://wiki.mozilla.org/WebAPI/  or   hKps://developer.mozilla.org/en-­‐US/docs/WebAPI   ì  hKps://developer.mozilla.org/en-­‐US/docs/Apps/ Packaged_apps   ì  hKp://www.12devsofxmas.co.uk/post/2012-­‐12-­‐27-­‐ day-­‐2-­‐lets-­‐make-­‐a-­‐firefoxos-­‐app  
  20. Hello   ì  Ruth  John   ì  @rumyra   ì 

    QuesVons?