diff --git a/public/myinfomate-logo.png b/public/myinfomate-logo.png new file mode 100644 index 0000000..21dbf98 Binary files /dev/null and b/public/myinfomate-logo.png differ diff --git a/src/app/globals.css b/src/app/globals.css index d27bd76..ccd84e1 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -1,30 +1,51 @@ @import "tailwindcss"; -@tailwind base; -@tailwind components; -@tailwind utilities; - -:root { - --background: #ffffff; - --foreground: #171717; +@theme { + --color-primary: #0df2df; + --color-accent-violet: #8b5cf6; + --color-accent-orange: #f97316; + --font-display: "Plus Jakarta Sans", sans-serif; } -@theme inline { - --color-background: var(--background); - --color-foreground: var(--foreground); - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); -} - -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; +@layer base { + body { + background-color: #f8fafc; + color: #0f172a; + font-family: var(--font-display); + @apply antialiased; } } -body { - background: var(--background); - color: var(--foreground); - font-family: Arial, Helvetica, sans-serif; +@utility gradient-text { + background-image: linear-gradient(to right, #0df2df, #8b5cf6, #f97316) !important; + -webkit-background-clip: text !important; + background-clip: text !important; + color: transparent !important; + display: inline !important; } + +@utility icon-circle { + @apply bg-slate-100 rounded-full flex items-center justify-center transition-all duration-300 hover:bg-slate-200 hover:scale-105; +} + +@utility glass-card { + @apply bg-white/80 backdrop-blur-xl border border-primary/10; +} + +@keyframes float { + 0% { + transform: translateY(0px); + } + + 50% { + transform: translateY(-10px); + } + + 100% { + transform: translateY(0px); + } +} + +@utility animate-float { + animation: float 6s ease-in-out infinite; +} \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f7fa87e..6beddfc 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,20 +1,12 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; import "./globals.css"; -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin"], -}); - export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "MyInfoMate | Solution Interactive pour Musées et Sites Culturels", + description: "La solution SaaS leader pour la digitalisation des musées et sites culturels. Créativité et technologie au service du patrimoine.", + icons: { + icon: "/myinfomate-logo.png", + }, }; export default function RootLayout({ @@ -23,10 +15,12 @@ export default function RootLayout({ children: React.ReactNode; }>) { return ( - - + + + + + + {children} diff --git a/src/app/page.tsx b/src/app/page.tsx index f21618e..dd6b79b 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,86 +1,438 @@ -// pages/index.tsx import React from 'react'; +import { resolveImage } from '@/data/stitch-images'; export default function Home() { return ( -
- - {/* Hero Section */} -
-

- MyInfoMate -

-

- La solution facile pour créer, gérer et diffuser du contenu interactif sur tablette et application mobile. -

- - Demander une démo - -
- - {/* Problem / Pain Points */} -
-

Vos visiteurs méritent une expérience interactive, simple à gérer

-

- Trop compliqué de mettre à jour vos apps ? Besoin d’un développeur à chaque modification ? Contenu offline indisponible ? MyInfoMate résout tout cela en quelques clics. -

-
-
-

Mise à jour facile

-

Modifiez le contenu en temps réel, sans toucher au code.

-
-
-

Fonctionne offline

-

Vos visiteurs profitent du contenu même sans connexion internet.

-
-
-

Apps personnalisées

-

Chaque app est au nom de votre musée ou office, déployée sur stores ou tablettes kiosks.

+
+ {/* Top Navigation */} +
+
+ + MyInfoMate Logo + MyInfoMate + + +
+ + Connexion + +
-
+ - {/* Use Cases / Clients */} -
-

Ils utilisent MyInfoMate

-
-
- Musée de la Fraise -

Musée de la Fraise

+
+ {/* Hero Section */} +
+
+
+
+
+
+ + La technologie au service du patrimoine +
+

+ MyInfoMate - La solution facile pour créer, gérer et diffuser du contenu interactif +

+

+ Transformez l'expérience de vos visiteurs. Gérez vos parcours sur tablettes et mobiles en temps réel, sans aucune connaissance technique. +

+
+ + {/* */} +
+
+
+ {/* UI Mockup Group */} +
+ {/* Interactive Map Tablet Preview */} +
+ Modern Interactive Map Interface +
+

Carte Interactive

+

Parcours des Sculptures

+
+
+ {/* Agenda Mobile Preview */} +
+
+
+

Agenda

+
+
+
+ Mockup 1 +
+
+
+
+
+
+
+
+ {/* Tours Mobile Preview */} +
+
+
+

Visites

+
+
+
+
+ Mockup 2 +
+
+
+
+
+
+
+
+ Mockup 3 +
+
+
+
+
+
+
+
+
-
- Fort de St Héribert -

Fort de St Héribert

-
-
- visitNamur -

visitNamur

-
-
-
+ - {/* Call to Action */} -
-

Prêt à simplifier vos visites interactives ?

-

- Demandez une démo et voyez comment MyInfoMate peut transformer vos tablettes et apps mobiles en expériences engageantes pour vos visiteurs. -

- - Demander une démo - -
+ {/* Strategic Points */} +
+
+
+

Points Stratégiques

+

La technologie au service du patrimoine

+
+
+ {/* Feature 1 */} +
+
+ sync +
+

Mises à jour instantanées

+

Modifiez vos parcours de visite, textes et médias instantanément depuis votre navigateur.

+
+ {/* Feature 2 */} +
+
+ code_off +
+

Zéro développement

+

Créez des applications professionnelles sans écrire une seule ligne de code. Tout est visuel.

+
+ {/* Feature 3 */} +
+
+ download_for_offline +
+

Contenu hors ligne

+

Permettez à vos visiteurs de télécharger tout ou partie de vos parcours pour une consultation fluide même sans internet.

+
+ {/* Feature 4 */} +
+
+ dashboard_customize +
+

Gestion Centralisée (CMS)

+

Un seul outil pour piloter l'ensemble de vos dispositifs numériques et flottes de tablettes.

+
+
+
+
+ + {/* Interactive Modules Section (Feature target) */} +
+
+
+

Fonctionnalités & Modules

+

Des modules pour toutes vos envies

+

+ Personnalisez l'expérience de vos visiteurs en combinant une large gamme de modules interactifs, gérables en quelques clics via notre interface. +

+
+
+ {/* Module 1: Cartes */} +
+
+ map +
+

Cartes & Plans

+

Géolocalisation précise et plans interactifs pour guider vos visiteurs dans vos enceintes et parcs.

+
+ {/* Module 2: Jeux & Quiz */} +
+
+ sports_esports +
+

Jeux & Quiz

+

Rendez la culture ludique avec des quiz interactifs et des parcours gamifiés pour les plus jeunes.

+
+ {/* Module 3: Audio/Vidéo */} +
+
+ videocam +
+

Audio & Vidéo

+

Diffusez vos contenus multimédias HD directement sur les terminaux de vos visiteurs.

+
+ {/* Module 4: Articles/PDF */} +
+
+ article +
+

Articles & PDF

+

Fiches descriptives détaillées, brochures PDF et guides de visite numériques.

+
+ {/* Module 5: Agenda */} +
+
+ calendar_month +
+

Agenda & Événements

+

Gérez et affichez dynamiquement vos expositions temporaires et activités programmées.

+
+ {/* Module 6: Web */} +
+
+ public +
+

Contenu Web

+

Intégrez des flux externes, réseaux sociaux ou formulaires pour une interaction maximale.

+
+
+
+
+ + {/* White Label / Value Proposition */} +
+
+
+
+
+
+
+
+
+
+
+
+ palette +
+
+
+
+
+
+
+
+
+
+
+

Palette de Couleurs

+
+
+
+
+
+
+
+

Thème Appliqué avec succès

+
+
+
+
+
+
+

White label

+

Votre marque, votre application. Pas la nôtre.

+

+ Bénéficiez d'une solution White Label complète. Personnalisez l'interface aux couleurs de votre institution, utilisez votre propre logo et typographie pour une immersion totale de vos visiteurs dans votre univers. +

+
    +
  • + check_circle + Personnalisation complète des interfaces +
    • +
  • + check_circle + Logo institutionnel sur l'écran d'accueil +
    • +
  • + check_circle + Typographies et iconographies sur-mesure +
    • +
+ +
+
+
+
+ + {/* Target Audience */} +
+
+
+

Une solution pensée pour vous

+

Que vous soyez une petite galerie ou un monument national, MyInfoMate s'adapte à vos besoins.

+
+
+
+
+ museum +
+

Musées & Galeries

+

Digitalisez vos collections et créez des guides multimédias captivants pour vos expositions permanentes et temporaires.

+
+
+
+ travel_explore +
+

Offices de Tourisme

+

Guidez les visiteurs à travers votre ville ou région avec des cartes interactives et des points d'intérêt géo-localisés.

+
+
+
+ castle +
+

Lieux de Patrimoine

+

Redonnez vie à l'history avec des reconstitutions en réalité augmentée et des parcours scénographiés immersifs.

+
+
+
+
+ + {/* Final CTA */} +
+
+
+
+
+
+
+

+ Prêt à transformer votre expérience visiteur ? +

+

+ Rejoignez des dizaines d'institutions culturelles qui font confiance à MyInfoMate pour leur stratégie numérique. +

+
+ + + Nous contacter + +
+
+
+
+ {/* Footer */} -
- ) + ); } diff --git a/src/data/stitch-images.ts b/src/data/stitch-images.ts new file mode 100644 index 0000000..1a4e4cd --- /dev/null +++ b/src/data/stitch-images.ts @@ -0,0 +1,19 @@ +/** + * Mapping object for Stitch image placeholders. + * Replace the values below with your actual image paths or URLs. + */ +export const STITCH_IMAGES: Record = { + "{{DATA:IMAGE:IMAGE_14}}": "/myinfomate-logo.png", + "{{DATA:IMAGE:IMAGE_4}}": "https://images.unsplash.com/photo-1549490349-8643362247b5?auto=format&fit=crop&q=80&w=2000", + "{{DATA:IMAGE:IMAGE_5}}": "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?auto=format&fit=crop&q=80&w=500", + "{{DATA:IMAGE:IMAGE_6}}": "https://images.unsplash.com/photo-1549490349-8643362247b5?auto=format&fit=crop&q=80&w=200", + "{{DATA:IMAGE:IMAGE_7}}": "https://images.unsplash.com/photo-1549490349-8643362247b5?auto=format&fit=crop&q=80&w=200", +}; + +/** + * Helper to resolve a Stitch placeholder. + * If the placeholder is not found, it returns the placeholder itself. + */ +export function resolveImage(placeholder: string): string { + return STITCH_IMAGES[placeholder] || placeholder; +} diff --git a/tmp_stitch_design.html b/tmp_stitch_design.html new file mode 100644 index 0000000..e998407 --- /dev/null +++ b/tmp_stitch_design.html @@ -0,0 +1,376 @@ + + + + + +MyInfoMate | Solution Interactive pour Musées et Sites Culturels + + + + + + + + + +
+
+ +MyInfoMate Logo + + +
+ + +
+
+
+
+ +
+
+
+
+
+
+ + Plateforme No-Code pour la culture +
+

