Introduction à App Inventor

Création d'applications mobiles pour débutants (sur Android) : introduction au logiciel de programmation App Inventor du MIT.

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

3. 1. Introduction

4. a ppinventor.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)

5. 2. Installation

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é.

7. 3. Interface de design

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

9. 4 . Interface de programmation

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

11. 5. Test

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.

13. 6. Installation et partage

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

16. www.teen-code.com teencodeedu