Domaine : Production numérique

2023-2024
Durée 8h Mini-Projet

Classe 3ème SI Matière STI Mme Ichrak M’Barek

Contexte :
Papa John’s Pizza est un restaurant basé à Géant Tunis City.
Il propose des petits plats à emporter (salades, pizzas, boissons). Suite à la longue période de
confinement qui a eu pour conséquence la réduction de sa clientèle, le restaurant décide de
vous contacter pour réaliser un site sur lequel il sera possible de voir les différentes formules
et boissons.
Préparatifs :
1) Créer l’arborescence adéquate pour votre site
2) Utiliser le pack de ressources images fourni par votre professeur
Niveau 1. Base
 Ajouter le titre ″Papa John’s Pizza″ sous la forme d’une balise h1.
 Ajouter le slogan ″BETTER INGREDIANTS. BETTER PIZZA″ sous la forme de
paragraphe.
 Ajouter un menu de navigation contenant 3 boutons Pizza, Salade, Boisson.
 Créer un fichier ″styles.css″ dans un dossier ″css″
 Mettre le fond de la page en bleu (code couleur #1695DA)
 Centrer le titre et le Mettre dans un carré blanc
 Changer la police d’écriture en ″Kenia″
Niveau 2. Slider
 Créer un Slider d’images avec un temps d’animation de 25 secondes.
 Vidéo d’aide : https://www.youtube.com/watch?v=ZsuTciVL8PU
 Nom des images à faire défiler : 1.jpg, 2.jpg, 3.jpg, 4.jpg

Page 1 sur 5
 Domaine : Production numérique
2023-2024
Durée 8h Mini-Projet

Classe 3ème SI Matière STI Mme Ichrak M’Barek

Niveau 3. Menu
 Utiliser les ″flexbox″ pour ajuster les boutons sous la forme d’une ligne
 Ajouter une image derrière chaque bouton
 Mettre en blanc la couleur du texte de chaque bouton
 Faire une animation de scroll vers la bonne section lors d’un clique (no js)

Niveau 4. Sections
 Créer une section « pizza », contenant l’arrière-plan ″5.jpg″
 Créer un premier produit contenant :
 Le titre ″Pepperoni″
 Une description ″Succulentes tranches de pepperoni et du fromage fondant.″
 Un prix ″30 Dt″
 L’image ″8.jpg″
 Créer un second produit contenant :
 Le titre ″Cheese″
 Une description ″Le mélange parfait de fromage fondant et de la fameuse
Pizza sauce de Papa John's.″
 Un prix ″27 Dt″
 L’image ″9.jpg″

Page 2 sur 5
 Domaine : Production numérique
2023-2024
Durée 8h Mini-Projet

Classe 3ème SI Matière STI Mme Ichrak M’Barek

 Créer un troisième produit contenant :

 Le titre ″John’s favorite″
 Une description ″Pour la fameuse Pizza de John, nous avons sélectionné
notre mélange spécial de six fromages italiens, des tranches de pepperoni et
des saucisses italiennes.″
 Un prix ″36 Dt″
 L’image ″10.jpg″

 Reproduire la même chose pour la section ″Salade″ et ″Boisson″

Page 3 sur 5
 Domaine : Production numérique
2023-2024
Durée 8h Mini-Projet

Classe 3ème SI Matière STI Mme Ichrak M’Barek

Page 4 sur 5
 Domaine : Production numérique
2023-2024
Durée 8h Mini-Projet

Classe 3ème SI Matière STI Mme Ichrak M’Barek

Niveau 5. Bonus
 Ajouter un pied de page contenant
 La mention Copyright sous la forme d’un paragraphe
 Une ″iframe″ affichant la position sur google maps de Papa John’s Pizza, Géant
Tunis City

Page 5 sur 5