Introduction : La conception représente une phase principale pour produire une application. Nous proposons en premier lieu de définir les diagrammes de cas d’utilisation relative aux besoins fonctionnels, puis de définir le scenario relatif à chaque cas d’utilisation en utilisant les diagrammes de séquences.
1. L'outil de conception :
Pour modéliser les différents diagrammes dans la phase de conception nous
avons utilisé "visuelle paradigme online Express Edition", est un outil de conception et de modélisation tout-en-un destinée aux entreprises souhaitant créer ou remodeler leurs applications de manière rapide. [16]
Figure n ° 08 : visuelle paradigme
2. Diagrammes de cas d’utilisation de notre site web :
Nous avons faire le diagramme de cas d’utilisation afin de donner une vision claire sur les interactions entre les utilisateurs et notre site web, Ce diagramme possède deux composantes essentielles qui sont les acteurs et les cas d’utilisation. 2.1. Identification des acteurs du système : La première étape à suivre est l’identification des acteurs qui vont interagir avec le système. Le visiteur : c’est un acteur qui peut seulement voire les trajets disponibles et consulter leurs prix et leurs caractéristique, il a aussi le droit de créé un compte sur notre site pour devient un client Le Client : c'est un visiteur ayant déjà créé un compte sur notre site, il peut donc proposer un trajet, Annuler une annonce et inscrire dans un trajet, donné son avis sur un conducteur en écrivant un commentaire L’administrateur : C’est celui qui dirige le site et faire les différents mises à jour des trajets, supprimer un trajet, modifier un trajet, supprimer un client, ajouter un client, modifier un client, consulter les listes des trajets, des clients.
10 Chapitre II : Conception
2.2. Diagramme de cas espase connexion
Figure n °09 : Diagramme de cas espase connexion
11 Chapitre II : Conception
2.3. Diagramme de cas espase profil
Figure n °10 : Diagramme de cas espase profil
12 Chapitre II : Conception
2.4. Diagramme de cas espase des trajets
Figure n °11 : Diagramme de cas espase des trajets
13 Chapitre II : Conception
2.5. Diagramme de cas espase discussion
Figure n ° 12: Diagramme de cas espase discussion
2.6. Diagramme de cas d’utilisation espace admin
Figure n ° 13 : Diagramme de cas d’utilisation espace admin
14 Chapitre II : Conception
3. Les diagrammes de séquences de notre site web
Nous avons faire Les diagrammes de séquences pour représenter graphiquement les scénario des cas d’utilisation selon un ordre chronologique. 3.1. Diagrammes de séquences de l’inscription
Figure n° 14 : Diagrammes de séquences de l’inscription
15 Chapitre II : Conception
Le client demande le formulaire d’inscription, Le formulaire s’affiche, Le
client rempli le formulaire, Une vérification de l’existence du client dans la base se lance, Si le client existe déjà un message d’erreur s’affiche, Si c’est un nouveau client confirmation de l’inscription s’affiche.
16 Chapitre II : Conception
3.2. Diagramme de séquence pour chercher un trajet
Figure n °15 : Diagramme de séquence pour chercher un trajet
17 Chapitre II : Conception
3.3. Diagramme de séquence pour la création de trajet
Figure n° 16: Diagramme de séquence pour la création de trajet
18 Chapitre II : Conception
Le client entre son login et son mot de passe, Une vérification se lance dans la base de données, l’authentification se valide ou ne message d’erreur s’affiche.
19 Chapitre II : Conception
3.4. Diagramme de séquence pour l’inscription dans un trajet
Figure n ° 17 : Diagramme de séquence pour l’inscription dans un trajet
20 Chapitre II : Conception
le client demande la, page de trajet, la page s’affiche, puis, Le client demande le formulaire d’inscription, Le formulaire s’affiche, Le client rempli le formulaire et confirmer son réservation. 4. Diagramme de séquence espace admin
4.1. Gestion des comptes des utilisateurs
a. ajouter un utilisateur
Figure n °18 : ajouter un utilisateur
l’administrateur entre son nom et son mot de passe alors l’espace d’administration s’affiche, l’administrateur tape le bouton ajouter utilisateur, la page d’ajout s’affiche, puis il remplit le formulaire par les informations ces derniers sont ajouter dans la base de donnée.
b. modifier compte utilisateur
Figure n ° 19 : modifier compte utilisateur
21 Chapitre II : Conception
c. supprimer compte utilisateur
Figure n ° 20 : supprimer compte utilisateur
L’administrateur entre son nom et son mot passe alors la liste des utilisateurs s’affiche, ensuite il taper le bouton supprimer ,l’utilisateur est supprimer dans la base de donné.
B. gestion des trajets
a. Ajouter un trajet
Figure n °21 : Ajouter un trajet
22 Chapitre II : Conception
l’administrateur entre son nom et son mot de passe alors l’espace d’administration s’affiche, l’administrateur tape le bouton ajouter trajet, la page d’ajout s’affiche, puis il remplit le formulaire par les informations ces derniers sont ajouter dans la base de donnée.
b. supprimer un trajet
Figure n ° 22 : supprimer un trajet
L’administrateur entre son nom et son mot passe alors la liste des trajets s’affiche, ensuite il taper le bouton supprimer ,le trajet est supprimer dans la base de donné.
c. modifier un trajet
Figure n ° 23: modifier un trajet
23 Chapitre II : Conception
5. Digramme de classe de notre site web
Nous avons faire Le diagramme de classes pour montrer la structure interne de notre site web. Il permet de fournir une représentation abstraite des objets du système.
Figure n ° 24: Digramme de classe de notre site web
24 Chapitre II : Conception
5.1. Maquettes de notre site web
Pour réaliser la maquette de notre site web nous utilisons l’outil balsamiq, c’est une Application web permet de faire les maquettes des pages web.
5.2. Page d’accueil non connecté
ALGCAR Proposer Connecter
Chercher
Figure n °25 : Page d’accueil non connecté
25 Chapitre II : Conception
5.4. Page des résultats de recherche de Trajet
Proposer Connexion
Chercher
Prix
Prix
Figure n ° 26 : Page des résultats de recherche de Trajet
5.5. Page ajouté crédit
Figure27 : page ajouté crédit
26 Chapitre II : Conception
5.6. Page de création de trajet
Figure n °28 : Page de création de trajet
5.7. Page d’un trajet
Figure n °29 : Page d’un trajet
27 Chapitre II : Conception
5.8. Page de profile
Figure n ° 30 : Page de profile
5.9. Page signalé conducteur
Figure31 : page signalé conducteur
28 Chapitre II : Conception
5.10 page d’accueil parie admin
Figure32 : page d'accueil partie admin
5.11 Page gestion des tables de la partie admin
Figure33 : gestion des tables partie admin
Conclusion Dans ce chapitre nous avons faire l’étude conceptuelle de notre site web en utilisant UML pour clarifier la structure du site et les différents interactions entre l’utilisateur et notre site web, Dans le chapitre suivant nous allons faire la partie implémentation de notre site web, en basant sur la conception fait dans ce chapitre.
