SlideShare a Scribd company logo
1 of 46
Download to read offline
Mozilla, the web and you!




Chris Heilmann ( @codepo8 ) and John Hammink ( @rijksband )
Campus Party Recife, Brazil 29/07/12
The web is amazing!




http://www.chrisharrison.net/index.php/Visualizations/InternetMap
The web gives us a
voice

 Evolution of
 communication
 World-wide reach
 Publication as easy as
 consumption
The web is for
everybody
 Simple release process
 Simple technologies
 Not exclusive to experts
Mozilla is here
for the web
Opening the web for everybody




https://webmaker.org
Starting with HTML the fun way




https://thimble.webmaker.org/en-US/projects/map/edit
Making video talk to the web




http://mozillapopcorn.org/
Simple technologies
                                   HTML structures content
                                   CSS defines look and feel
                                   JavaScript adds interactivity




Photo by Howard Dickins
http://www.flickr.com/photos/dorkomatic/7050758899/
Being there for developers




http://developer.mozilla.org
We need you! (part 1)
Can has translate?




https://etherpad.mozilla.org/ptTranslationPriorities
History: the desktop wars
Shift happens




Photo by Jason Weaver
http://www.flickr.com/photos/indyplanets/5693612984/
F*#k yeah HTML5!
Erm, yeah, we mean apps!




Photo by Michael Gil
http://www.flickr.com/photos/msvg/5385759365/
Lock-out
                                     us er
                            dr oid
                       S/ An
                     iO




                  them
           o rd
   ’t aff
Can
That's wrong!

Desktop ✔
Mobile ?
Hardware access




http://arewemobileyet.com
Call State
                          dialing, busy,
                        incoming, ringing




                                                      Control
                                                        call, answer,
                                                          hangup




                                                    web telephony API
                                                      status : most work done
Photo by Rev Dan Catt
http://www.flickr.com/photos/revdancatt/535514134/
Interact
                                                                        find, filter,
                                                                     view messages




                                               Control
                                                send, delete,
                                                    find




                                                                   web sms API
                                                                status : v1 done, w/o v2
Photo by fazen
http://www.flickr.com/photos/fazen/103385722/
boot2gecko


                                                                Battery Status
                                                                 charging, battery level,
                                                                 battery life remaining,
                                                                     change events



                   Network Info
                      estimated bandwidth
                         ex. 3G, metered




                                                                                            Power Mgmt
                                                                                            screen on/off, brightness,
                                                                                                    lock state



                                                                                      camera API
Photo by Photo by wolfgangfoto
         wolfgangfoto
http://www.flickr.com/photos/wolfgangfoto/2264986176/
         http://www.flickr.com/photos/wolfgangfoto/2264986176/                       status : in progress
ContactsManager
                          find, clear,
                         save, remove




                                               ContactFindOptions
                                                     find, filter,
                                                    sort contacts




                                                web contacts API
                                                  status : v1 done, w/o v2
Photo by TOKY Branding and Design
http://www.flickr.com/photos/toky/2487011520/
Detect
                                                                      screen orientation,
                                                                      primary orientation.




                                           Control
                                            screen orientation
                                                  lock.




                                                                 screen orientation
                                                                                 status : done
Photo by Viking KARWUR
http://www.flickr.com/photos/vikingkarwur/7123548037/
Capabilities
                   picture size, video size,
                  zoom supported, effects,
                        flash modes...




                                                            Control
                                                       take picture, start and stop
                                                       video recording, auto focus,
                                                          set quality, thumb size




                                                                                      camera API
                                                                                status : in progress
Photo by wolfgangfoto
http://www.flickr.com/photos/wolfgangfoto/2264986176/
A truly open mobile OS




                         ...powered by HTML5
http://blog.mozilla.org/blog/2012/07/02/firefox-mobile-os/
Firefox OS architecture
                                                  GONK
                                                  The low level OS

   GECKO
   The application runtime
                                                      for B2G


          of B2G




                             GAIA
                             The user interface
                                  of B2G




                                                                                      Photo by Alesa Dam
                                                        http://www.flickr.com/photos/alesadam/3869366195/
HTML5 all around
Endless opportunities




Photo by Benjamin Esham:
http://www.flickr.com/photos/bdesham/2432400623/
What about apps?
          {
              "version": "1.0",
              "name": "MozillaBall",
              "description": "Exciting Open Web development action!",
              "icons": {
               "16": "/img/icon-16.png",
               "48": "/img/icon-48.png",


      +
               "128": "/img/icon-128.png"
              },
              "developer": {
               "name": "Mozilla Labs",
               "url": "http://mozillalabs.com"
              },
              "installs_allowed_from": [
               "https://appstore.mozillalabs.com"
              ],
              "default_locale": "en"
          }
