Want to create interactive content? It’s easy in Genially!
Cahier des charges Carakt
Razya ASB
Created on September 14, 2023
Start designing with a free template
Discover more than 1500 professional designs like these:
Transcript
SERVICES DE TRANSPORT HAUT DE GAMMES POUR UNE CLIENTELLE EXIGEANTE ET INTERNATIONALE
01
PRésentation
a prpopos de moi
01. About ME
Moumen arif 46 ans
Fonctionnaire territorial durant 15 ans, j'ai créé mon entreprise de VTC en 2016. Ma découverte du numérique après une formation WordPress en 2021 m'a passionné, m'orientant vers une formation en développement web et web mobile chez Simplon. J'aime résoudre des problèmes et créer des solutions concrètes. J'ai déjà été sollicité pour des projets et vise un poste de développeur junior React/Node.js après ma formation. Mon parcours est guidé par ma quête d'accomplissement et d'évolution dans le monde de l'IT.
02
ANALYSE DU BESOIN
CONSTAT & CONTEXT
Évolution du Marché des VTC : De la Libéralisation à la Nécessité d'une Présence Numérique
Le haut de gamme peu concurrentiel mais très exigeant, offre une opportunité de croissance importante et une clientèle en demande.
02. Constat
"L'offre haut de gamme et premium est rare sur le web. La clientèle du segment haut de gamme peinent à trouver des solutions autres que les plateformes type Uber et les taxis."
Libéralisation du secteur des VTC en 2009 digitalisation (UBER) 60 000 chauffeurs en France en 2022 500 en 2010. CA 4 milliards d’euros en 2021. Trois catégories distinctes :
- Haut de gamme,
- Premium
- Classique.
Prestations de transport haut de gamme pour une clientèle exigeante et internationale
Une réponse à un besoin concret
02. Context
"Le web est un canal incontournable et un élément clé de la stratégie d’une entreprise de VTC. Il offre cette possibilité d’être présent et visible constamment, en tout temps et en tout lieu."
Web App « Caraktair » Prestations de transport haut de gamme et premium, au départ de Paris et de l’Ile de France, pour une clientèle exigeante et internationale. « Caraktair » se concentrera sur les gammes de véhicules et les prestations les plus demandés par ses cibles.
Attentes
02. attentes & objectifs
- Attirer puis convertir les visiteurs en prospects puis en clients
- Fidéliser les clients
- Attirer de nouveaux partenaires (clés d’or, palaces parisiens et hôtels 5 étoiles, tours opérateurs)
- Augmenter mon chiffre d’affaires
objectifs
- Générer du trafic qualifié
- Toucher les clients Internationaux
- Etablir une présence en ligne solide
- Augmenter les reservation
03
Conception
Visuelle & interface
03. BRainstorming
NUAGE DE MOTS
Un brainstorming à été réalisé en amont de la conception visuelle. Cette recherche de mots clés c'est faite durant un atelier avec mes collèges de formation et avec l'aide d'amis chauffeurs vtc.
03. Echelle d'osgood
ANALYSE DIFFérentielle
La méthode d'Osgood a été appliquée aux mots résultant du brainstorming afin de les filtrer pour ne concerver que les plus pertinents pour le projet. L'analyse différentielle est basé sur deux critères: Pertience et Nécessité. Une note entre 1 et 5 est attribuée pour chaque mot et pour chaque critère pour evaluer sa force. Le point noir indique la note : le plus à gauche 1 ; le plus à droite 5. Les mots clés sélèctionnés nous permettent d'établir une planche de tendances ou d'inspirations (Moodboard).
03. MOODBOARD
KEYWORDS
Luxe Prestige Finesse Exclusif Elégant Rafinement
Haut de gamme
Prestation
Déplacement
CARAKTAIR
Transfert
Événementiel
03. STYLE TILES
Palette de couleurs
Call to action
Noir de titre
Déclinaison
Noir de texte
Blanc cassé
Blanc pur
Dominante
Typographie
Icônes
Boutons
04
Maquettage & MocKUP
ZONING WIREFRAME
04. ZOning
04. Wireframe
04. Maquette
04. MOCKUP
04. OUTILS
05
WEB APP STATIQUE
RESPONSIVE
05. RESPONSIVE
STRUCTURE > HTML 5 : Balises structurantes main / header / section / article / h1-h4 / footer STYLE > CSS 3 : Flexbox / Media queries / Class CSS
06
WEB APP dynamique
interactions
06. DEVELOPPEMENT
React librairie Javascript > interfaces utilisateur dynamiques et réactives. Dom virtuel Composants atomiques & réutilisables Expérience utilisateur ++ Navigation chargement fluide et rapides. Dépendances & Communauté GitHub & Vercel > cycle de developpement progressif : 1. Code 2. Push (git add, git commit, git push). 3. Deploy (lien vercel) test. 4. Validation + Code sécurisé feature après feature, + Feedback & test nouvelles features rapidement.
07
BASE DE DONnées
méthode Merise - mcd - mld - MPD
07. méthode merise
Choix de la méthode de conception
Plutôt que de choisir la méthode UML (Unified Modeling Language - Langage de Modélisation Unifié) nous lui avons préféré Merise comme méthode de conception de notre projet.le MCD permet de définir les données à manipuler. le MLD permet de structurer les données à manipuler le MPD permet de définir le stockage des informations à manipuler dans notre base de données.
07. modèle conceptuel des données - mcd
Représentation graphique des données Schéma Entité - Association
- Entité
- Association
1,n Cardinalités PK Clés primaires
07. modèle logique des données - mld
Schéma relationnelle et normalisée du MCD
- Tables
FK Clés étrangères
07. modèle PHYsique des données - mPd
Implémentation du MLD
Persistance & manipulation des données > Format de stockage en base de données relationnelle SGBDR (Système de Gestion de Bases de Données Relationnelle). MySQL > Licence est libre très utilisé dans les projets Web. Language > SQL (Structured Query Language)
- Largement supporté par les produits commerciaux
- Simple d'utilisation.
08
SERVEUR & BACKEND
ACCES stockage ET MANIPULATION DES données
08. DEVELOPPEMENT
ENVIRONNEMENT SERVER & ACCES aUX DONNEES
Node.js & Express > Environnement d'exécution gratuit et libre de droits. Ecrire des scripts serveur en JavaScript. Très performant Node.js utilise le moteur JavaScript V8 de Google. Routes > Requêtes SQL (CRUD) Methode requête http > Get - Put - Post - Delete Format > JSON Sécurité > mysql2 - argon2 - cors - .env (.gitignore)
CLIENT <--> API <--> SERVER
DEMO
caraktair
portfolio
quadkits
BILAN
ÉMOTIONNEL - CRITIQUE - ACQUISITIONNEL
MERCIPOUR VOTRE ATTENtTION
QUESTIONS
CARAKTAIRCAHIER DES CHARGES
PROJET FINAL
Moumen ARIF SIMPLON.CO
14/09/2023
10. DEVELOPPEMENT
CHOIX des technologies
Côté client, outre le HTML, CSS et Javascript, incontournables pour le developpement de solution web, nous avons choisi le framwork React pour sa capacité à produire des interfaces utilisateur dynamiques et réactives. Son utilisation garantit une expérience utilisateur optimale, avec une navigation fluide et des chargement rapides, tout en facilitant la gestion des composants réutilisables. Côté serveur, nous utilsions Node.js et son framwork Express comme environnement d'exécution, il est gratuit et libre de droits. Node.js nous permet d'écrire des scripts serveur en JavaScript. Très performant, Node.js utilise le moteur JavaScript V8 de Google. JSON pour les fichiers API, son format de données léger et largement reconnu. Il permet de structurer les données de manière claire et flexible, favorisant ainsi l'intégration avec d'autres systèmes et services. Nous avons choisi de developper notre projet progressivement, GitHub et Vercel nous permettent de mettre en place notre cycle de developpement : 1. Code 2. Push (git add, git commit, git push). 3. Deploy (lien vercel) L'avantage de cette méthode est de sécurisé son code feature après feature, obtenir des feedback et tester les nouvelles features rapidement.
03. Personas & BENCHMARK
02.ANALYSE DU BESOIN
04. Fonctionnalités
01.A propos de moi
SOMMAIRE
07. Conception Visuelle & interface
05.Arborescence
08.Maquettage & Mockups
06.Parcours Utilisateur
11.DEPLOIEMENT
12.MAINTENANCE
10.DEVELOPPEMENT
09.BASE DE DONnées
03
Personas
archetype utilisateurs
03
benchmark
analyse concurrentielle
03. Benchmark
CHABE limousine
Pionnier de la Grande Remise en France (depuis 1921). Groupe familial, Chabé est expert du transport sur mesure.
03. Benchmark
SERVICE PRESTIGE
Crée en 1985, siège basé à l’aéroport du Bourget. En croissance constante
03. Benchmark
CARDEL GROUP
Crée en 1999, Cardel global fusionne avec Nornes (gestion des installations d'entreprise et de la logistique des voyages dans l’industrie du sport) en 2020 et devient Cardel Group.
03. benchmark
Conclusion de l’analyse concurrentielle
Ces résultats nous confortent dans notre stratégie : • Limitation aux offres et gammes les plus demandées • Simplification du processus de réservation. • Site adaptif accessible ergonomique • Proposer un formulaire moderne, intuitif et optimisé pour l’UI/UX • Proposer la commande et le paiement en ligne (v2) Nous opterons pour un style simple et épuré, nous sommes convaincus que conformément à la loi de Pareto 20% des éléments de notre site provoqueront 80% des objectifs.
04
FONCTIONnALITES
Descriptif & contenu
04. Fonctionnalités
05
Arborescence
navigation & maillage interne
05. Arborescence
06. Parcours utilisateur
07. Charte Graphique
Nom et logo
Le nom CARAKTAIR en lettre capitale rappel la singularité et le raffinement, cette combinaison de sons et de lettres crée une marque qui respire l'élégance et l'exclusivité. La marque suggère également un luxe discret, associé à l'élégance intemporelle. Le C en fome hexagonale est évocateur de stabilité et de structure, il permet de transmettre les valeurs de confiance et de fiabilité. L'hexagone est une forme géométrique élégante, avec ses angles équilibrés et ses lignes épurées il renvoie à l'idée d'une élégance qui transcende les tendances passagères, offrant ainsi une expérience intemporelle et inoubliable. Enfin, les angles vifs de l'hexaogone evoquent un sentiment de dynamisme et d'énergie, contribuant à créer une sensation de mouvement et d'action.
07. Charte Graphique
Psychologie des couleurs
Les couleurs retenues pour la conception visuelle du site, à savoir le noir, le bleu nuit, le blanc, le jaune or, évoquent des émotions et des associations psychologiques spécifiques. Le noir évoque la sophistication, l'élégance et la puissance. Il est souvent associé au luxe et à l'exclusivité. Le noir peut être utilisé pour créer une atmosphère chic et prestigieuse sur le site. Il rappelle les couleurs de la profession. Le bleu nuit est synonyme de calme, de confiance et de sérénité. Il peut évoquer une sensation de sécurité et de fiabilité. Le blanc symbolise la pureté, la simplicité et la clarté. Il est souvent associé à la propreté et à la transparence. Le blanc est idéal pour les arrière-plans de site web, car il permet une lecture facile du contenu. Il peut également renforcer l'image de qualité et de professionnalisme. Le jaune or évoque la richesse, la chaleur et la luminosité. Il peut créer une sensation d'optimisme et d'abondance. Le jaune or peut être utilisé pour mettre en avant des éléments importants, tels que les boutons d'appel à l'action, pour attirer l'attention des visiteurs.
07. Charte éditoriale
TON de la communication
Notre charte éditoriale repose sur les valeurs fondamentales de luxe, d'exclusivité et d'élégance, en accord avec les mots-clés du brainstorming que nous avons sélectionnés. Nous mettrons en avant des contenus rédigés avec soin, reflétant notre engagement envers la qualité et la personnalisation. Utilisation d'un langage soigné et précis pour transmettre une image de qualité supérieure. Adopter un ton professionnel pour instaurer la confiance chez les visiteurs.
07. matrice des couleurs
Test de contraste
Afin que notre contenu soit accessible au plus large public de manière optimale, nous avons veillez à respecter le niveau AA du référentiel WCAG (Web Content Accessibility Guidelines). Le site https://www.siegemedia.com/contrast-ratio nous a permis de vérifier nos contrastes.
10
DEVELOPPEMENT
technologies
11
deploiement
domaine & hebergement REFERENCEMENT
11. nom de domaine & hebergement
Nom de domaine
www.carakatair.com www.carakatair.fr www.carakatair.net Nous pensons qu'avoir plusieurs extensions de domaine peut renforcer la présence en ligne, protéger la marque (personne d'autre ne peut enregistrer un domaine similaire et potentiellement nuire à la marque), permettre de mieux cibler un public internationale. Cela offre également une flexibilité marketing (exemple : utiliser caraktair.fr pour une promotion spécifique en France) et une protection contre le cybersquattage (achat des domaines similaires dans le but de les revendre à un prix élevé).
HEBErgement
Nous avons choisi l'hebergeur 100% français OVH, dont les serveurs sont situé en France à Gravelines, France.Le site sera héberger sur un serveur privé virtuel (VPS) il offre fiabilité, performances, flexibilité et sécurité, le tout à des tarifs compétitifs.
11. REFERENCEMENT
STRATEGIE
- Recherche approfondie de mots clés pertinents pour le secteur et le public cible.
- Création de contenu de qualité répondant aux besoins des visiteurs.
- Optimisation de chaque page avec des balises de titre et des métadonnées appropriées.
- Garantie de la compatibilité mobile pour une expérience utilisateur optimale.
- Obtention de backlinks de haute qualité pour renforcer la notoriété du site.
- Réduction de la vitesse de chargement du site grâce à une optimisation minutieuse.
- Soumission d'un sitemap à Google Search Console pour une indexation efficace.
- Utilisation d'outils tels que Google Analytics, Google Search Console, etc.
- Suivi du trafic, optimisation du contenu et compétitivité dans les classements de recherche.
- Objectif : augmenter la visibilité de Caraktair sur les moteurs de recherche tout en offrant une expérience de qualité aux visiteurs.
12
MAINTENANCE
Mises à Jour et Maintenabilité
12. Mises à Jour et Maintenabilité
STRATEGIE
Mises à jour du Système :
- Système d'exploitation : Maintenir à jour le système d'exploitation de votre VPS en suivant les mises à jour recommandées par OVH. Cela peut être fait mensuellement ou au besoin.
- Serveur Web : Nginx, mise à jour régulière . Au moins trimestriellement.
- Nouveau Contenu : En fonction du besoin.
- Révision de Contenu Existant : Passez en revue régulièrement le contenu existant pour s'assurer qu'il reste pertinent et précis. Au moinstrimestriellement.
- Sauvegardes Régulières : Automatisation des sauvegardes, fréquence quotidienne.
- Optimisation de la Performance : Surveillez la vitesse de chargement du site et effectuez des ajustements si nécessaire. Fréquence trimestrielle.
- Assistance Utilisateur : Assurez-vous de répondre aux problèmes des utilisateurs rapidement. Cela doit être fait en temps réel ou dans les plus brefs délais.
12. Statistiques de Connexions
STRATEGIE
Ma stratégie pour suivre la performance de mon site web repose sur l'utilisation de Google Analytics et d'autres outils d'analyse. En utilisant ces statistiques de connexion, je collecterai des données sur le comportement des visiteurs, y compris le trafic, la source des visiteurs, les pages les plus consultées.. 1. Comprendre le Public : En analysant les statistiques démographiques et géographiques des visiteurs, je pourrai mieux comprendre le public cible de mon site. 2. Suivre les Conversions : En configurant des objectifs de conversion, je suivrai les actions souhaitées des utilisateurs, telles que les formulaires soumis ou les ventes réalisées. 3. Identifier les Points d'Entrée : Je repérerai les pages qui génèrent le plus de trafic, ce qui me permettra de mieux optimiser ces zones pour une meilleure expérience utilisateur. 4. Analyser le Comportement de Navigation : Je suivrai le chemin des utilisateurs à travers le site pour repérer les éventuels points de friction ou d'abandon. 5. Mesurer les Performances : La vitesse de chargement des pages, le taux de rebond et d'autres indicateurs de performance seront surveillés pour garantir une expérience fluide. 8. Suivre les Campagnes Marketing : Je mesurerai l'efficacité des campagnes publicitaires et du référencement en ligne. En utilisant ces informations, je pourrai prendre des décisions éclairées pour améliorer constamment mon projet, répondre aux besoins des utilisateurs, et maximiser la performance globale de mon site web Caraktaïr.