Créer une application 311 sans codage nécessaire

Les étapes suivantes présentent comment créer une application à partir d’un modèle configurable. Dans cette leçon, vous utiliserez et personnaliserez un modèle afin de générer une application 311 pour la ville de Cilantro.

  • Choisissez un modèle.
  • Changez les paramètres.
  • Procédez à un test sur des appareils.
  • Générez les fichiers d’installation.
  • Publiez l’application dans votre magasin préféré.

Remarque :

Le 311 est un numéro de téléphone pour appels non urgents utilisé dans de nombreuses communautés aux États-Unis et au Canada. Le public peut appeler ce numéro pour accéder à une variété de services municipaux, déposer des plaintes ou signaler des problèmes communautaires non urgents (par exemple, un véhicule abandonné, des graffitis ou une route endommagée). À travers le monde, les autorités locales offrent le même service aux citoyens, mais souvent sans numéro de téléphone standardisé.

Créer une application

La ville de Cilantro vous a fourni une couche d’entités contenant une couche de points et une couche de polylignes qui représentent les services municipaux 311 de Cilantro. Vous utiliserez le modèle Quick Report (Rapport rapide) de AppStudio pour créer une application mobile multiplateforme.

Remarque :

Le modèle Quick Report est idéal pour créer une application de collecte de données. Il vous permet de capturer une observation et de la soumettre sur une couche en ligne. Vous pouvez ajouter votre habillage avec des icônes, des couleurs et des images d’écran de présentation. De nombreuses villes ont créé des applications mobiles 311 basées sur le modèle Quick Report.

Pour commencer, si nécessaire, vous allez télécharger et installer AppStudio, ainsi que des logos et des icônes de la ville de Cilantro. Vous créerez ensuite une application à l’aide du modèle Quick Report.

  1. Téléchargez le fichier Cilantro-City-Branding.
  2. Extrayez le contenu du fichier Cilantro-City-Branding.zip à un emplacement de votre choix (par exemple, C:\Cilantro-City).
  3. Ouvrez AppStudio.
    Remarque :

    Si vous ne disposez pas de AppStudio, vous pouvez le télécharger gratuitement à partir de la page des ressources ArcGIS AppStudio. Une fois le fichier téléchargé, cliquez dessus pour lancer l’assistant d’installation. Suivez les instructions de l’assistant pour installer l’application.

  4. Sur le ruban de l’application AppStudio, cliquez sur Sign In (Se connecter).
  5. Dans la fenêtre Sign In (Se connecter), sélectionnez Sign In (Se connecter).

    Option Sign In (Connexion)

  6. Connectez-vous à votre compte d’organisation ArcGIS ou à ArcGIS Enterprise à l’aide d’un compte d’utilisateur nommé.
    Remarque :

    Si vous ne disposez pas d’un compte d’organisation, consultez les options disponibles pour accéder aux logiciels.

  7. Dans l’application AppStudio, cliquez sur New App (Nouvelle application).

    Bouton New App (Nouvelle application)

    La fenêtre New App (Nouvelle application) apparaît et présente divers modèles d’application clé en main organisés dans des onglets situés le long du ruban.

  8. Dans la fenêtre New App (Nouvelle application), cliquez sur l’onglet Templates (Modèles) et choisissez le modèle Quick Report (Rapport rapide).

    Modèle Quick Report (Rapport rapide)

    Remarque :

    Les noms de modèle peuvent contenir un numéro de version. De plus, lorsque vous sélectionnez un modèle, un résumé et une description d’un cas d’utilisation et des paramètres de modèle s’affichent dans la partie droite de la fenêtre.

  9. Dans le panneau latéral, cliquez sur le bouton Create (Créer).

    Une nouvelle application Quick Report est créée à l’aide du modèle. Elle est ajoutée à la liste des applications disponibles. Il se peut que des applications créées par d’autres membres de votre organisation s’affichent. Toutefois, si c’est la première fois que vous utilisez AppStudio, il s’agit de votre seule application. Avec votre nouvelle application sélectionnée, examinez le panneau latéral, qui fournit des informations supplémentaires sur l’application.

  10. Dans la liste des applications, cliquez sur votre nouvelle application Quick Report pour la sélectionner, si nécessaire. Dans la fenêtre latérale, cliquez sur le bouton Edit Title (Mettre à jour le titre).

    Modifiez le nom de l’application.

  11. Pour Title (Titre), saisissez Cilantro 311, puis cliquez sur Save Changes (Enregistrer les modifications) pour mettre le titre de l’application à jour.

