SlideShare une entreprise Scribd logo
1  sur  16
Création d’applications mobiles
pour débutants
INTRODUCTION A
APP INVENTOR
Apprendre la programmation et la création
d’applications mobiles avec App Inventor (sur Android)
1. Introduction : quoi, pour qui ?
2. Installation
3. Interface de design
4. Interface de programmation
5. Test
6. Installation et partage des applications
7. Aller plus loin
2
1. Introduction
appinventor.mit.edu
Logiciel de programmation visuelle conçu pour l’initiation à la
programmation et à la création d’applications mobiles (sur
Android)
Conçu par une équipe conjointe de Google et du MIT en 2009
Open-source, gratuit, accessible en ligne
En 2015 : + 3 millions d’utilisateurs dans 195 pays, + de 7
millions d’applis créées à des fins pédagogiques, de prototypage
ou de publication (sur le Google Play Store)
2. Installation
Adresse Gmail + Appli à télécharger
Pour démarrer sur App Inventor, rien de plus simple :
- Il faut se connecter à l’adresse « ai2.appinventor.mit.edu » muni
d’une adresse Gmail (dès la première utilisation)
- Pour tester en temps réel sur son téléphone (ou sa tablette) :
télécharger l’appli « MIT AI2 Companion » sur le Google Play Store
- Si vous n’avez pas de téléphone/tablette Android sous la main, vous
pouvez toujours tester avec l’émulateur en ligne, téléchargeable à
partir du site internet du logiciel
- Navigateurs à utiliser : Chrome ou Firefox sont recommandés, ça
marche avec Safari, Internet Explorer n’est pas supporté.
3. Interface de design
Création de l’interface utilisateur de
l’application
2 interfaces de travail dans App Inventor : l’interface de design, et
l’interface de programmation
L’interface de design permet de concevoir l’apparence des écrans
de votre application : apparence visuelle, et composants invisibles
La définition des propriétés de ces différents composants se fait
dans cette interface (par défaut dans un premier temps)
Tous les médias externes (images, sons, etc.) à intégrer à votre
application se téléchargent également dans cette interface
4. Interface de
programmation
Programmation du comportement de
l’application
L’interface de programmation permet de définir le comportement
de l’application et de ses différents composants, une fois qu’ils ont
été créés dans l’interface de design
La programmation se fait à l’aide de « blocs » précodés, rédigés en
anglais ou français (ou autre langue), qui s’emboîtent les uns dans
les autres selon la logique souhaitée
Les blocs de code ont déjà un ensemble de propriétés, méthodes
et événements associés, qu’on peut enrichir avec la création de
nouvelles procédures
5. Test
Test, test, test !
Pour tester son développement en
temps réel, le logiciel permet de
générer un code barre qu’on scanne
à partir de l’appli « compagnon »
installée sur le téléphone
En quelques secondes, l’appli
apparaît sur l’écran et on peut la
tester sous quasiment toutes ses
coutures.
6. Installation et partage
Installation de l’application sur le téléphone
Pour installer une application sur le
téléphone, 2 méthodes :
- Génération d’un code-barre à partir de
l’interface du logiciel (code valable 2
heures)
- Partage du fichier d’installation par email
(le plus simple pour le partager avec
plusieurs personnes).
On peut également publier les applis sur le
Google Play Store.
Les fichiers source sont également
partageables et modifiables par d’autres.
7. Aller plus loin
Ateliers & Stages
(à partir de 13 ans)
CREATION
D’APPLICATIONS MOBILES
Inscriptions &
renseignements :
www.teen-code.com
teencodeedu
www.teen-code.com
teencodeedu

Contenu connexe

Tendances

Tendances (20)

Supports de stockage
Supports de stockageSupports de stockage
Supports de stockage
 
Cours informatique éléments de présentation - 8ème
Cours  informatique éléments de présentation - 8èmeCours  informatique éléments de présentation - 8ème
Cours informatique éléments de présentation - 8ème
 
