Pourquoi Firefox OS

Pourquoi Firefox OS ?
Christophe Villeneuve
12 septembre 2013

nAcademy – 12 Septembre 2013
Sommaire
✔
Le pourquoi
✔
Le comment
✔
Structure
✔
Démo
✔
Le +

Le pourquoi...
Apporter l'ouverture du web
pour les appareils mobiles (devices)

Avant

De nos jours
Apple Google Microsoft

En résumé... Le futur

Web Mobile

Donc...
✔
Navigation par onglets
✔
Gestion mémoire
✔
Créer vos applications
personnalisées et
différencier UX
✔
Tout en application Web

https://mdn.mozillademos.org/files/4605/FirefoxOS.png
GONK
➢GECKO
➢GAIA

Architecture
GONK
✔
Couche basse
✔
Kernel Linux + Hardware
✔
Abstraction Layer (HAL)

Architecture
➢
GONK
➢
GECKO
✔
Exécution des applications
(runtime)
✔
Mécanisme de lancement dans
Firefox pour HTML 5, CSS &
Javascript
✔
Gestion des API

Architecture
➢
GONK
➢
GECKO
➢
GAIA
✔
Interface utilisateur
✔
Construction API Full Web
✔
HTML 5 + open Web

Application Web

Création API ….Neuros
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Neuros sur Firefox OS</title>
<meta name="viewport"
content="width=device-width">
<link rel="stylesheet" href="css/neuros.css">
</head>
<body>
<div id="container">
<p>N E U R O S</p>
présentation nAcademy
</div>
</body>
</html>
p {
background: #dddddd;
font-weight:bold;
color:#FF0000;
height:200px;
line-height:200px;
text-align:center;
}
#container{
position:absolute;
text-align:center;
line-height: 200px;
position:relative;
border:2px solid #000000;
vertical-align:center;
}
Index.html *.css

Résultat

Manifest.webapp
{
"version": "1.0",
"name": "Neuros",
"description": "Neuros sur mobile",
"launch_path": "/index.html",
"icons": {
"16": "/img/icons/neuros-16.png",
"48": "/img/icons/neuros-48.png",
"128": "/img/icons/neuros-128.png"
},
"developer": {
"name": "Christophe Villeneuve",
"url": "http://www.neuros.fr"
},
"installs_allowed_from": ["*"],
"appcache_path": "/cache.manifest",
"locales": {
"fr": {
"description": "Neuros sur Firefox OS",
"developer": {
"url": "http://www.neuros.fr"
}
}
},
"default_locale": "en"
}

Demo.... simulator
https://addons.mozilla.org/fr/firefox/addon/firefox-os-simulator/

Validateur
https://marketplace.firefox.com/developers/validator

MarketPlace
✔ 100 % le contrôle
✔ Pas d'intermédiaire
✔ Chez vous
✔ Déporté
✔ Sur la market

MarketPlace
https://marketplace.firefox.com/

Web applications : mode vibreur
+ Web APIs

Vibration
// vibre 1 seconde
navigator.vibrate(1000);
// effet viration (pattern[vibration, pause...]
navigator.vibrate ([200,100,200,100]);
// vibre 5 secondes
navigator.vibrate (5000);
// Mode Off pour Vibration
navigator.vibrate(0);

Composants → Web applications

Appareils mobiles
ZTE Open
Alcatel One touch fire

Ete 2013

Questions ?
URL :
http://marketplace.mozilla.org
http://www.mozilla.org/firefoxos
http://wiki.mozilla.org/Gaia/Hacking
Slides originales :
Tristan Nitot
Robert Nyman

Pourquoi Firefox OS

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie Pourquoi Firefox OS

Ähnlich wie Pourquoi Firefox OS (20)

Mehr von neuros

Mehr von neuros (20)

Pourquoi Firefox OS