Personnaliser votre application

L’agencement de votre application Cilantro 311 doit présenter clairement votre organisation, ainsi que l’utilisation et les fonctionnalités de l’application. Pour améliorer l’attrait visuel et la valeur informative de votre application, vous allez ensuite en modifier l’apparence en ajoutant des descriptions, des couleurs de ville, des logos et un habillage.

  1. Dans la liste des applications, vérifiez que votre application Cilantro 311 est sélectionnée et cliquez sur le bouton Settings (Paramètres) dans le panneau latéral.

    La fenêtre AppStudio Settings (Paramètres AppStudio) s’ouvre. Repositionnez la fenêtre selon les besoins. Ne fermez pas la fenêtre de votre application AppStudio parent.

    Choisissez les paramètres.

    Dans la fenêtre AppStudio Settings (Paramètres AppStudio), vous allez changer et mettre à jour la miniature d’application.

  2. Dans la fenêtre Details (Détails), cliquez sur l’icône représentant l’image miniature d’application.

    Changez la miniature.

    Une fenêtre de navigateur apparaît.

  3. Dans la fenêtre de navigateur, accédez au dossier où se trouve le contenu Cilantro-City-Branding que vous avez extrait. Double-cliquez sur l’image thumbnail-cilantro311.
  4. Une boîte de dialogue s’affiche, vous informant qu’une copie de cette image va remplacer la miniature actuelle. Cliquez sur Yes (Oui) pour valider le remplacement.

    La fenêtre Details (Détails) met la miniature de l’application Cilantro 311 à jour en fonction du logo de la ville.

  5. Dans la fenêtre Details (Détails), pour Summary (Résumé), saisissez Signaler facilement et rapidement des problèmes à la ville.
  6. Pour Description, saisissez Cette application permet aux citoyens de demander facilement et rapidement des services 311 communautaires non urgents (par exemple, retrait de graffitis, réparation d’un lampadaire et entretien des arbres et autres) à la ville de Cilantro.

    Vous allez ensuite ajouter une icône pour représenter l’application et lui attribuer une marque sur les smartphones et autres appareils sur lesquels elle sera probablement déployée.

  7. Dans la fenêtre AppStudio Settings (Paramètres AppStudio), cliquez sur l’onglet Resources (Ressources).
  8. Dans la fenêtre Resources (Ressources), pour App Icon (Icône d’application), cliquez sur l’image.

    Changez l’icône.

  9. Dans la fenêtre de navigateur, localisez le dossier où se trouve le contenu Cilantro-City-Branding que vous avez extrait. Double-cliquez sur l’image Icon-cilantro311.
  10. Dans la fenêtre de message, cliquez sur Yes (Oui) pour copier le fichier d’image dans le dossier de projet de l’application.

    L’icône est mise à jour. Vous allez ensuite ajouter une image d’arrière-plan.

  11. Dans la fenêtre AppStudio Settings (Paramètres AppStudio), cliquez sur l’onglet Properties (Propriétés).

    La fenêtre QuickReport Properties (Propriétés de QuickReport) s’ouvre.

  12. Localisez et examinez les onglets Start Screen (Écran de démarrage), Form (Formulaire), Colors (Couleurs) et Other Properties (Autres propriétés) de la fenêtre.
  13. Dans l’onglet Start Screen (Écran de démarrage), dans Background image (Image d’arrière-plan), cliquez sur l’image d’arrière-plan par défaut (Feu de forêt).

    Modification de l’image d’arrière-plan.

  14. Dans la fenêtre de navigateur, localisez le dossier où se trouve le contenu Cilantro-City-Branding que vous avez extrait. Double-cliquez sur l’image background-cilantro311.
  15. Si un message s’affiche, vous demandant si vous voulez copier l’image dans le dossier de l’application, cliquez sur Yes (Oui).

    Dans la fenêtre QuickReport Properties (Propriétés de QuickReport), l’image d’arrière-plan de l’écran de démarrage est mise à jour afin de refléter l’habillage mis à jour pour l’application Cilantro 311.

  16. Dans l’onglet Start Screen (Écran de démarrage), faites défiler l’affichage et localisez la propriété Show logo (Afficher le logo), puis cliquez sur le bouton Show Logo (Afficher le logo) pour désactiver le logo.

    Afficher le paramètre de logo

  17. De vous-même, vous pouvez mettre à jour les liens de bas de page et ajouter un numéro de téléphone, des détails de site Web et d’autres coordonnées telles qu’une adresse e-mail.
  18. En bas de la fenêtre AppStudio Settings (Paramètres AppStudio), cliquez sur Apply (Appliquer) pour enregistrer les modifications.

    Une fenêtre de message verte confirme que vos paramètres ont été appliqués.

    La ville de Cilantro vous a fourni une couche d’entités contenant une couche de points et une couche de polylignes qui représentent les services municipaux 311 de Cilantro. Vous allez ensuite ajouter la couche d’entités à l’application.