Cours Internet - Téléchargement de fichiers
Cours Internet - Téléchargement de fichiersCours Internet - Téléchargement de fichiers
Cours Internet - Téléchargement de fichiers
 
Ordinateur & ses constituants
Ordinateur & ses constituantsOrdinateur & ses constituants
Ordinateur & ses constituants
 
Introduction
IntroductionIntroduction
Introduction
 
Exercice2
Exercice2Exercice2
Exercice2
 
Réseaux informatiques: Reseau Local LAN
Réseaux informatiques: Reseau Local  LANRéseaux informatiques: Reseau Local  LAN
Réseaux informatiques: Reseau Local LAN
 
Cours Internet - Messagerie électronique
Cours Internet - Messagerie électroniqueCours Internet - Messagerie électronique
Cours Internet - Messagerie électronique
 
Projet bt1 informatique
Projet bt1 informatiqueProjet bt1 informatique
Projet bt1 informatique
 
Introduction&composants
Introduction&composantsIntroduction&composants
Introduction&composants
 
Cours 1 -_bases_d_informatique
Cours 1 -_bases_d_informatiqueCours 1 -_bases_d_informatique
Cours 1 -_bases_d_informatique
 
Cours traitement du son avec audacity
Cours traitement du son avec audacityCours traitement du son avec audacity
Cours traitement du son avec audacity
 
Système d'exploitation
Système d'exploitationSystème d'exploitation
Système d'exploitation
 
Les périphériques et les supports de stockage d'un PC
Les périphériques et les supports de stockage d'un PCLes périphériques et les supports de stockage d'un PC
Les périphériques et les supports de stockage d'un PC
 
Cours Visual Basic.NET
Cours Visual Basic.NETCours Visual Basic.NET
Cours Visual Basic.NET
 
Cours informatique ordinateur et système d'exploitation
Cours informatique ordinateur et système d'exploitationCours informatique ordinateur et système d'exploitation
Cours informatique ordinateur et système d'exploitation
 
Chapitre2 internet
Chapitre2 internet Chapitre2 internet
Chapitre2 internet
 
Cours : Traitement d'images - 7ème de base
Cours : Traitement d'images  - 7ème de baseCours : Traitement d'images  - 7ème de base
Cours : Traitement d'images - 7ème de base
 
T texte
T texteT texte
T texte
 
Cours : Internet - 7ème année de base
Cours : Internet - 7ème  année de baseCours : Internet - 7ème  année de base
Cours : Internet - 7ème année de base
 

Similaire à Introduction à App Inventor

chapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdfchapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdf
olfaharrabi2
 
Chapitre 1-introduction-plateforme-android
Chapitre 1-introduction-plateforme-androidChapitre 1-introduction-plateforme-android
Chapitre 1-introduction-plateforme-android
Salah Gharbi
 
01 programmation mobile - android - (introduction)
01 programmation mobile - android - (introduction)01 programmation mobile - android - (introduction)
01 programmation mobile - android - (introduction)
TECOS
 

Similaire à Introduction à App Inventor (20)

Développement d'applications mobiles.. Environnement de programmation visuelle
Développement d'applications mobiles.. Environnement de programmation visuelleDéveloppement d'applications mobiles.. Environnement de programmation visuelle
Développement d'applications mobiles.. Environnement de programmation visuelle
 
Chapitre 1 android
Chapitre 1 androidChapitre 1 android
Chapitre 1 android
 
Programmation mobile Licence 2 UKV 23-24.pdf
Programmation mobile Licence 2 UKV 23-24.pdfProgrammation mobile Licence 2 UKV 23-24.pdf
Programmation mobile Licence 2 UKV 23-24.pdf
 
userADgents WWDC iOS 8 juin 2014
userADgents WWDC iOS 8 juin 2014userADgents WWDC iOS 8 juin 2014
userADgents WWDC iOS 8 juin 2014
 