+
+
What about making money?




https://marketplace.mozilla.org
We need you! (part 2)
How to get started?




https://developer.mozilla.org/en/Apps
Firefox OS now?




                                                     http://informationisart.com/11/




http://informationisart.com/11/   https://wiki.mozilla.org/Gaia/Hacking
Where's the metal?
http://openwebdevice.com
Is this the end of iOS + Android?
Talk to us, and talk about us!
Follow @Boot2Gecko and @mozhacks on Twitter

Join platform mailing list:

http://groups.google.com/group/mozilla.dev.platform

Join in on IRC: irc.mozilla.org channel #B2G

B2G Repo: https://github.com/mozilla-b2g/B2G

B2G Architecture: https://wiki.mozilla.org/B2G/Architecture

Gaia Repo: https://github.com/mozilla-b2g/gaia

Developer Docs: https://developer.mozilla.org/en/Mozilla/Boot_to_Gecko

Web API Docs: https://wiki.mozilla.org/WebAPI
Making you the star




                                                “To equip Evangelism Reps with the
                                                 skills necessary to deliver effective
                                                 presentations (small or large)
                                                 world-wide and spread Mozilla's
                                                 mission.”



https://wiki.mozilla.org/Evangelism_Reps_Training_Program
Obrigado!

@codepo8
@rijksband

More Related Content

Similar to Mozilla the web and you (no notes)

Essential for a great web experience e briks infotech
Essential for a great web experience   e briks infotechEssential for a great web experience   e briks infotech
Essential for a great web experience e briks infotech
ebriksinfotech
 

Similar to Mozilla the web and you (no notes) (6)

Snakes on the Web
Snakes on the WebSnakes on the Web
Snakes on the Web
 
Sniffing the Mobile Context
Sniffing the Mobile ContextSniffing the Mobile Context
Sniffing the Mobile Context
 
Mobile Web Standards and its Future
Mobile Web  Standards and its FutureMobile Web  Standards and its Future
Mobile Web Standards and its Future
 
Cucumber.js: Cuke up your JavaScript!
Cucumber.js: Cuke up your JavaScript!Cucumber.js: Cuke up your JavaScript!
Cucumber.js: Cuke up your JavaScript!
 
Speed is Essential for a Great Web Experience (oredev)
Speed is Essential for a Great Web Experience (oredev)Speed is Essential for a Great Web Experience (oredev)
Speed is Essential for a Great Web Experience (oredev)
 
Essential for a great web experience e briks infotech
Essential for a great web experience   e briks infotechEssential for a great web experience   e briks infotech
Essential for a great web experience e briks infotech
 

More from Christian Heilmann

The Soul in The Machine - Developing for Humans (FrankenJS edition)
The Soul in The Machine - Developing for Humans (FrankenJS edition)The Soul in The Machine - Developing for Humans (FrankenJS edition)
The Soul in The Machine - Developing for Humans (FrankenJS edition)
Christian Heilmann
 

More from Christian Heilmann (20)

Develop, Debug, Learn? - Dotjs2019
Develop, Debug, Learn? - Dotjs2019Develop, Debug, Learn? - Dotjs2019
Develop, Debug, Learn? - Dotjs2019
 
Hinting at a better web
Hinting at a better webHinting at a better web
Hinting at a better web
 
Taking the "vile" out of privilege
Taking the "vile" out of privilegeTaking the "vile" out of privilege
Taking the "vile" out of privilege
 
Seven ways to be a happier JavaScript developer - NDC Oslo
Seven ways to be a happier JavaScript developer - NDC OsloSeven ways to be a happier JavaScript developer - NDC Oslo
Seven ways to be a happier JavaScript developer - NDC Oslo
 
Artificial intelligence for humans… #AIDC2018 keynote
Artificial intelligence for humans… #AIDC2018 keynoteArtificial intelligence for humans… #AIDC2018 keynote
Artificial intelligence for humans… #AIDC2018 keynote
 
Killing the golden calf of coding - We are Developers keynote
Killing the golden calf of coding - We are Developers keynoteKilling the golden calf of coding - We are Developers keynote
Killing the golden calf of coding - We are Developers keynote
 
Progressive Web Apps - Techdays Finland
Progressive Web Apps - Techdays FinlandProgressive Web Apps - Techdays Finland
Progressive Web Apps - Techdays Finland
 
Taking the "vile" out of privilege
Taking the "vile" out of privilegeTaking the "vile" out of privilege
Taking the "vile" out of privilege
 