Ajouter

Puisque la ville de Cilantro vous a fourni une couche d’entités allant être utilisée dans l’application mobile 311 pour collecter des informations, vous n’aurez pas besoin de créer une nouvelle couche d’entités. La couche d’entités (et plus particulièrement le modèle utilisé dans sa conception et sa création) est importante car elle permet à l’application Quick Report d’établir les sélections et les choix que les citoyens utilisent pour signaler et soumettre des demandes 311 communautaires non urgentes.

  1. Dans la fenêtre QuickReport Properties (Propriétés de QuickReport), localisez l’onglet Form (Formulaire) et cliquez dessus.

    Onglet Form (Formulaire)

    Remarque :

    Les services d’entités, plus généralement appelés couches d’entités, permettent aux organisations de diffuser des entités sur Internet et fournissent une symbologie spécifique à utiliser pour afficher les entités. De plus, ils fournissent un modèle pouvant être utilisé pour une expérience de mise à jour améliorée, dans laquelle les utilisateurs peuvent exécuter des requêtes pour localiser et mettre à jour des entités existantes et en ajouter de nouvelles. Toutes les mises à jour sont appliquées au serveur et mises à la disposition des utilisateurs de la couche d’entités.

  2. Dans la fenêtre Form (Formulaire), localisez et examinez la propriété Feature service address (Adresse du service d’entité).
    Remarque :

    Votre application Quick Report utilisera la couche d’entités et ses couches et paramètres comme un modèle pour générer les détails de rapport de l’application. Par exemple, vous disposez peut-être d’une couche d’entités de rue utilisée pour collecter les informations de panneau de signalisation dans votre voisinage. Chaque entité de panneau de signalisation, existante ou capturée comme nouvelle par vous et stockée dans une couche, peut inclure des attributs vous permettant de mettre à jour et de capturer la condition du panneau, d’inclure une photo du panneau et de signaler une plainte relative au panneau de signalisation.

  3. Dans la propriété Feature service address (Adresse du service d’entités), remplacez l’adresse par défaut par l’URL suivante :
    https://services2.arcgis.com/j80Jz20at6Bi0thr/arcgis/rest/services/Cilantro/FeatureServer

    Adresse du service d’entités

    Remarque :

    Pour trouver l’adresse d’un service d’entité hébergée, ouvrez l’élément de couche d’entités hébergées dans ArcGIS Online ou ArcGIS Enterprise. Faites défiler l’affichage jusqu’à la section URL et cliquez sur le bouton Copy (Copier) pour copier l’adresse.

    Copiez l’adresse URL du service d’entité.

  4. Pour Layer IDs of the feature service (ID de couche du service d’entité), saisissez 0,1.

    Les ID de couche d’entités de la ville de Cilantro identifient les éléments suivants :

    • 0 représente les entités ponctuelles pour collecter les problèmes de graffiti, de lampadaire, de déchets ou de panneau.
    • 1 représente les polylignes pour collecter les problèmes de rue ou de trottoir.

    Un service d’entité, ou couche d’entités, peut consister en plusieurs couches qui constituent le service. Pour référencer des couches spécifiques dans une application, vous devez entrer les ID de couche afin d’identifier les couches auxquelles votre application aura accès et qu’elle utilisera. La numérotation des ID de couche commençant par 0, si votre couche d’entités consiste en cinq couches et que vous utilisez trois couches, votre liste d’ID de couche peut être 0,3,4, indiquant que vous référencez les première, quatrième et cinquième couches dans le service.

    Remarque :

    Vous pouvez examiner et identifier les ID de couche de services d’entités dans le répertoire des services ArcGIS REST ainsi que le nom de couche et le type d’entité (point, polyligne ou polygone).