Intro Android
Intro AndroidIntro Android
Intro Android
 
chapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdfchapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdf
 
Proposition pim esprit mobile
Proposition pim esprit mobileProposition pim esprit mobile
Proposition pim esprit mobile
 
Chapitre 1-introduction-plateforme-android
Chapitre 1-introduction-plateforme-androidChapitre 1-introduction-plateforme-android
Chapitre 1-introduction-plateforme-android
 
Introduction au développement Windows Phone 8
Introduction au développement Windows Phone 8Introduction au développement Windows Phone 8
Introduction au développement Windows Phone 8
 
.NET DotNet CF - 1
.NET DotNet CF - 1.NET DotNet CF - 1
.NET DotNet CF - 1
 
Support formation vidéo: Android Kotlin : développez des applications mobiles
Support formation vidéo: Android Kotlin : développez des applications mobiles Support formation vidéo: Android Kotlin : développez des applications mobiles
Support formation vidéo: Android Kotlin : développez des applications mobiles
 
Support developpement applications mobiles avec ionic v3 et v4
Support developpement applications mobiles avec ionic v3 et v4Support developpement applications mobiles avec ionic v3 et v4
Support developpement applications mobiles avec ionic v3 et v4
 
01 programmation mobile - android - (introduction)
01 programmation mobile - android - (introduction)01 programmation mobile - android - (introduction)
01 programmation mobile - android - (introduction)
 
DART.pptx
DART.pptxDART.pptx
DART.pptx
 
Ch1. Développement mobile
Ch1. Développement mobileCh1. Développement mobile
Ch1. Développement mobile
 
Conférence Titanium + Alloy au JUG Montpellier
Conférence Titanium + Alloy au JUG MontpellierConférence Titanium + Alloy au JUG Montpellier
Conférence Titanium + Alloy au JUG Montpellier
 
Hackathon Android Abidjan
Hackathon Android  AbidjanHackathon Android  Abidjan
Hackathon Android Abidjan
 
Publier une application mobile en un clic
Publier une application mobile en un clicPublier une application mobile en un clic
Publier une application mobile en un clic
 
Offre migrer vers_flutter
Offre migrer vers_flutterOffre migrer vers_flutter
Offre migrer vers_flutter
 
Chapitre 4 sem
Chapitre 4 semChapitre 4 sem
Chapitre 4 sem
 

Dernier

Copie de Engineering Software Marketing Plan by Slidesgo.pptx.pptx
Copie de Engineering Software Marketing Plan by Slidesgo.pptx.pptxCopie de Engineering Software Marketing Plan by Slidesgo.pptx.pptx
Copie de Engineering Software Marketing Plan by Slidesgo.pptx.pptx
ikospam0
 
Cours Préparation à l’ISO 27001 version 2022.pdf
Cours Préparation à l’ISO 27001 version 2022.pdfCours Préparation à l’ISO 27001 version 2022.pdf
Cours Préparation à l’ISO 27001 version 2022.pdf
ssuserc72852
 
Bilan énergétique des chambres froides.pdf
Bilan énergétique des chambres froides.pdfBilan énergétique des chambres froides.pdf
Bilan énergétique des chambres froides.pdf
AmgdoulHatim
 

Dernier (20)

L application de la physique classique dans le golf.pptx
L application de la physique classique dans le golf.pptxL application de la physique classique dans le golf.pptx
L application de la physique classique dans le golf.pptx
 
Boléro. pptx Film français réalisé par une femme.
Boléro.  pptx   Film   français   réalisé  par une  femme.Boléro.  pptx   Film   français   réalisé  par une  femme.
Boléro. pptx Film français réalisé par une femme.
 
L'expression du but : fiche et exercices niveau C1 FLE
L'expression du but : fiche et exercices  niveau C1 FLEL'expression du but : fiche et exercices  niveau C1 FLE
L'expression du but : fiche et exercices niveau C1 FLE
 
