vinovia_expertise_oenologique_ia

Fiche Descriptive Complète : VinovIA

🔷 INFORMATIONS GÉNÉRALES

Champ Détail

Nom du template vinovia_expertise_oenologique_ia.html

Version 1.1.0

Date de création 16/03/2026

Auteur / Designer Gemini (Inspiré par Refoia Jeremy Tech)

Type de page Linktree-style / Mobile-First Landing Page

Objectif principal Centraliser les services d’expertise œnologique assistés par IA

🎯 DESCRIPTION FONCTIONNELLE

📌 Que fait ce template ?

Ce template est une interface de type « Bio-link » optimisée pour le mobile. Il présente un expert (ou une entité) nommé VinovIA qui allie tradition viticole et technologie. Le design utilise un effet « Glassmorphism » (fond flouté et semi-transparent) sur un arrière-plan sombre et élégant évoquant la robe du vin.

📌 Public cible (Persona)

👤 Amateurs de vin cherchant des conseils technologiques immédiats.

👤 Vignerons souhaitant accéder à des outils d’analyse de données (B2B).

👤 Utilisateurs mobiles consultant les réseaux sociaux (Instagram/TikTok).

⚙️ SPÉCIFICATIONS TECHNIQUES

🌐 Environnement & Compatibilité

Framework CSS : Tailwind CSS (via CDN)

Typographie : Playfair Display (Titres) & Inter (Corps)

Icônes : FontAwesome 6.0.0

Responsive : ✅ Strictement optimisé pour mobile (max-width: 448px)

📦 Dépendances / Assets

HTML

📥 ENTRÉES — CONTENU DYNAMIQUE

# Nom de la variable Type Obligatoire Description

1 ai_prediction_text str ✅ Oui Texte défilant dans la bannière d’alerte haute.

2 profile_img_url url ✅ Oui Photo de l’œnologue ou logo de la marque.

3 service_links array ✅ Oui Liste des boutons (Titre, Sous-titre, Icône).

4 is_premium bool ❌ Non Si vrai, active l’effet ai-glow sur certains boutons.

🧱 STRUCTURE DU FICHIER — DOM

vinovia_expertise_oenologique_ia.html

│

├── 📌 (Configuration meta, Google Fonts, Styles personnalisés)

└── 📌 (Gradient background: #1a0a0a vers #2d0f0f)

│

├── 🏗️ Header Profile

│ ├── Avatar avec badge « IA Activée »

│ └── Titre H1 (Playfair Display) + Slogan

│

├── 🧱 Alert Box (Glass-card avec bordure latérale #bf3131)

│ └── Information prédictive IA

│

├── 🏗️ Navigation List (Stack de liens verticaux)

│ ├── Card 1: Conseiller IA (Style: ai-glow)

│ ├── Card 2: Réservations

│ ├── Card 3: Boutique

│ └── Card 4: Analytics (Accès verrouillé 🔒)

│

├── 🏗️ Social Footer

│ └── Liens Instagram, LinkedIn, TikTok

│

└── 🏗️ Legal Footer

└── Mention « Propulsé par VinovIA Engine v2.4 »

🎨 CHARTE GRAPHIQUE & DESIGN SYSTEM

🎨 Palette de Couleurs (Thème Sommelier Digital)

Primaire (Vin) : #722f37 (Bordeaux profond)

Accent (IA/Action) : #bf3131 (Rouge vif lumineux)

Fond : Gradient sombre #1a0a0a → #2d0f0f

Cartes : rgba(255, 255, 255, 0.05) avec backdrop-filter: blur(10px)

📐 Mise en Page — Layout

Conteneur : Centré, largeur maximale max-w-md (448px).

Effets : glass-card pour l’aspect moderne et ai-glow pour l’aspect technologique.

Transitions : scale(0.96) au clic sur les cartes pour un feedback tactile.

🧪 TESTS & VALIDATION

# Cas de test Action Résultat attendu

1 Feedback Tactile Appuyer sur un bouton La carte rétrécit légèrement (scale)

2 Lisibilité Vérifier le texte gris Opacité 80% sur fond sombre (Contrast OK)

3 Icônes Vérifier FontAwesome Toutes les icônes (robot, brain, lock) s’affichent

4 Responsive Étirer la fenêtre Le contenu reste centré et ne dépasse pas 448px

📝 EXEMPLE D’INTÉGRATION (CSS Custom)

CSS

/* Effet de lueur technologique sur les boutons prioritaires */

.ai-glow {

box-shadow: 0 0 15px rgba(191, 49, 49, 0.4);

border: 1px solid #bf3131;

}

/* Police élégante pour le luxe et la tradition */

h1 { font-family: ‘Playfair Display’, serif; }

📌 Fiche générée par — Agent IA Gemini