Créez une page web à partir du contenu fourni par l'utilisateur. Les exigences en matière de style sont les suivantes :

### I. Positionnement du style visuel - **Style artistique dessiné à la main** : Adopter un style de dessin au trait, alliant design numérique moderne et esthétique traditionnelle du dessin à la main. - **Palette de couleurs** : Utiliser des couleurs neutres (blanc cassé/gris clair) comme base, associées à un texte principal gris foncé, et utiliser un rouge orangé (couleur d'accent) comme couleur focale visuelle. - **Ton de la marque** : Raffiné, artistique et chaleureux, ciblant un groupe d'utilisateurs exigeants. ### II. Principes de structure de la mise en page **Section principale (Conception du premier écran)** - Mise en page en colonnes (ratio d'or 60:40) - Côté gauche : - Titre surdimensionné (police Display, 72-96 px), police foncée, fort impact visuel - Données clés mises en évidence par une couleur d'accentuation (ex. : « 15 villes, 4 749 emplacements ») - Sous-titre concis et percutant, énonçant la proposition de valeur principale - Espace blanc important, créant une impression haut de gamme - Côté droit : - Illustrations personnalisées dessinées à la main, occupant 50 % de l'espace visuel - Style d'illustration cohérent : dessin au trait + accents de couleur locale - Contenu des illustrations profondément intégré à l'histoire de la marque - **Conception de la barre de navigation** - Navigation supérieure minimaliste, position fixe - Logo + 2 à 3 éléments de menu principaux - Groupe d'icônes à droite (recherche/favoris/menu) - Fond transparent ou blanc pur avec des ombres subtiles - **Zone des cartes de contenu** - Mise en page en grille de cartes (3 à 4 colonnes, responsive) - Chaque carte comprend : - Titre (Titre 3, 32-40 px) - Description (2-3 lignes, 16-18px, hauteur de ligne 1,6) - Illustration dessinée à la main (en accord avec le style visuel principal) - Fond clair (#F5F3F0), coins arrondis (8-12px) - État de survol : Légère élévation + ombre plus profonde - ### III. Spécifications du système d'illustration **Directives de création d'illustrations** 1. 2. **Traitement des lignes** : - Utiliser des lignes irrégulières dessinées à la main de 1 à 2px pour simuler une texture de peinture réaliste - Conserver des lignes lisses avec une touche d'artificialité, en évitant un aspect trop mécanique. 3. **Utilisation des couleurs :** - 80 % de lignes grises + 20 % de remplissage aux couleurs de la marque - Le rouge orangé est utilisé uniquement pour mettre en valeur certains éléments (personnes, fenêtres, bâtiments principaux) - L’arrière-plan utilise un dégradé beige (#FDFBF7 → #F5F1EB) - 5. **Composition des scènes :** - Scènes urbaines : mélange de bâtiments emblématiques et de scènes de la vie quotidienne - Perspective aérienne ou isométrique - Ajout de petits personnages pour renforcer la narration et l’intimité - 7. **Densité des détails :** - Premier plan riche en détails, plan intermédiaire modérément simplifié et arrière-plan aux contours nets - Maintien de la hiérarchie visuelle, guidant le regard vers les informations clés - 9. ### IV. Système de polices - **Police d'affichage (Titre) :** Police Serif, grasse et imposante (ex. : Freight Display, Tiempos) - **Police du corps du texte :** Police Sans-serif, très lisible (ex. : Inter, Manrope) - **Rapport de taille de police** : Utilise une échelle modulaire (1,25 ou 1,333) - **Niveaux de graisse de police** : Léger (300) / Normal (400) / Moyen (500) / Gras (700) - ### V. Détails d'interaction - **Micro-animations** : Les cartes flottent de 4 à 8 px au survol, temps de transition de 300 à 400 ms - **État de chargement** : Utilise un écran squelette pour maintenir le ton de la marque - **Points de rupture responsifs** : - Ordinateur : 1440 px et plus - Tablette : 768 à 1439 px - Mobile : 375 à 767 px - ### VI. Exigences relatives aux livrables graphiques : Chaque livrable graphique doit inclure : 1. 2. Une hiérarchie visuelle claire (obtenue grâce à la taille, la couleur et les espaces blancs) 3. 4. Au moins une illustration personnalisée (étroitement liée au contenu, générée avec Nano Banana Pro) 5. 6. 2 à 3 touches de couleur d'accentuation (ne dépassant pas 7. 8. 9. 10. 11. 11. 12. 12. 11. 12. 12. 13. 14. 15. 16. Un espacement suffisant entre les sections (≥ 120 px) 17. 18. 19. 19. 10. Un parcours utilisateur clair 18. 19. 10. --- **Philosophie de conception** : Utiliser un langage visuel artistique pour transmettre l'unicité et la chaleur de la marque. Chaque pixel contribue à raconter une histoire, et non à simplement démontrer des fonctionnalités. Le design doit donner aux utilisateurs l'impression d'être destiné à des personnes qui apprécient la vie, plutôt que de présenter un produit froid et impersonnel.

Toutes les illustrations de la page web ont été générées par nano banana pro.