+ MyInfoMate - La solution facile pour créer, gérer et diffuser du contenu interactif +

+

+ Transformez l'expérience de vos visiteurs. Gérez vos parcours sur tablettes et mobiles en temps réel, sans aucune connaissance technique. +

+
+ + +
+
+
+ +
+
+Modern Interactive Map Interface +
+

Carte Interactive

+

Parcours des Sculptures

+
+
+ +
+
+
+

Agenda

+
+
+
+ +
+
+
+
+
+
+
+
+ +
+
+
+

Visites

+
+
+
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+

Points Stratégiques

+

La technologie au service du patrimoine

+
+
+ +
+
+sync +
+

Mises à jour instantanées

+

Modifiez vos parcours de visite, textes et médias instantanément depuis votre navigateur.

+
+ +
+
+code_off +
+

Zéro développement

+

Créez des applications professionnelles sans écrire une seule ligne de code. Tout est visuel.

+
+ +
+
+sensors_off +
+

Support Beacons (Offline)

+

Fonctionne sans Wi-Fi grâce aux balises de proximité pour une expérience visiteur sans interruption.

+
+ +
+
+dashboard_customize +
+

Gestion Centralisée (CMS)

+

Un seul outil pour piloter l'ensemble de vos dispositifs numériques et flottes de tablettes.