Vous allez ensuite finaliser l’habillage de l’application avant de générer le fichier d’installation.

Ajouter une couleur d’habillage

Changez et mettez à jour la couleur de l’application en fonction des couleurs utilisées dans le logo et les icônes de votre application mobile 311.

  1. Dans la fenêtre QuickReport Properties (Propriétés de QuickReport), cliquez sur l’onglet Colors (Couleurs).
  2. Pour Header background color (Couleur d’arrière-plan d’en-tête), saisissez #f15a24 puis appuyez sur la touche Entrée. Pour Button color (Couleur de bouton), pour le code hexagonal de couleur, saisissez #f15a24 et appuyez sur Entrée.

    Mettre à jour des couleurs de l’habillage

  3. En bas de la fenêtre AppStudio Settings (Paramètres AppStudio), cliquez sur Apply (Appliquer).

    Une fenêtre de message verte confirme que vos paramètres ont été appliqués.

    Vous allez ensuite définir une licence pour ArcGIS Runtime. Les applications sans licence affichent une carte filigranée. Pour cette carte, vous allez sélectionner une licence Lite gratuite.

  4. Dans le panneau gauche de la fenêtre AppStudio Settings (Paramètres AppStudio), localisez et sélectionnez l’onglet Licensing (Licences).
  5. Dans la fenêtre Licensing (Licences), sous ArcGIS Runtime Licensing (Licences ArcGIS Runtime), pour License Key (Clé de licence), cliquez sur Set Lite license (Définir la licence Lite).

    Bouton Set Lite license (Définir la licence Lite)

    La boîte de dialogue License Key (clé de licence) est mise à jour et affiche un jeton de clé de licence valide.

  6. En bas de la fenêtre AppStudio Settings (Paramètres AppStudio), cliquez sur Apply (Appliquer), puis fermez la fenêtre.

Tester votre application

Vous allez ensuite tester votre application. Vous allez d’abord la tester dans l’application de bureau. Vous pourrez ensuite la tester sur un appareil mobile si vous le souhaitez.

  1. Dans la fenêtre AppStudio, vérifiez que l’application Cilantro 311 est sélectionnée.
  2. Dans la fenêtre latérale, cliquez sur Run (Exécuter).

    bouton Run

  3. L’application Cilantro 311 s’ouvre dans une nouvelle fenêtre.

    Exécutez l’application.

  4. De vous-même, testez les fonctionnalités de l’application Cilantro 311.
    • Cliquez sur New (Nouveau) et générez un nouveau rapport concernant un véhicule abandonné, un nouveau graffiti ou un dommage sur la route.
    • Utilisez le bouton Next (Suivant) pour explorer les diverses options de l’application.
    • Dans la fenêtre Add Location (Ajouter un emplacement), déplacez la carte afin d’affiner l’emplacement pour le rapport.
    • Lorsque vous avez terminé, fermez l’application.

    Carte Web sur la page Add Location (Ajouter un emplacement)

    Vous pourrez ensuite charger la carte et la partager avec la communauté.

  5. Dans la fenêtre AppStudio, vérifiez que votre application Cilantro 311 est sélectionnée et cliquez sur le bouton Upload (Charger).

    Bouton Upload (Charger)

  6. Dans la fenêtre AppStudio Upload (Chargement AppStudio), pour les options Sharing (Partage), cliquez sur My organization (Mon organisation), puis sur le bouton + Upload (+ Charger).

    Un message Upload successful (Chargement réussi) vert confirme que votre application a été chargée et peut désormais être téléchargée et installée par les membres de la communauté.

  7. Fermez la fenêtre AppStudio Upload (Chargement AppStudio).

    Vous pouvez ensuite choisir d’installer AppStudio Player sur un appareil mobile ou de tester l’application sur votre bureau en installant une version de bureau de AppStudio Player. Les étapes suivantes illustrent une installation de bureau suivie des étapes facultatives pour les appareils mobiles.

    Remarque :

    Si AppStudio Player n’est pas installé sur votre bureau, téléchargez-le à partir de la page des ressources ArcGIS AppStudio. Une fois le fichier téléchargé, cliquez dessus pour lancer l’assistant d’installation. Suivez les instructions de l’assistant pour installer l’application.

    Pour installer AppStudio Player sur un appareil mobile, téléchargez-le gratuitement via le Microsoft Store, Google Play ou l’App Store. Sur votre appareil mobile, procédez à l’installation selon les instructions.

  8. Sur votre bureau ou votre appareil mobile, lancez AppStudio Player. Cliquez sur Sign In (Se connecter) et connectez-vous à votre compte ArcGIS, puis sélectionnez votre application Cilantro 311.
    Remarque :

    Dans AppStudio Player, vous pouvez vous connecter avec un compte ArcGIS Online ou ArcGIS Enterprise.

  9. Dans AppStudio Player, téléchargez votre application et testez-la en ajoutant un nouveau rapport et en collectant un point ou une ligne pour identifier l’emplacement du rapport.