Chapitre 2 du cours de JavaScript. Bon Cours
Chapitre 2 du cours de JavaScript. Bon CoursChapitre 2 du cours de JavaScript. Bon Cours
Chapitre 2 du cours de JavaScript. Bon Cours
 
CompLit - Journal of European Literature, Arts and Society - n. 7 - Table of ...
CompLit - Journal of European Literature, Arts and Society - n. 7 - Table of ...CompLit - Journal of European Literature, Arts and Society - n. 7 - Table of ...
CompLit - Journal of European Literature, Arts and Society - n. 7 - Table of ...
 
La nouvelle femme . pptx Film français
La   nouvelle   femme  . pptx  Film françaisLa   nouvelle   femme  . pptx  Film français
La nouvelle femme . pptx Film français
 
Formation échiquéenne jwhyCHESS, parallèle avec la planification de projet
Formation échiquéenne jwhyCHESS, parallèle avec la planification de projetFormation échiquéenne jwhyCHESS, parallèle avec la planification de projet
Formation échiquéenne jwhyCHESS, parallèle avec la planification de projet
 
Copie de Engineering Software Marketing Plan by Slidesgo.pptx.pptx
Copie de Engineering Software Marketing Plan by Slidesgo.pptx.pptxCopie de Engineering Software Marketing Plan by Slidesgo.pptx.pptx
Copie de Engineering Software Marketing Plan by Slidesgo.pptx.pptx
 
Cours ofppt du Trade-Marketing-Présentation.pdf
Cours ofppt du Trade-Marketing-Présentation.pdfCours ofppt du Trade-Marketing-Présentation.pdf
Cours ofppt du Trade-Marketing-Présentation.pdf
 
Conférence Sommet de la formation 2024 : Développer des compétences pour la m...
Conférence Sommet de la formation 2024 : Développer des compétences pour la m...Conférence Sommet de la formation 2024 : Développer des compétences pour la m...
Conférence Sommet de la formation 2024 : Développer des compétences pour la m...
 
Formation qhse - GIASE saqit_105135.pptx
Formation qhse - GIASE saqit_105135.pptxFormation qhse - GIASE saqit_105135.pptx
Formation qhse - GIASE saqit_105135.pptx
 
Cours Préparation à l’ISO 27001 version 2022.pdf
Cours Préparation à l’ISO 27001 version 2022.pdfCours Préparation à l’ISO 27001 version 2022.pdf
Cours Préparation à l’ISO 27001 version 2022.pdf
 
les_infections_a_streptocoques.pptkioljhk
les_infections_a_streptocoques.pptkioljhkles_infections_a_streptocoques.pptkioljhk
les_infections_a_streptocoques.pptkioljhk
 
RAPPORT DE STAGE D'INTERIM DE ATTIJARIWAFA BANK
RAPPORT DE STAGE D'INTERIM DE ATTIJARIWAFA BANKRAPPORT DE STAGE D'INTERIM DE ATTIJARIWAFA BANK
RAPPORT DE STAGE D'INTERIM DE ATTIJARIWAFA BANK
 
Intégration des TICE dans l'enseignement de la Physique-Chimie.pptx
Intégration des TICE dans l'enseignement de la Physique-Chimie.pptxIntégration des TICE dans l'enseignement de la Physique-Chimie.pptx
Intégration des TICE dans l'enseignement de la Physique-Chimie.pptx
 
Apolonia, Apolonia.pptx Film documentaire
Apolonia, Apolonia.pptx         Film documentaireApolonia, Apolonia.pptx         Film documentaire
Apolonia, Apolonia.pptx Film documentaire
 
Sidonie au Japon . pptx Un film français
Sidonie    au   Japon  .  pptx  Un film françaisSidonie    au   Japon  .  pptx  Un film français
Sidonie au Japon . pptx Un film français
 
