Quiz Interactif Solanja Voyages

Description

Quiz interactif "Quel type de voyageur êtes-vous ?" développé pour Solanja Voyages. Ce quiz permet aux utilisateurs de découvrir leur profil de voyageur parmi 5 types différents et d'obtenir des recommandations personnalisées.

Fonctionnalités

✅ Fonctionnalités Implémentées

1. Structure du Quiz

   • 15 questions à choix multiples
   • 5 profils de voyageurs : Aventurier, Épicurien, Slow Traveler, Culturel, Luxe
   • Système de points pour chaque réponse

2. Interface Utilisateur

   • Design responsive respectant la charte graphique Solanja
   • Barre de progression
   • Navigation entre les questions
   • Animations et transitions fluides

3. Calcul des Résultats

   • Algorithme de scoring dynamique
   • Identification du profil dominant
   • Affichage des résultats personnalisés

4. Fonctionnalités Avancées

   • Modal pour capture d'email
   • Partage WhatsApp
   • Impression PDF des résultats
   • Recommandations de destinations

Structure des Fichiers

quiz/
├── quiz.html          # Page principale du quiz
├── quiz.js            # Logique JavaScript
├── quiz.css           # Styles spécifiques
├── quiz-data.json     # Questions et profils
├── img/               # Images des profils
│   ├── profil-aventurier.webp
│   ├── profil-epicurien.webp
│   ├── profil-slow-traveler.webp
│   ├── profil-culturel.webp
│   └── profil-luxe.webp
└── README.md          # Documentation

Profils de Voyageurs

1. L'Aventurier

• Caractéristiques : Recherche l'adrénaline et les défis
• Destinations : Islande, Patagonie, Namibie, Népal, Nouvelle-Zélande

2. L'Épicurien

• Caractéristiques : Voyage par la gastronomie
• Destinations : Toscane, Provence, Pérou, Japon, Liban

3. Le Slow Traveler

• Caractéristiques : Privilégie l'immersion et la lenteur
• Destinations : Japon rural, Portugal, Grèce, Bali, Costa Rica

4. Le Culturel

• Caractéristiques : Passionné d'histoire et de culture
• Destinations : Égypte, Grèce, Italie, Inde, Mexique

5. Le Voyageur Luxe

• Caractéristiques : Recherche l'excellence et le raffinement
• Destinations : Maldives, Seychelles, Dubaï, Singapour, Polynésie

Utilisation

1. Démarrage : Cliquer sur "Commencer le quiz"
2. Questions : Répondre aux 15 questions en sélectionnant une option
3. Navigation : Utiliser les boutons Précédent/Suivant
4. Résultats : Découvrir son profil et les recommandations
5. Actions : Recevoir le guide par email, partager ou imprimer

Intégration

Dans un site existant

<!-- Inclure les fichiers CSS et JS -->
<link rel="stylesheet" href="quiz.css">
<script src="quiz.js"></script>

<!-- Conteneur pour le quiz -->
<div id="quiz-container"></div>

Personnalisation

• Modifier quiz-data.json pour changer les questions/profils
• Adapter quiz.css pour le design
• Configurer l'envoi d'emails dans quiz.js

Technologies Utilisées

• HTML5 : Structure sémantique
• CSS3 : Styles et animations (Tailwind CSS)
• JavaScript ES6 : Logique interactive
• JSON : Stockage des données
• Font Awesome : Icônes
• Google Fonts : Typographie (Playfair Display, Montserrat)

Optimisations SEO

• Meta tags optimisés
• Structure HTML sémantique
• Images avec attributs alt
• Chargement optimisé des ressources

Compatibilité

• ✅ Desktop (Chrome, Firefox, Safari, Edge)
• ✅ Mobile (iOS Safari, Chrome Mobile)
• ✅ Tablette (iPad, Android)

Améliorations Futures

1. Intégration Backend

   • Sauvegarde des résultats en base de données
   • Envoi d'emails automatisé
   • Analytics des réponses

2. Fonctionnalités Avancées

   • Quiz adaptatif selon les réponses
   • Recommandations d'itinéraires détaillées
   • Intégration avec le système de réservation

3. Optimisations

   • Lazy loading des images
   • Service Worker pour le cache
   • Optimisation des performances

Support

Pour toute question ou modification, contacter l'équipe de développement Solanja Voyages.

Développé avec ❤️ pour Solanja Voyages