Cahier des Charges Site Web Maroc

Cahier des Charges Site Web Maroc

Modèle complet (CPS) pour appel d'offre et consultation - Adapté secteur public, banque, e-commerce

Vous préparez un appel d'offre pour un site web ou une consultation pour une plateforme digitale au Maroc ? Ce modèle de cahier des charges (CPS) vous guide pour rédiger un document complet et structuré, adapté aux exigences du secteur public, bancaire, e-commerce ou institutionnel.

✅ Ce template couvre :

  • ✓ Spécifications techniques détaillées
  • ✓ Exigences sécurité (OWASP, CNDP)
  • ✓ Architecture (Drupal, Next.js, headless)
  • ✓ Performance et accessibilité (WCAG)
  • ✓ Hébergement souverain Maroc
  • ✓ Budget et critères d'évaluation
  • ✓ Phasage Agile et livrables
  • ✓ Conformité Bank Al-Maghrib, ACAPS

💡 Secteur public : Ce template est parfaitement adapté aux appels d'offre publiés sur marchespublics.gov.ma (Portail des Marchés Publics du Maroc), garantissant la conformité aux exigences des cahiers des charges publics.

Fort de 200+ projets digitaux au Maroc, VOID partage sa méthodologie éprouvée pour structurer vos consultations et obtenir des offres techniques qualitatives de la part des agences candidates.

🎯 Personnalisez votre cahier des charges

✓ Contenu adapté en temps réel Les sections ci-dessous s'ajusteront automatiquement selon vos choix

Configuration actuelle :

🏢 Institutionnel📌 Autre🌍 1 langue

1. Contexte et Objectifs du Projet

💡 Conseil VOID

Un contexte clair permet aux prestataires de comprendre vos enjeux métier et de proposer des solutions adaptées. Soyez transparent sur vos contraintes et ambitions.

1.1. Présentation de l'organisation

Template :

