--- title: "Ajouter un calculateur à votre application mobile" description: "Pour les créateurs qui souhaitent enrichir leurs applications, un calculateur est une solution de choix. Il permet de retenir l’attention des utilisateurs avec" canonical_url: "https://fr.goodbarber.com/blog/ajouter-un-calculateur-a-votre-application-mobile-a1240/" lang: fr date: 2024-03-08 last_updated: 2024-03-08 --- # Ajouter un calculateur à votre application mobile [Retour](/blog/reussir-mon-app-r13/) # Ajouter un calculateur à votre application mobile Ecrit par [Jerome Granados](https://fr.goodbarber.com/blog/author/jerome-granados/) le Vendredi 8 Mars 2024 ![](https://cmsphoto.ww-cdn.com/superstatic/40142/art/grande/78470940-56948546.jpg?v=1708424456.379213) Pour les créateurs qui souhaitent enrichir leurs applications, un calculateur est une solution de choix. Il permet de retenir l’attention des utilisateurs avec un contenu dynamique et personnalisé. Le store d’extension de GoodBarber propose déjà quelques outils comme un [calculateur d’indice de masse corporel](https://fr.goodbarber.com/extensions/bmi-calculator/) ou un [convertisseur de devise](https://fr.goodbarber.com/extensions/currency-converter/) . Pour ceux qui souhaitent aller plus loin, nous vous proposons de (re)découvrir [Appizy](https://www.appizy.com/?utm_source=goodbarber.com&utm_medium=referral), une solution pour transformer une feuille Excel en de puissants calculateurs pour vos applications mobiles. ## Historique du projet Appizy ![Le premier outil low-code du monde a plus de 40 ans](https://cmsphoto.ww-cdn.com/superstatic/40142/art/grande/78470940-56948572.jpg?v=1708424774.4911935 "Le premier outil low-code du monde a plus de 40 ans") Le premier outil low-code du monde a plus de 40 ans Les outils low-codes et no-codes ont explosé ces dernières années. Mais on oublie que l’outil de conception le plus plus low-code et intuitif du monde existe depuis le milieu des années 80: Excel. Impossible de dénombrer la diversité et les usages du tableur. Il est partout dans nos entreprises, nos organisations, nos associations. Appizy voit les utilisateurs d’Excel comme des concepteurs aguerris de logiciels métiers. Son objectif est de proposer une passerelle entre la bureautique et le web. En ajoutant GoodBarber dans l'équation, une nouvelle étape est franchie en créant un pont entre la bureautique et les applications mobiles natives. ## Conception du calculateur ![Première version tableur de notre calculateur de prêt immobilier](https://cmsphoto.ww-cdn.com/superstatic/40142/art/grande/78470940-56948592.jpg?v=1708424949.8238723 "Première version tableur de notre calculateur de prêt immobilier") Première version tableur de notre calculateur de prêt immobilier Nous avions déjà présenté [la solution Appizy sur le blog de GoodBarber](https://fr.goodbarber.com/blog/convertir-un-fichier-excel-en-app-mobile-a962/) en 2020. Nous en reparlons cette année car de nouvelles fonctionnalités sont disponibles. Nous allons vous les faire découvrir au travers de la création d’un calculateur de prêt immobilier. **Premier design** Dans un premier temps, nous concevons l'outil en 2 parties. D’un côté les données d’entrée: coût d’acquisition, taux d’intérêts, etc. De l’autre la mensualité et les détails du prêt. ![Un résultat fidèle mais peu adapté à l’utilisation mobile](https://cmsphoto.ww-cdn.com/superstatic/40142/art/grande/78470940-56948625.jpg?v=1708425104.3148594 "Un résultat fidèle mais peu adapté à l’utilisation mobile") Un résultat fidèle mais peu adapté à l’utilisation mobile Une fois converties en application par Appizy, les cellules de gauche sont bien éditables et les celles de droite s’actualisent au fur et à mesure. Cependant on voit bien que l'interface obtenue fonctionne pour un affichage sur grand écran mais pas sur mobile, avec un défilement vertical. **Optimisation mobile** Appizy propose un éditeur de mise à page - Layout Builder - qui considère que chaque onglet de notre tableur de base est une section indépendante. Il est alors possible d’organiser les onglets dans différentes colonnes dont l’affichage s’adapte à la taille de l’application. Nous commençons par séparer le contenu de notre application en 3 onglets (ou 3 sections): un pour la saisie, un second pour le résumé et un dernier pour les détails du calcul. Ensuite à l’aide du Layout Builder, nous créons une mise en page 2 colonnes: à gauche l’onglet de saisie, à droite les deux autres onglets. Le résultat s’adapte maintenant à tous les formats d’écran. [appizy_demo-ezgif.com-crop-video](https://player.vimeo.com/video/914769217?badge=0&autopause=0&player_id=0&app_id=58479) ## Intégration dans GoodBarber ![](https://cmsphoto.ww-cdn.com/superstatic/40142/art/grande/78470940-56948726.jpg?v=1708434388.8197696) Pour intégrer le calculateur dans une application GoodBarber, nous choisissons une [section Custom Code](https://fr.goodbarber.com/extensions/custom-code-menu/) dans l'Extensions Store. Cette extension donne accès à un éditeur de texte dédié, spécialement conçu pour ajouter du code. Une fois l’extension installée deux options s’offrent à nous pour insérer le calculateur: - En mode embed, rapide et facile: nous récupérons le lien de l’application hébergée chez Appizy et l'insérons dans l’éditeur. - Avec le code: nous téléchargeons le code de l’application pour le ré-uploader dans l’éditeur. Le calculateur fonctionne alors de manière indépendante d’un serveur et donc en mode hors-ligne. Il ne reste plus qu’à sauvegarder le code et ouvrir la prévisualisation. Le tour est joué! ## Pour conclure Avec Appizy, ajouter un calculateur à votre application GoodBarber devient extrêmement simple. A partir du moment où vous savez créer l’outil dans un tableur, il n’est qu’à quelques clics de votre application mobile. Nous avons parcouru dans cet exemple les grandes étapes pour concevoir et intégrer un calculateur de prêt. Cependant les applications ne se limitent pas à l’immobilier. Coach sportif ? Créez un simulateur de programme sportif personnalisé. Enseignant ? Développez des outils pédagogiques et ludiques que vos élèves peuvent retrouver sur mobile et tablette. N’hésitez pas à visiter le site [d’Appizy](https://www.appizy.com/?utm_source=goodbarber.com&utm_medium=referral) pour découvrir des réalisations et télécharger des tableurs pour démarrer vos propres outils. ![Jerome Granados](https://blog.goodbarber.com/_public/profile/1b/1b6453892473a467d07372d45eb05abc2031647a-default.jpg) À propos de l'auteur[Jerome Granados](https://fr.goodbarber.com/blog/author/jerome-granados/)CMO Je suis CMO et associé chez GoodBarber. À travers ce blog, je partage des conseils pratiques pour tirer le meilleur parti de GoodBarber, des analyses sur les tendances qui transforment le mobile et le no-code, ainsi que quelques réflexions sur l’impact de l’intelligence artificielle sur notre industrie. Si un article vous inspire une question, une idée ou un retour d’expérience, discutons-en dans les commentaires. [En savoir plus](https://fr.goodbarber.com/blog/author/jerome-granados/) [![LinkedIn](https://portal.ww-cdn.com/portal_static/svg/base2021/linkedin.3ed8162e2a2b.svg)](https://www.linkedin.com/in/jeromegranados/)[![X](https://portal.ww-cdn.com/portal_static/svg/base2021/x.820492c586dd.svg)](https://x.com/jeromegranados)[![Facebook](https://portal.ww-cdn.com/portal_static/svg/base2021/fb.be37c82b8283.svg)](https://www.facebook.com/jerome.granados)[![Instagram](https://portal.ww-cdn.com/portal_static/svg/base2021/instagram.e3b82841d5d7.svg)](https://www.instagram.com/jeromegranados/)[![Pinterest](https://portal.ww-cdn.com/portal_static/svg/base2021/pinterest.3ba400801cb2.svg)](https://www.pinterest.com/jeromegranados/)