Avec ArcGIS AppStudio Developer Edition, les développeurs peuvent créer un fichier d’installation d’application permettant de publier l’application dans un magasin. La section facultative suivante indique les étapes à suivre pour cela.

Créer des fichiers d’installation d’application (facultatif)

Si vous disposez d’une licence ArcGIS AppStudio Developer Edition (disponible via l’achat d’un abonnement à ArcGIS Developer de niveau concepteur et supérieur), vous pouvez créer des fichiers d’installation d’application. Dans cette section, vous allez créer un fichier .apk d’installation d’application pour Android et un fichier .exe d’installation d’application pour Windows.

Remarque :

Vous aurez besoin d’une licence Apple Developer afin de créer un fichier .ipa d’installation d’application pour les appareils iOS.

  1. Dans AppStudio, dans le panneau latéral, cliquez sur Settings.
  2. Dans la fenêtre AppStudio Settings (Paramètres AppStudio), cliquez sur Platforms (Plateformes) > Android. Pour Package Name (Nom du paquetage), spécifiez un nom tel que com.nomentreprise.monapp.
    Remarque :

    Selon une convention, le nom standard attribué au paquetage comprend le nom de l’entreprise.

    Spécifiez le nom du paquetage Android.

  3. Cliquez sur Apply (Appliquer).
  4. Fermez la fenêtre des paramètres AppStudio.
  5. Dans AppStudio, vérifiez que l’application est sélectionnée et, dans le panneau latéral, cliquez sur Make (Créer).

    Choisissez l’outil Construire.

    La fenêtre Make (Créer) s’affiche.

  6. Pour Cloud Make (Construction sur le cloud), cliquez sur Select (Sélectionner).

    Sélectionner Cloud Make (Construction sur le cloud)

  7. Dans la fenêtre Cloud Make configuration (Configuration de la construction sur le cloud), pour Select target platform(s) (Sélectionner la ou les plateformes cibles), dans la colonne Android, cochez la case ARMv8 (64 bit) (ARMv8 (64 bits)) et, dans la colonne Windows, cochez la case 64 bit (64 bits).

    Configuration sur le cloud

  8. Cliquez sur Analyze Build (Analyser le build), puis sur Request Build (Demander le build).

    La fenêtre Build Status (Statut de build) apparaît.

    Il faut quelques minutes au service cloud AppStudio pour créer les fichiers d’installation d’application. Une fois la demande de build satisfaite, vous recevez un e-mail contenant les instructions de téléchargement et d’installation.

  9. Dans la fenêtre Build Status (Statut de build), cliquez sur https://appstudio-ota.arcgis.com/ et connectez-vous avec votre compte ArcGIS.

    Lien de téléchargement

    Remarque :

    Vous pouvez également numériser le code QR des fichiers d’installation sur la page de la console d’application à l’adresse https://appstudio.arcgis.com/.

  10. Cliquez sur Install (Installer) puis téléchargez et installez les applications sur votre appareil.

    Bouton Install (Installer)

Dans cette leçon, vous avez utilisé ArcGIS AppStudio avec un modèle configurable prêt à l’emploi afin de créer et de déployer plus facilement une application mobile pour la ville de Cilantro, où les citoyens peuvent soumettre des demandes 311 communautaires non urgentes (par exemple, suppression de graffitis, réparation d’un lampadaire et entretien des arbres). Développer cette application, qui peut s’exécuter sur plusieurs plateformes, n’a pas nécessité d’écriture de code, et l’application peut être partagée dans votre organisation ou avec le public. Des étapes facultatives ont indiqué comment installer AppStudio Player sur diverses plateformes mobiles et créer un fichier d’installation d’application.

Pour plus d’informations, consultez les rubriques suivantes :