Five ways to be a happier JavaScript developer
Five ways to be a happier JavaScript developerFive ways to be a happier JavaScript developer
Five ways to be a happier JavaScript developer
 
Taking the P out of PWA
Taking the P out of PWATaking the P out of PWA
Taking the P out of PWA
 
Sacrificing the golden calf of "coding"
Sacrificing the golden calf of "coding"Sacrificing the golden calf of "coding"
Sacrificing the golden calf of "coding"
 
You learned JavaScript - now what?
You learned JavaScript - now what?You learned JavaScript - now what?
You learned JavaScript - now what?
 
Sacrificing the golden calf of "coding"
Sacrificing the golden calf of "coding"Sacrificing the golden calf of "coding"
Sacrificing the golden calf of "coding"
 
Progressive Web Apps - Covering the best of both worlds - DevReach
Progressive Web Apps - Covering the best of both worlds - DevReachProgressive Web Apps - Covering the best of both worlds - DevReach
Progressive Web Apps - Covering the best of both worlds - DevReach
 
Progressive Web Apps - Covering the best of both worlds
Progressive Web Apps - Covering the best of both worldsProgressive Web Apps - Covering the best of both worlds
Progressive Web Apps - Covering the best of both worlds
 
Non-trivial pursuits: Learning machines and forgetful humans
Non-trivial pursuits: Learning machines and forgetful humansNon-trivial pursuits: Learning machines and forgetful humans
Non-trivial pursuits: Learning machines and forgetful humans
 
Progressive Web Apps - Bringing the web front and center
Progressive Web Apps - Bringing the web front and center Progressive Web Apps - Bringing the web front and center
Progressive Web Apps - Bringing the web front and center
 
CSS vs. JavaScript - Trust vs. Control
CSS vs. JavaScript - Trust vs. ControlCSS vs. JavaScript - Trust vs. Control
CSS vs. JavaScript - Trust vs. Control
 
Leveling up your JavaScipt - DrupalJam 2017
Leveling up your JavaScipt - DrupalJam 2017Leveling up your JavaScipt - DrupalJam 2017
Leveling up your JavaScipt - DrupalJam 2017
 
The Soul in The Machine - Developing for Humans (FrankenJS edition)
The Soul in The Machine - Developing for Humans (FrankenJS edition)The Soul in The Machine - Developing for Humans (FrankenJS edition)
The Soul in The Machine - Developing for Humans (FrankenJS edition)
 

Recently uploaded

Seal of Good Local Governance (SGLG) 2024Final.pptx
Seal of Good Local Governance (SGLG) 2024Final.pptxSeal of Good Local Governance (SGLG) 2024Final.pptx
Seal of Good Local Governance (SGLG) 2024Final.pptx
negromaestrong
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
PECB
 

Recently uploaded (20)

Web & Social Media Analytics Previous Year Question Paper.pdf
Web & Social Media Analytics Previous Year Question Paper.pdfWeb & Social Media Analytics Previous Year Question Paper.pdf
Web & Social Media Analytics Previous Year Question Paper.pdf
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptx
 
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphZ Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot Graph
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Energy Resources. ( B. Pharmacy, 1st Year, Sem-II) Natural Resources
Energy Resources. ( B. Pharmacy, 1st Year, Sem-II) Natural ResourcesEnergy Resources. ( B. Pharmacy, 1st Year, Sem-II) Natural Resources
Energy Resources. ( B. Pharmacy, 1st Year, Sem-II) Natural Resources
 
Class 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdfClass 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdf
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-IIFood Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
 
Unit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptxUnit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptx
 
Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104
 
Seal of Good Local Governance (SGLG) 2024Final.pptx
Seal of Good Local Governance (SGLG) 2024Final.pptxSeal of Good Local Governance (SGLG) 2024Final.pptx
Seal of Good Local Governance (SGLG) 2024Final.pptx
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
psychiatric nursing HISTORY COLLECTION .docx
psychiatric  nursing HISTORY  COLLECTION  .docxpsychiatric  nursing HISTORY  COLLECTION  .docx
psychiatric nursing HISTORY COLLECTION .docx
 
Asian American Pacific Islander Month DDSD 2024.pptx
Asian American Pacific Islander Month DDSD 2024.pptxAsian American Pacific Islander Month DDSD 2024.pptx
Asian American Pacific Islander Month DDSD 2024.pptx
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 

