KTA innov Chanlenge 2018

Temps de Lecture: 5 min | 12 May, 2020 | Regis Atemengue

En Novembre 2018, mes amis David Perghaud, Antoine Ulrich Maga , ( 😇 Repose en Paix mon frère tu nous manques) 🙏🏿 et moi nous avons participé à un concours d'innovation organisé par la KTA (KAMANY TALENT ACADEMY) sous le thème: Réalisation des Maquettes interactives des interfaces utilisateur d'une application Android (Cas d'un système de communication entre un SCANNER ODB2 un véhicule automobile. C'était la deuxième éditon et mes deux compagnons avaient en 2017 participer à permière édition et remporter le 4ème prix.

La KTA ACADEMY organise tous les 2 ans un concours d'innovation au CAMEROUN. Ce concours met en compétition les jeunes entrepreneurs, développeurs et autres profils dans le but de développer leur potentiel et faire valoir leur talent pour leur pays.

Convaincus de nos compétences et déterminés à faire mieux qu’à la première édition, nous avons passé 3 mois (novembre, décembre, janvier 2018) à travailler sur le prototype de notre application. L’application permet, entre autres, de faire le diagnostic complet d’un véhicule à partir de son téléphone. La compétition a été très difficile, mais riche en expériences et en émotions. Notre équipe DARK-TECH a une fois de plus remporté le 4ème prix à la fin de la compétition devant plus de 120 candidats tous avec un très bon niveau et n'ayant pas démérités.

A PROPOS DE L'APPLICATION

KTA-SCAN AUTO est une application qui permet de faire le diagnostic complet d’un véhicule à partir de son téléphone. L'application se connecte à un emulateur OBD2 de branché sur votre véhicule. Grâce à son interface conviviale, chaleureuse et surtout simple d’utilisation, vous pourrez facilement :

1.
Poser un diagnostic complet du véhicule :
Avec à KTA-SCAN AUTO, vous pourrez aisément :
→ Afficher l’état de toutes les composantes de votre véhicule (La température du moteur, la pression d’air dans les pneus etc...) à l'aide des capteurs disposés sur le véhicule.
→ Vérifier l’effectivité des paramètres de déplacements urbains et interurbains : l’application s’assure que le véhicule remplit tous les critères pour les déplacements.
2.
Réaliser la maintenance
L'application permet:
→ D’appeler directement un mécanicien choisi parmi les plus performants dans la zone où vous vous trouvez.
→ D’envoyer à un mécanicien des SMS qui contiennent un résumé des pannes identifiées dans le véhicule.
→ De visualiser l’état complet du véhicule lorsqu’une panne est détectée.
→ D’accéder aux rapports de réparation des pannes.
3.
Effectuer de la géolocalisation :
→ Afficher la position d’un véhicule sur une carte (Google map) avec des coordonnées GPS.
→ Sauvegarder l’itinéraire d’un véhicule pour retracer ultérieurement tous ses déplacements.
→ Partager sa position précise par SMS ou mail à des proches
4.

Configurer les paramètres de base du véhicule:
→ Entrer les paramètres de connexion au prototype (mot de passe, Bluetooth, numéro GSM, etc…)
→ Entrer les paramètres de l’application : définir les standards des capteurs (Ex : capteur moteur, capteur de freinage, capteur d’Airbag, capteur de climatisation…)
→ Enregistrer les numéros d’urgence à appeler en cas de détresse.
→ Personnaliser le message de détresse envoyé par le module GSM aux numéros pré-enregistrés.

COMMENT AVONS NOUS CONTRUIT CETTE APPLICATION

Le développement logiciel requiert de bonnes compétences en analyse et en conception en plus d'un bon background technique pour pouvoir produire un prototype fonctionnel.
Ayant travaillé 3 mois pour construire ce prototype, l'équipe a débuté la compétition par le choix d'une méthodologie projet. La méthodologie SCRUM était la mieux adaptée non seulement au vu des tâches à réaliser, mais aussi avec le cahier des charges technique fourni par l’organisateur.

CONCEPTION ET WIREFRAMES

INTERFACES UTILISATEUR & WORKFLOWS

Le concours étant basé sur la conception des interfaces utilisateurs, il était important pour nous d'avoir une vue d'ensemble de l'application proposée. Nous avons commencé par dessiner les maquettes de notre application sur papier tout en discutant du workflow et de la navigation entre les différentes vues. Nos compétences en UI et UX design ont été très avantageuses dans le processus de création car, l'un des problèmes dans le développement mobile est la définition du processus de navigation et la mise en place d'une bonne expérience utilisateur.

Nos wireframes prêts sur papier, l'équipe est pjassée sur des interfaces en couleurs (UI) en utilisant le logiciel ADOBE XD. L’avantage de ce logiciel est la possibilité d'avoir un prototype d'interface partageable et testable directement sur un téléphone mobile, une expérience semblable au rendu final.

DEVELOPPEMENT

L'une des phases que j'aime le plus lors de la réalisation d'un produit web ou mobile est la phase de développement car au cours de celle-ci, l'équipe fait ressortir toute sa maîtrise technique pour donner vie au produit. Les meilleurs architectes web et/ou mobiles sont aussi de très bons développeurs. C'est pourquoi il est très important de connaître la chaîne de développement logiciel et de pouvoir intervenir lorsqu’on travaille dans une petite équipe comme c’était le cas de ce projet.

Pour cette phase, l'équipe a travaillé avec React-Native de Facebook. Il s'agit d'une technologie permettant de créer des applications mobiles multiplateformes basée sur le langage Javascript et le framework React.

Toujours dans les bonnes pratiques de code, l'environnement de développement utilisé était Visual Code de Microsoft couplée avec plusieurs extensions pour avoir une meilleure qualité de code.(ESLINT, PRETTIER, REACT-SNIPPETS etc..)