Computer Parts in French - Les parties de l'ordinateur.pptx
Computer Parts in French - Les parties de l'ordinateur.pptxComputer Parts in French - Les parties de l'ordinateur.pptx
Computer Parts in French - Les parties de l'ordinateur.pptx
 
Bilan énergétique des chambres froides.pdf
Bilan énergétique des chambres froides.pdfBilan énergétique des chambres froides.pdf
Bilan énergétique des chambres froides.pdf
 
La mondialisation avantages et inconvénients
La mondialisation avantages et inconvénientsLa mondialisation avantages et inconvénients
La mondialisation avantages et inconvénients
 

Introduction à App Inventor

  • 1. Création d’applications mobiles pour débutants INTRODUCTION A APP INVENTOR
  • 2. Apprendre la programmation et la création d’applications mobiles avec App Inventor (sur Android) 1. Introduction : quoi, pour qui ? 2. Installation 3. Interface de design 4. Interface de programmation 5. Test 6. Installation et partage des applications 7. Aller plus loin 2
  • 4. appinventor.mit.edu Logiciel de programmation visuelle conçu pour l’initiation à la programmation et à la création d’applications mobiles (sur Android) Conçu par une équipe conjointe de Google et du MIT en 2009 Open-source, gratuit, accessible en ligne En 2015 : + 3 millions d’utilisateurs dans 195 pays, + de 7 millions d’applis créées à des fins pédagogiques, de prototypage ou de publication (sur le Google Play Store)
  • 6. Adresse Gmail + Appli à télécharger Pour démarrer sur App Inventor, rien de plus simple : - Il faut se connecter à l’adresse « ai2.appinventor.mit.edu » muni d’une adresse Gmail (dès la première utilisation) - Pour tester en temps réel sur son téléphone (ou sa tablette) : télécharger l’appli « MIT AI2 Companion » sur le Google Play Store - Si vous n’avez pas de téléphone/tablette Android sous la main, vous pouvez toujours tester avec l’émulateur en ligne, téléchargeable à partir du site internet du logiciel - Navigateurs à utiliser : Chrome ou Firefox sont recommandés, ça marche avec Safari, Internet Explorer n’est pas supporté.
  • 8. Création de l’interface utilisateur de l’application 2 interfaces de travail dans App Inventor : l’interface de design, et l’interface de programmation L’interface de design permet de concevoir l’apparence des écrans de votre application : apparence visuelle, et composants invisibles La définition des propriétés de ces différents composants se fait dans cette interface (par défaut dans un premier temps) Tous les médias externes (images, sons, etc.) à intégrer à votre application se téléchargent également dans cette interface
  • 10. Programmation du comportement de l’application L’interface de programmation permet de définir le comportement de l’application et de ses différents composants, une fois qu’ils ont été créés dans l’interface de design La programmation se fait à l’aide de « blocs » précodés, rédigés en anglais ou français (ou autre langue), qui s’emboîtent les uns dans les autres selon la logique souhaitée Les blocs de code ont déjà un ensemble de propriétés, méthodes et événements associés, qu’on peut enrichir avec la création de nouvelles procédures
  • 12. Test, test, test ! Pour tester son développement en temps réel, le logiciel permet de générer un code barre qu’on scanne à partir de l’appli « compagnon » installée sur le téléphone En quelques secondes, l’appli apparaît sur l’écran et on peut la tester sous quasiment toutes ses coutures.
  • 14. Installation de l’application sur le téléphone Pour installer une application sur le téléphone, 2 méthodes : - Génération d’un code-barre à partir de l’interface du logiciel (code valable 2 heures) - Partage du fichier d’installation par email (le plus simple pour le partager avec plusieurs personnes). On peut également publier les applis sur le Google Play Store. Les fichiers source sont également partageables et modifiables par d’autres.
  • 15. 7. Aller plus loin Ateliers & Stages (à partir de 13 ans) CREATION D’APPLICATIONS MOBILES Inscriptions & renseignements : www.teen-code.com teencodeedu