[NOM DE L'ORGANISATION] est [SECTEUR/ACTIVITÉ]. Créée en [ANNÉE], elle compte [X] collaborateurs et [PRÉSENCE GÉOGRAPHIQUE].

Mission : [MISSION PRINCIPALE]

Valeurs : [VALEURS CLÉS]

1.2. Objectifs du projet web

  • Moderniser l'image de marque : Refléter les valeurs et la maturité digitale de l'organisation
  • Améliorer l'expérience utilisateur : Navigation intuitive, parcours simplifiés, accessibilité
  • Optimiser le référencement SEO : Visibilité accrue sur les moteurs de recherche
  • Faciliter la gestion des contenus : Autonomie des équipes internes
  • Garantir la sécurité : Protection des données, conformité réglementaire

1.3. Cibles et personas

🎯 Cible primaire

Clients / Bénéficiaires finaux

🎯 Cible secondaire

Partenaires / Investisseurs

🎯 Cible tertiaire

Presse / Médias

🎯 Cible interne

Collaborateurs / RH

2. Architecture et Technologie

✅ Recommandation VOID

Privilégiez une architecture headless (Drupal + Next.js) pour les projets institutionnels exigeants. Elle garantit performance, sécurité, et évolutivité sur 5-10 ans.

📖 En savoir plus : Expertise Drupal VOID · Expertise React/Next.js

2.1. Stack technique recommandée

ComposantTechnologieJustification
CMS / Back-officeDrupal 10+Robustesse, sécurité enterprise, multilingue natif
FrontendNext.js 15 (React)SSR/SSG, performance, SEO optimal
Base de donnéesMySQL 8+Fiabilité, conformité bancaire, performances
APIJSON:API / GraphQLAPI-First, interopérabilité
HébergementDocker + VDC Maroc (inwi/nplusone)Souveraineté des données, conformité CNDP

2.2. Exigences techniques obligatoires

  • ✅ Architecture API-First avec séparation front/back
  • ✅ Rendu côté serveur (SSR) pour le SEO
  • ✅ Respect des standards W3C
  • ✅ Conformité WCAG 2.1 niveau AA (accessibilité)
  • ✅ Code versionné sur Git avec branches (dev, staging, prod)
  • Conteneurisation Docker pour la portabilité
  • ✅ Environnements séparés (Dev, Recette, Préproduction, Production)

2.3. Certification et expertise

Exigence : Le prestataire devra démontrer une expertise confirmée sur Drupal, idéalement avec certification Acquia ou contributions à la communauté Drupal.

📖 Découvrez : Services Drupal au Maroc · Solution Vactory (Drupal + Next.js)

3. Exigences Fonctionnelles

3.1. Multilinguisme

Exigences multilingues :

  • ✅ Support de [FR / AR / EN] selon contexte
  • ✅ Interface d'administration multilingue
  • ✅ Gestion des contenus par langue (traduction / création)
  • ✅ Détection automatique de la langue (géolocalisation + navigateur)
  • ✅ URLs adaptées : /fr/, /ar/, /en/
  • ✅ RTL (Right-to-Left) pour l'arabe avec ajustements CSS
  • ✅ Balises hreflang correctes pour le SEO international

3.2. Navigation et ergonomie

🧭 Navigation principale

  • • Menu principal avec sous-menus (max 2 niveaux)
  • • Mega menu pour arborescences complexes
  • • Menu mobile (hamburger) responsive
  • • Fil d'Ariane (breadcrumbs) sur toutes les pages
  • • Bouton "Accueil" permanent

🔍 Recherche

  • • Moteur de recherche intelligent
  • • Auto-complétion en temps réel
  • • Recherche multilangue
  • • Filtres par type de contenu
  • • Suggestions de recherches connexes

3.3. Formulaires

FormulaireChampsSécurité
ContactNom, Email, Téléphone, Sujet, MessageCaptcha, validation côté serveur
NewsletterEmail, Consentement RGPDDouble opt-in, désabonnement
RéclamationFormulaire spécifique + pièces jointesUpload sécurisé, validation type fichier
RecrutementCV, Lettre motivation, InformationsScan antivirus, limite 5MB

⚠️ Exigence critique

Tous les formulaires doivent inclure un captcha invisible (reCAPTCHA v3 ou hCaptcha), une validation côté serveur stricte, et le respect du consentement RGPD/loi 09-08.

📖 Approfondir : RGPD et conformité au Maroc

4. Design et Expérience Utilisateur

4.1. Proposition graphique

Le prestataire devra proposer au minimum 2 pistes graphiques, incluant :

  • Homepage : Version complète desktop + mobile
  • Page type : Page de contenu standard
  • Déclinaisons : 3 langues (FR, AR, EN)
  • Format : Maquettes interactives (Figma / Adobe XD)

4.2. Design System

Un Design System complet devra être livré, comprenant :📖 Lire aussi : UX Design & Design Systems

🎨 Fondations

  • • Palette couleurs
  • • Typographie
  • • Grille & espacements
  • • Iconographie

🧩 Composants

  • • Boutons & liens
  • • Formulaires
  • • Cards & blocs
  • • Navigation

📱 Responsive

  • • Breakpoints définis
  • • Comportements mobiles
  • • Touch-friendly
  • • Tests multi-devices

4.3. Responsive Design

Le site devra être 100% responsive et optimisé pour :

  • Desktop : 1920px, 1366px, 1024px
  • Tablette : 768px (iPad portrait/paysage)
  • Mobile : 375px, 414px (iPhone, Android)
  • ✅ Tests sur BrowserStack ou équivalent

5. Sécurité du Système d'Information

🔒 Priorité absolue

La sécurité doit être intégrée dès la conception (Security by Design). Toutes les vulnérabilités OWASP Top 10 doivent être prévenues.

📖 Guide complet : Sécurité Web, XSS & OWASP 2026

5.1. Authentification et accès

  • Comptes individualisés : Interdiction des comptes génériques (admin, root)
  • Mots de passe robustes : Minimum 12 caractères, complexité forcée, expiration 90 jours
  • Double authentification (2FA) : Obligatoire pour accès back-office (Google Authenticator, SMS)
  • Principe du moindre privilège : Rôles et permissions granulaires
  • Session management : Timeout 15min inactivité, invalidation déconnexion

5.2. Protection des données

Exigences obligatoires :

  • 🔐 HTTPS/TLS 1.3 obligatoire sur tout le site (certificat SSL/EV)
  • 🔐 HSTS (HTTP Strict Transport Security) activé
  • 🔐 Hashage bcrypt pour tous les mots de passe (coût minimum 12)
  • 🔐 Chiffrement at-rest pour données sensibles en base
  • 🔐 Aucune donnée sensible dans les logs ou URL
  • 🔐 CSP (Content Security Policy) strict
  • 🔐 Cookies sécurisés : HttpOnly, Secure, SameSite=Strict

5.3. OWASP Top 10 - Prévention

VulnérabilitéContre-mesure
Injection SQLORM (Eloquent/Doctrine), requêtes préparées, validation stricte
XSS (Cross-Site Scripting)Échappement automatique (React), CSP headers, validation input
CSRF (Cross-Site Request Forgery)Tokens CSRF sur tous les formulaires, SameSite cookies
Authentification cassée2FA, rate limiting connexions, blocage après 5 tentatives
Exposition de données sensiblesChiffrement TLS, pas de données en clair, masquage logs
XXE (XML External Entity)Désactivation entités externes XML, validation schemas
Broken Access ControlValidation autorisation côté serveur, principe moindre privilège
Security MisconfigurationHardening serveur, désactivation debug en prod, headers sécurité
Composants vulnérablesDependency scanning (Snyk), mises à jour régulières
Logging insuffisantLogs complets, horodatés, sécurisés, alertes automatiques

5.4. Infrastructure sécurisée

  • 🛡️ WAF (Web Application Firewall) : Cloudflare, AWS WAF ou équivalent
  • 🛡️ Protection Anti-DDoS : Rate limiting, IP blocking
  • 🛡️ Cloisonnement réseau : DMZ public, réseau privé backend, BDD isolée
  • 🛡️ Accès back-office : VPN + IP whitelisting + 2FA
  • 🛡️ Séparation environnements : Dev / Recette / Preprod / Prod isolés
  • 🛡️ Patching régulier : Mises à jour sécurité sous 48h

5.5. Conformité réglementaire

🇲🇦 Loi 09-08 (CNDP)

  • • Déclaration CNDP si données personnelles
  • • Consentement explicite utilisateurs
  • • Droit d'accès, rectification, suppression
  • • Limitation durée conservation
  • • Notification faille sous 72h

🇪🇺 RGPD (si applicable)

  • • Privacy by Design & Default
  • • Registre des traitements
  • • DPIA si risque élevé
  • • Portabilité des données
  • • DPO si nécessaire

5.6. Audit de sécurité

Exigence obligatoire : Le prestataire devra fournir un rapport d'audit de sécurité complet avant mise en production, incluant :

  • • Scan automatisé (Acunetix, Netsparker, OWASP ZAP)
  • • Test d'intrusion manuel (Burp Suite)
  • • Revue de code (analyse statique)
  • • Test de charge et résilience
  • • Rapport avec plan de remédiation des vulnérabilités

📖 Méthodologie : Audit SEO Technique · Tests de sécurité

6. Performance et Accessibilité

6.1. Objectifs de performance (Core Web Vitals)

📖 Approfondir : Guide Core Web Vitals & Lighthouse · Optimisation Performance Web

MétriqueCibleDéfinition
LCP (Largest Contentful Paint)< 2.5sTemps de chargement du plus gros élément visible
FID (First Input Delay)< 100msTemps de réponse à la première interaction
CLS (Cumulative Layout Shift)< 0.1Stabilité visuelle du chargement
TTFB (Time to First Byte)< 600msTemps de réponse serveur initial
Score Lighthouse> 90/100Score global performance Google

6.2. Optimisations techniques obligatoires

⚡ Frontend

  • • Code splitting automatique (Next.js)
  • • Lazy loading images et composants
  • • Optimisation images (WebP, AVIF, responsive)
  • • Minification CSS/JS
  • • Tree shaking (suppression code mort)
  • • Preload ressources critiques
  • • Service Worker (offline-first)

⚡ Backend

  • • Cache Redis/Memcached
  • • CDN global (Cloudflare, Fastly)
  • • Compression Gzip/Brotli
  • • HTTP/2 ou HTTP/3
  • • Database query optimization
  • • Cache Drupal (BigPipe, Dynamic Page Cache)
  • • API rate limiting

6.3. Accessibilité (WCAG 2.1 AA)

♿ Conformité obligatoire

Le site devra respecter les critères WCAG 2.1 niveau AA, avec audit RGAA si secteur public.

📖 Ressource : Accessibilité Web au Maroc

  • ✅ Contrastes couleurs conformes (ratio 4.5:1 minimum)
  • ✅ Navigation au clavier complète (Tab, Shift+Tab, Enter, Esc)
  • ✅ Attributs ARIA correctement implémentés
  • ✅ Alternatives textuelles pour images (alt)
  • ✅ Structure sémantique HTML5 (h1-h6, nav, main, footer...)
  • ✅ Formulaires accessibles (labels, erreurs explicites)
  • ✅ Compatibilité lecteurs d'écran (NVDA, JAWS)
  • ✅ Zoom texte jusqu'à 200% sans perte de fonctionnalité

6.4. Compatibilité navigateurs et devices

🖥️ Desktop

  • • Chrome (2 dernières versions)
  • • Firefox (2 dernières versions)
  • • Safari (2 dernières versions)
  • • Edge (2 dernières versions)

📱 Mobile

  • • iOS Safari (2 dernières versions)
  • • Android Chrome (2 dernières versions)
  • • Samsung Internet

💻 OS

  • • Windows 10/11
  • • macOS (3 dernières versions)
  • • iOS 15+
  • • Android 11+

7. SEO et Analytics

7.1. Fondamentaux SEO

📖 Approfondir : Services SEO au Maroc · Audit SEO Technique

  • URLs SEO-friendly : Structure claire, mots-clés, pas de paramètres inutiles✅ /services/credit-entreprise/❌ /node/123?lang=fr
  • Balises meta optimisées : Title (50-60 car), Description (150-160 car), uniques par page
  • Structure Hn cohérente : Un seul H1, hiérarchie H2-H6 respectée
  • Sitemap XML : Automatique, multilingue, soumis Google Search Console
  • Robots.txt : Optimisé, crawl budget géré
  • Schema.org : Organization, Article, BreadcrumbList, FAQPage
  • Redirections 301 : Migration ancien site sans perte SEO
  • Hreflang : Balises correctes pour multilingue international

7.2. Google Analytics 4

Implémentation complète GA4 avec :

  • • Tracking pages vues, événements personnalisés
  • • Suivi conversions (formulaires, téléchargements, clics CTA)
  • • Respect consentement cookies (RGPD/loi 09-08)
  • • Anonymisation IP activée
  • • Filtrage trafic interne (IP bureau)
  • • Intégration Google Search Console

7.3. Plan de taggage et tableau de bord

Le prestataire devra livrer :

  • 📊 Plan de taggage : Document exhaustif des événements trackés
  • 📊 Tableau de bord Looker Studio : KPIs temps réel (trafic, conversions, parcours)
  • 📊 Rapports mensuels automatisés : PDF ou Google Sheets
  • 📊 Alertes automatiques : Baisse trafic, erreurs 404, temps chargement

✅ Livrable VOID

VOID fournit systématiquement un tableau de bord Looker Studio personnalisé, avec suivi en temps réel des KPIs métier et alertes automatiques.

📖 En savoir plus : Plan de taggage Google Analytics · Google Tag Manager

8. Intelligence Artificielle et Automatisation

🤖 L'IA au service de l'expérience utilisateur

L'intégration d'intelligence artificielle dans votre plateforme n'est plus un "nice-to-have" mais un différenciateur stratégique. En 2026, les utilisateurs s'attendent à des expériences personnalisées, instantanées et intelligentes.

📖 Approfondir : Expertise IA VOID · Agentic AI pour les plateformes

8.1. Chatbot intelligent et support conversationnel

Fonctionnalités essentielles :

🎯 Niveau 1 : Chatbot FAQ
  • • Réponses pré-configurées (arbre de décision)
  • • Support multilingue (FR/AR/EN)
  • • Intégration base de connaissance
  • • Disponibilité 24/7
  • • Escalade vers humain si nécessaire
🚀 Niveau 2 : Chatbot IA Avancé
  • • NLP (Natural Language Processing)
  • • Compréhension intentionnelle
  • • Apprentissage continu (Machine Learning)
  • • Personnalisation selon profil utilisateur
  • • Intégration CRM/ticketing

Stack technique recommandée :

SolutionTypeAvantagesUse Case
OpenAI GPT-4LLM CloudCompréhension avancée, multilingueChatbot conversationnel sophistiqué
Dialogflow (Google)Plateforme NLPIntégration facile, intent recognitionChatbot orienté tâches (FAQ, RDV)
Rasa (Open Source)Framework On-premiseSouveraineté données, customisationSecteur bancaire/santé (CNDP strict)
Claude (Anthropic)LLM CloudContexte long, sécurité renforcéeSupport technique documenté

⚠️ Points de vigilance chatbot

  • Hallucinations : LLM peut inventer des informations → Implémenter RAG (Retrieval-Augmented Generation)
  • Coût : OpenAI GPT-4 facture au token → Budget mensuel estimé + rate limiting
  • Conformité CNDP : Données conversationnelles = données personnelles → Consentement + durée conservation
  • Escalade humaine : Définir seuils déclenchant transfert vers agent humain

8.2. AEO (Answer Engine Optimization)

En 2026, 60% des recherches sont répondues directement par des AI Agents (ChatGPT, Perplexity, Gemini) sans clic vers un site. L'AEO optimise votre contenu pour être cité par ces agents.

📖 Guide complet : AEO : Optimiser pour les moteurs de réponse

Exigences techniques AEO :

  • Structured Data enrichi : Schema.org (FAQPage, HowTo, Article) pour faciliter la compréhension par IA
  • Réponses directes concises : Featured Snippets optimisés (paragraphes 40-60 mots)
  • Citations vérifiables : Sources, dates, données chiffrées → crédibilité pour LLM
  • LLM.txt / AI.txt : Fichiers spécifiques pour crawler IA (instructions pour agents)
  • Liens contextuels : Maillage interne fort → IA comprend architecture info

📄 Exemple : Fichier /ai.txt

# Instructions pour AI Agents (ChatGPT, Claude, Gemini, Perplexity)

## Identité
Organisation: [NOM ORGANISATION]
Secteur: [SECTEUR]
Mission: [MISSION]

## Contenu prioritaire pour citations
- Services: /services/
- FAQ: /faq/
- Publications: /publications/

## Informations vérifiées
- Contact: casa@example.ma / +212 XXX
- Certifications: ISO 27001, Acquia
- Références clients: [LISTE]

## Restrictions
- Ne pas citer de données financières obsolètes
- Ne pas inventer de services non mentionnés sur le site

📖 Voir exemple réel : void.ma/ai.txt

8.3. Orchestration intelligente des demandes

L'orchestration par IA route automatiquement les demandes utilisateurs (formulaires, réclamations, tickets) vers le bon service/personne, optimisant les délais de traitement.

🎯 Classification automatique

L'IA analyse le contenu de la demande et la catégorise automatiquement.

  • Réclamation → Service client prioritaire
  • Demande info → Chatbot ou FAQ
  • Demande commerciale → Équipe ventes
  • Support technique → Équipe support
  • RH/Recrutement → Service talents

⚡ Priorisation dynamique

L'IA évalue l'urgence et le sentiment (positif/négatif) pour prioriser.

  • Sentiment négatif + mots-clés urgents → P1 (2h)
  • Client VIP détecté → P1 (1h)
  • Demande standard → P2 (24h)
  • Information générale → P3 (48h)

Architecture d'orchestration :

Formulaire soumis
    ↓
[API Gateway]
    ↓
[IA Classification] ← Modèle NLP (BERT, GPT-4)
    ↓
Analyse : Type + Urgence + Sentiment
    ↓
[Règles métier] + [ML Prediction]
    ↓
Routage intelligent vers :
├─ CRM (HubSpot, Salesforce)
├─ Ticketing (Zendesk, Freshdesk)
├─ Email équipe concernée
└─ SMS si urgence P1

8.4. Recommandations personnalisées

🎁 Cas d'usage :

  • E-commerce : "Les clients qui ont consulté ce produit ont aussi aimé..."
  • Média/Publication : Articles recommandés selon historique lecture
  • Finance : Produits bancaires adaptés au profil client (scoring IA)
  • RH : Offres d'emploi matchées avec profil candidat (CV parsing + IA)

8.5. Génération de contenu assistée par IA

  • Rédaction automatique de meta descriptions : LLM génère descriptions SEO optimisées
  • Traduction multilingue : DeepL API ou GPT-4 pour traduire contenus (FR→AR→EN)
  • Résumés automatiques : Articles longs → résumés courts pour mobile/réseaux sociaux
  • Alt text images : Vision AI génère descriptions accessibles pour images
  • Suggestions de tags/catégories : Clustering automatique de contenu

8.6. Analyse comportementale et optimisation

📊 Analytics et optimisation UX

  • Détection anomalies : Alertes trafic inhabituel, erreurs 404
  • Optimisation UX : Heatmaps + IA suggèrent améliorations interface
  • A/B Testing intelligent : IA identifie variantes performantes
  • Analyse parcours utilisateur : Détection points de friction
  • Prédiction pics de trafic : Anticiper montée en charge

8.7. Considérations éthiques et gouvernance IA

🛡️ Gouvernance obligatoire

L'utilisation d'IA sur une plateforme publique implique des responsabilités légales et éthiques.

  • Transparence : Indiquer clairement quand l'utilisateur interagit avec une IA
  • Explicabilité : Pouvoir expliquer les décisions automatisées (scoring, refus...)
  • Biais algorithmiques : Tests réguliers pour détecter discriminations
  • Droit d'opposition : Utilisateur peut refuser décision 100% automatisée (RGPD Art. 22)
  • Audit régulier : Vérification performances + éthique (trimestriel minimum)

✅ Recommandation VOID

Approche progressive : Démarrer avec chatbot FAQ + AEO (quick wins), puis itérer vers fonctionnalités avancées (orchestration, ML) selon ROI observé.

📖 Cas d'usage : RAG & CAG pour IA en production

9. Hébergement et Infrastructure

🇲🇦 Recommandation VOID : Hébergement souverain

Privilégiez un hébergement au Maroc pour garantir la souveraineté des données, la conformité CNDP, et des performances optimales pour vos utilisateurs locaux.

8.1. Providers recommandés au Maroc

🇲🇦 inwi Cloud

  • VDC (Virtual Data Center) dédié
  • • Datacenter Casablanca (Technopark)
  • • Certification ISO 27001
  • • Support technique 24/7 en français
  • • Conformité CNDP native
  • • Connectivité fibre dédiée

🇲🇦 nplusone

  • • Cloud privé souverain
  • • Datacenter tier III+ Casablanca
  • • Infra hautement sécurisée (bancaire)
  • • Redondance multi-sites
  • • Backup automatisé quotidien
  • • SLA 99.9%

8.2. Architecture d'hébergement

Infrastructure type (VDC) :

  • 🖥️ Serveurs web : 2+ instances load-balancées (HAProxy/Nginx)
  • 🗄️ Base de données : MySQL 8+ en master-slave réplication
  • Cache : Redis cluster pour sessions et cache applicatif
  • 📦 Stockage : NFS ou S3-compatible pour médias partagés
  • 🔒 Firewall : WAF + règles pare-feu granulaires
  • 📊 Monitoring : Prometheus + Grafana ou New Relic
  • 💾 Backup : Quotidien automatisé, rétention 30 jours minimum

8.3. Conteneurisation Docker

L'application devra être entièrement dockerisée avec :

  • 🐳 Docker Compose pour orchestration locale
  • 🐳 Kubernetes pour production (optionnel selon volumétrie)
  • 🐳 Images optimisées : Alpine Linux, multi-stage builds
  • 🐳 Registry privé : Harbor, AWS ECR ou équivalent
  • 🐳 CI/CD : GitLab CI, GitHub Actions ou Jenkins

8.4. Environnements et déploiement

EnvironnementUsageAccèsDonnées
DéveloppementDev quotidien, tests unitairesÉquipe techniqueDonnées test/anonymisées
RecetteValidation fonctionnelle clientClient + prestataireDonnées test réalistes
PréproductionTests charge, validation finaleÉquipe projetCopie données prod (anonymisées)
ProductionSite live publicAdmin restreint (2FA + VPN)Données réelles

8.5. SLA et disponibilité

  • 📈 Disponibilité : Minimum 99.9% (8.76h downtime/an max)
  • 📈 RPO (Recovery Point Objective) : < 1h (perte données acceptable)
  • 📈 RTO (Recovery Time Objective) : < 4h (temps restauration)
  • 📈 Support : 24/7 pour incidents critiques (P1)
  • 📈 Backup : Quotidien + test restauration trimestriel

10. Phasage et Livrables

1

Cadrage & Lancement

Durée estimée : 2-3 semaines

🎯 Objectifs :

  • • Compréhension approfondie du besoin
  • • Validation périmètre et planning
  • • Définition orientations graphiques

📋 Livrables :

  • ✅ Note de cadrage
  • ✅ Planning détaillé (Gantt)
  • ✅ Maquettes homepage + page type (2 pistes minimum)
  • ✅ Design System v1
  • ✅ Architecture technique cible
2

Conception & Développement

Durée estimée : 8-12 semaines

🎯 Objectifs :

  • • Conception UX/UI complète
  • • Développement backend (Drupal) + frontend (Next.js)
  • • Intégration contenus multilingues
  • • Configuration hébergement

📋 Livrables :

  • ✅ Maquettes complètes (toutes pages, 3 langues)
  • ✅ Design System finalisé
  • ✅ Spécifications fonctionnelles détaillées
  • ✅ Documentation technique
  • ✅ Site en environnement de recette
  • ✅ Contenus intégrés (FR/AR/EN)
3

Tests & Recette

Durée estimée : 3-4 semaines

🎯 Objectifs :

  • • Tests fonctionnels exhaustifs
  • • Audit sécurité (pentest)
  • • Tests de performance et charge
  • • Validation accessibilité WCAG
  • • Corrections anomalies

📋 Livrables :

  • ✅ Cahier de recette avec résultats
  • ✅ Rapport audit sécurité (pentest)
  • ✅ Rapport tests performance (Lighthouse, GTmetrix)
  • ✅ Rapport accessibilité WCAG
  • ✅ Liste anomalies corrigées
  • ✅ PV de recette signé
4

Formation & Mise en Production

Durée estimée : 2 semaines

🎯 Objectifs :

  • • Formation équipes (admin fonctionnel + technique)
  • • Déploiement production sécurisé
  • • Migration DNS
  • • Vérifications post-déploiement
  • • Transfert compétences

📋 Livrables :

  • ✅ Site en production opérationnel (FR/AR/EN)
  • ✅ Formation réalisée (présentiel + vidéos)
  • ✅ Guide administrateur
  • ✅ Guide d'exploitation technique
  • ✅ Documentation complète (code, architecture, API)
  • ✅ Fichiers sources (Git repository)
  • ✅ Accès et credentials sécurisés
  • ✅ Garantie 12 mois activée

💡 Méthodologie Agile

VOID privilégie une approche Agile (Scrum) avec sprints de 2 semaines, démos régulières au client, et ajustements itératifs pour maximiser la valeur livrée.

📖 Approfondir : Méthodologie Agile au Maroc · Squad Agile VOID

11. Critères d'Évaluation des Offres

CritèrePondérationDétails
Prix30%Compétitivité, clarté décomposition, conditions paiement
Expertise technique25%Maîtrise Drupal+Next.js, certifications, références similaires
Proposition créative15%Qualité maquettes, UX, innovation, adaptation identité
Méthodologie & planning15%Réalisme planning, approche Agile, gouvernance projet
Garanties & maintenance10%Durée garantie, SLA, support post-livraison
Compréhension du besoin5%Pertinence proposition, questions posées, valeur ajoutée

Documents à fournir dans l'offre

  • 📄 Présentation entreprise (fiche société, équipe, moyens)
  • 📄 Références projets similaires (minimum 3, avec contacts vérifiables)
  • 📄 Certifications (Acquia, ISO, etc.)
  • 📄 CV détaillés de l'équipe dédiée
  • 📄 Mémoire technique (réponse point par point au CPS)
  • 📄 Proposition commerciale détaillée (décomposition prix)
  • 📄 Planning prévisionnel (Gantt)
  • 📄 Conditions générales de vente
  • 📄 Attestations fiscales et CNSS (si applicable)

📖 Guide utile : Comment choisir une agence digitale à Casablanca

📥 Besoin d'accompagnement ?

VOID accompagne les donneurs d'ordre dans la rédaction de leur CPS, la sélection des prestataires et le pilotage de projet. Notre expertise garantit des consultations qualitatives et des projets réussis.

🌱Site éco-conçu