+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+palette +
+
+
+
+
+
+
+
+
+
+
+

Palette de Couleurs

+
+
+
+
+
+
+
+

Thème Appliqué avec succès

+
+
+
+
+
+
+

Marque Blanche

+

Votre marque, votre application. Pas la nôtre.

+

+ Bénéficiez d'une solution White Label complète. Personnalisez l'interface aux couleurs de votre institution, utilisez votre propre logo et typographie pour une immersion totale de vos visiteurs dans votre univers. +

+
    +
  • +check_circle + Personnalisation complète des interfaces +
    • +
  • +check_circle + Logo institutionnel sur l'écran d'accueil +
    • +
  • +check_circle + Typographies et iconographies sur-mesure +
    • +
+ +
+
+
+
+ +
+
+
+

Une solution pensée pour vous

+

Que vous soyez une petite galerie ou un monument national, MyInfoMate s'adapte à vos besoins.

+
+
+
+
+museum +
+

Musées & Galeries

+

Digitalisez vos collections et créez des guides multimédias captivants pour vos expositions permanentes et temporaires.

+
+
+
+travel_explore +
+

Offices de Tourisme

+

Guidez les visiteurs à travers votre ville ou région avec des cartes interactives et des points d'intérêt géo-localisés.

+
+
+
+castle +
+

Lieux de Patrimoine

+

Redonnez vie à l'histoire avec des reconstitutions en réalité augmentée et des parcours scénographiés immersifs.

+
+
+
+
+ +
+
+
+
+
+
+
+

+ Prêt à transformer votre expérience visiteur ? +

+

+ Rejoignez des dizaines d'institutions culturelles qui font confiance à MyInfoMate pour leur stratégie numérique. +

+
+ + +
+
+
+
+
+ + + \ No newline at end of file