Mozilla the web and you (no notes)

  • 1. Mozilla, the web and you! Chris Heilmann ( @codepo8 ) and John Hammink ( @rijksband ) Campus Party Recife, Brazil 29/07/12
  • 2. The web is amazing! http://www.chrisharrison.net/index.php/Visualizations/InternetMap
  • 3. The web gives us a voice Evolution of communication World-wide reach Publication as easy as consumption
  • 4. The web is for everybody Simple release process Simple technologies Not exclusive to experts
  • 6. Opening the web for everybody https://webmaker.org
  • 7. Starting with HTML the fun way https://thimble.webmaker.org/en-US/projects/map/edit
  • 8. Making video talk to the web http://mozillapopcorn.org/
  • 9. Simple technologies HTML structures content CSS defines look and feel JavaScript adds interactivity Photo by Howard Dickins http://www.flickr.com/photos/dorkomatic/7050758899/
  • 10. Being there for developers http://developer.mozilla.org
  • 11. We need you! (part 1)
  • 12.
  • 15. Shift happens Photo by Jason Weaver http://www.flickr.com/photos/indyplanets/5693612984/
  • 17. Erm, yeah, we mean apps! Photo by Michael Gil http://www.flickr.com/photos/msvg/5385759365/
  • 18. Lock-out us er dr oid S/ An iO them o rd ’t aff Can
  • 21. Call State dialing, busy, incoming, ringing Control call, answer, hangup web telephony API status : most work done Photo by Rev Dan Catt http://www.flickr.com/photos/revdancatt/535514134/
  • 22.
  • 23. Interact find, filter, view messages Control send, delete, find web sms API status : v1 done, w/o v2 Photo by fazen http://www.flickr.com/photos/fazen/103385722/
  • 24.
  • 25. boot2gecko Battery Status charging, battery level, battery life remaining, change events Network Info estimated bandwidth ex. 3G, metered Power Mgmt screen on/off, brightness, lock state camera API Photo by Photo by wolfgangfoto wolfgangfoto http://www.flickr.com/photos/wolfgangfoto/2264986176/ http://www.flickr.com/photos/wolfgangfoto/2264986176/ status : in progress
  • 26.
  • 27. ContactsManager find, clear, save, remove ContactFindOptions find, filter, sort contacts web contacts API status : v1 done, w/o v2 Photo by TOKY Branding and Design http://www.flickr.com/photos/toky/2487011520/
  • 28. Detect screen orientation, primary orientation. Control screen orientation lock. screen orientation status : done Photo by Viking KARWUR http://www.flickr.com/photos/vikingkarwur/7123548037/
  • 29. Capabilities picture size, video size, zoom supported, effects, flash modes... Control take picture, start and stop video recording, auto focus, set quality, thumb size camera API status : in progress Photo by wolfgangfoto http://www.flickr.com/photos/wolfgangfoto/2264986176/
  • 30. A truly open mobile OS ...powered by HTML5 http://blog.mozilla.org/blog/2012/07/02/firefox-mobile-os/
  • 31. Firefox OS architecture GONK The low level OS GECKO The application runtime for B2G of B2G GAIA The user interface of B2G Photo by Alesa Dam http://www.flickr.com/photos/alesadam/3869366195/
  • 33. Endless opportunities Photo by Benjamin Esham: http://www.flickr.com/photos/bdesham/2432400623/
  • 34. What about apps? { "version": "1.0", "name": "MozillaBall", "description": "Exciting Open Web development action!", "icons": { "16": "/img/icon-16.png", "48": "/img/icon-48.png", + "128": "/img/icon-128.png" }, "developer": { "name": "Mozilla Labs", "url": "http://mozillalabs.com" }, "installs_allowed_from": [ "https://appstore.mozillalabs.com" ], "default_locale": "en" }
  • 35. +
  • 36. +
  • 37. What about making money? https://marketplace.mozilla.org
  • 38. We need you! (part 2)
  • 39. How to get started? https://developer.mozilla.org/en/Apps
  • 40. Firefox OS now? http://informationisart.com/11/ http://informationisart.com/11/ https://wiki.mozilla.org/Gaia/Hacking
  • 43. Is this the end of iOS + Android?
  • 44. Talk to us, and talk about us! Follow @Boot2Gecko and @mozhacks on Twitter Join platform mailing list: http://groups.google.com/group/mozilla.dev.platform Join in on IRC: irc.mozilla.org channel #B2G B2G Repo: https://github.com/mozilla-b2g/B2G B2G Architecture: https://wiki.mozilla.org/B2G/Architecture Gaia Repo: https://github.com/mozilla-b2g/gaia Developer Docs: https://developer.mozilla.org/en/Mozilla/Boot_to_Gecko Web API Docs: https://wiki.mozilla.org/WebAPI
  • 45. Making you the star “To equip Evangelism Reps with the skills necessary to deliver effective presentations (small or large) world-wide and spread Mozilla's mission.” https://wiki.mozilla.org/Evangelism_Reps_Training_Program