AnunaQi Création numérique · Lyon
Design System • Haute Facture Numérique 2027

Système de Conception & Thèmes Graphiques

La fusion maîtrisée du récit d’artisanat de haute précision (24 ans de métier de JaxX), de la rigueur géométrique suisse et de l’ergonomie modulaire Dieter Rams. Zéro « IA Slop », respect absolu du Nombre d’Or (Φ), de Pi et de la syntaxe Allman.

01 / Palettes & Ambiances

Les 5 Thèmes Graphiques du Studio

Chaque thème est conçu avec des jetons sémantiques universels permettant de basculer l’intégralité du site instantanément sans aucune rupture structurelle.

Champagne (Style AnunaQi par défaut)

Noir velours, or champagne patiné et lisérés dorés à peine visibles. L’élégance feutrée d’une maison d’orfèvrerie numérique.

Ambiance : Feutré, précieux, chaleureux
Noir Velours #0B0B0D Arrière-plan principal du site
Surface Graphite #1A1B20 Cartes, champs et conteneurs
Liseré Champagne rgba(223,193,123,0.26) Bordures fortes et séparateurs
Or Champagne #BC9C50 Accent majeur, CTA et icônes
Ivoire Doux #B5ADA3 Corps de texte et sous-titres
Or Patiné #926F22 Accent du mode clair (fond #FAF8F5)

Modern Minimaliste (Rigueur & Blanc Pur)

Blanc pur, encre bleu nuit et fines lignes graphite. Rien que l’essentiel, la typographie et l’espace font le design.

Ambiance : Épuré, architectural, chirurgical
Blanc Pur #FFFFFF Fond du mode clair
Gris Perle #F6F7F9 Fond secondaire et sections alternées
Ligne Graphite rgba(15,23,42,0.09) Séparateurs optiques
Encre Nuit #0F172A Titres, boutons et accent du mode clair
Gris Ardoise #475569 Corps de texte et légendes
Noir Carbone #0C0D0E Fond du mode sombre

Cyberpunk 2077 (Néons Magenta & Cyan Électrique)

Nuit urbaine, néons magenta et cyan, éclats jaune signal et coupes obliques. L’énergie d’une ville qui ne dort jamais.

Ambiance : Électrique, nocturne, audacieux
Nuit Urbaine #05050A Arrière-plan principal du site
Surface Néon #121222 Cartes et conteneurs
Magenta Néon #FF007F Accent majeur et CTA
Cyan Électrique #00F0FF Lignes et textes secondaires
Jaune Signal #FFE600 Éclats, détails et textes atténués
Magenta Profond #C2005B Accent du mode clair (contraste AA)

Matrix (Pluie Numérique & Vert Phosphore)

Noir terminal, pluie de code et vert phosphore. Le code pur, lisible et vivant.

Ambiance : Cybernétique, hypnotique, technique
Noir Terminal #030704 Arrière-plan principal du site
Surface Console #0C1A0F Cartes, champs et terminaux
Trame Phosphore rgba(0,255,102,0.16) Lignes et trame de fond
Vert Phosphore #00FF66 Accent majeur et CTA
Vert Mousse #70B87C Corps de texte et sous-titres
Émeraude #059669 Accent du mode clair (fond #F0FDF4)

IA Slop (Glassmorphism & Dégradés Boréals)

Verre dépoli, dégradés boréals violets et halos diffus. Un clin d’œil assumé aux codes visuels des interfaces d’IA de 2026.

Ambiance : Onirique, lumineux, futuriste
Nuit Boréale #090812 Arrière-plan principal du site
Surface Améthyste #1A172E Cartes en verre dépoli et champs
Liseré Lavande rgba(168,85,247,0.30) Bordures et séparateurs
Indigo Boréal #655CF6 Accent majeur et CTA
Lavande Grise #A79EC2 Corps de texte et sous-titres
Brume Lilas #FAF7FF Fond du mode clair
02 / Démonstrateur Dynamique

Banc d’Essai Interactif en Temps Réel

Visualisez instantanément la réaction des composants (Hero, cartes Bento, CTA, badges) lorsque vous changez de thème à la volée.

► Thème actif : Champagne (Style AnunaQi par défaut)
● SYSTÈME EN LIGNE • SPRINT 2027

Design d’exception.
Ingénierie métier.
IA en production.

Plus de 24 ans de maîtrise créative et de développement sur mesure. Orchestration de collectifs d’élite pour des projets d’envergure.

Q POWER ON/OFF Φ 1.618 Ratio d’ouverture doré

Applications Métier

Architecture modulaire sans dépendance superflue, vitesse pure et pérennité.

Temps réel • JaxX V2

Identité & Marque

Direction artistique rigoureuse, géométrie sacrée sous-jacente et typographie sculpturale.

Haute Facture

Intelligence Artificielle

Agents autonomes locaux, automatisation de workflows et modèles d’ingénierie.

IA Locale & Cloud
03 / Inspirations & Direction Artistique

Planches Moodboard & Arbitrage Créatif

Les planches fondatrices validées lors de l’arbitrage multi-agents. Cliquez sur chaque planche pour l’ouvrir en plein écran dans le module officiel Slideshow JaxX V2.

Direction Lauréate : Synthèse « Fleuron Français »

La symbiose du grand atelier parisien de maître d’œuvre et de la perspective territoriale d’exception.

Verdict Arbitrage : 9.2 / 10
Synthèse 1 — Le Grand Atelier Contemporain
Agrandir HD

Synthèse 1 — Le Grand Atelier Contemporain

Établi en chêne massif huilé, carnets d’esquisse cousus main, prisme optique et lumière d’aube parisienne.

AtelierChênePrismeMatière

Synthèse 1 — Le Grand Atelier Contemporain

Établi en chêne massif huilé, carnets d’esquisse cousus main, prisme optique et lumière d’aube parisienne.

Synthèse 2 — Perspective Aérienne Drone dans la Brume
Agrandir HD

Synthèse 2 — Perspective Aérienne Drone dans la Brume

Pavillon contemporain en pierre locale et zinc noir au lever du soleil dans la brume matinale.

TerritoireDronePrestigeArchitecture

Synthèse 2 — Perspective Aérienne Drone dans la Brume

Pavillon contemporain en pierre locale et zinc noir au lever du soleil dans la brume matinale.

Direction B : Récit de Marque — Image & Lumière

L’atelier de mécanique de précision à contre-jour. La preuve tangible des 24 ans de métier.

Note Créative : 9.5 / 10
Direction B2 — Atelier de Mécanique de Précision
Agrandir HD

Direction B2 — Atelier de Mécanique de Précision

Verrière d’atelier à l’aube, outils de précision alignés sur établi en bois, rigueur artisanale.

MécaniqueOutilsVerrière24 ans

Direction B2 — Atelier de Mécanique de Précision

Verrière d’atelier à l’aube, outils de précision alignés sur établi en bois, rigueur artisanale.

Direction B1 — Architecture Brutaliste Béton & Verre
Agrandir HD

Direction B1 — Architecture Brutaliste Béton & Verre

Façade monumentale au crépuscule, baies vitrées éclairées et ciel d’orage souverain.

BétonVerreCrépusculeStabilité

Direction B1 — Architecture Brutaliste Béton & Verre

Façade monumentale au crépuscule, baies vitrées éclairées et ciel d’orage souverain.

Direction A : Systèmes de Marque & Rigueur Suisse

Le minimalisme géométrique, le bleu outremer pur et la superposition de papiers de création texturés.

Note Rigueur : 9.5 / 10
Direction A1 — Minimalisme Suisse & Aplat Outremer
Agrandir HD

Direction A1 — Minimalisme Suisse & Aplat Outremer

Papier et aplats géométriques, bleu outremer franc, lumière dure, rigueur helvétique.

SuisseOutremerGéométrieGrille

Direction A1 — Minimalisme Suisse & Aplat Outremer

Papier et aplats géométriques, bleu outremer franc, lumière dure, rigueur helvétique.

Direction A2 — Papiers Superposés & Lumière Rasante
Agrandir HD

Direction A2 — Papiers Superposés & Lumière Rasante

Matière papier texturé superposé, lumière douce de fenêtre et pastille cobalt.

PapeterieGaufrageLumièreTactile

Direction A2 — Papiers Superposés & Lumière Rasante

Matière papier texturé superposé, lumière douce de fenêtre et pastille cobalt.

Direction C : Studio Produit & Ingénierie Dieter Rams

Composants d’aluminium usiné, potentiomètres rotatifs et clarté fonctionnelle sans superflu.

Note Ergonomie : 9.5 / 10
Direction C1 — Composants Aluminium Usinés
Agrandir HD

Direction C1 — Composants Aluminium Usinés

Pièces d’aluminium usiné sur béton clair en lumière zénithale douce.

AluminiumUsinageHardwareErgonomie

Direction C1 — Composants Aluminium Usinés

Pièces d’aluminium usiné sur béton clair en lumière zénithale douce.

Direction C2 — Appareil Molettes sur Pierre Brute
Agrandir HD

Direction C2 — Appareil Molettes sur Pierre Brute

Boîtier métallique et molettes de commande posé sur un bloc minéral brut.

MolettesContrôleMinéralTactile

Direction C2 — Appareil Molettes sur Pierre Brute

Boîtier métallique et molettes de commande posé sur un bloc minéral brut.

04 / Ratios & Symbolique Imperceptible

Géométrie Sacrée & Le « Q » Bouton Power

Une symbolique impériale et cryptique mais strictement imperceptible au premier regard. Le professionnalisme B2B reste absolu.

Schéma vectoriel proportionné sur Φ et Π • Barre axiale vers le bas

Anatomie du Monogramme Q Power

  • Le Bouton Power (On / Off) : Éveil technologique, initialisation d’un système, passage de l’idée à la production.
  • Barre verticale vers le bas : Directive stricte de JaxX pour une stabilité axiale parfaite formant naturellement le jambage du « Q ».
  • L’ouverture d’arc (θ ≈ 70°) : Calibrée sur la formule $\theta = 360^\circ / \Phi^3$, créant une brèche optique dorée.
  • Le point de repère Π : Point quantique central calculé selon $\Delta y = R / \pi$, micro-ancrage de précision.

Le Nombre d’Or (Phi)

1.6180339887...

Échelles typographiques (16px, 26px, 42px, 68px), proportions des conteneurs Bento et rythmes verticaux.

La Quadrature du Cercle (Pi)

3.1415926535...

Courbures des arcs, point quantique central et trigonométrie des transitions fluides.

Monogramme Q « Bouton Power »

Barre verticale axiale vers le bas

Symbole d’initialisation et de mise en marche des systèmes (On/Off). Ratios d’ouverture d’arc calqués sur Phi.

Grille Modulaire & Filaire

Micro-hairlines 1px à 8% d’opacité

Structure sous-jacente imperceptible inspirée de la Matrice et de Tron. Zéro bavure visuelle.

05 / Échelles & Lisibilité

Système Typographique de Précision

Une hiérarchie claire articulée autour de deux polices modernes et d’une police à chasse fixe pour les annotations d’ingénierie et de télémétrie.

TITRES & DISPLAY • 600 À 800

Syne

Haute Facture Numérique 2027

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z 0 1 2 3 4 5 6 7 8 9

Fonderie française Bonjour Monde • Caractère architectural distinctif
CORPS DE TEXTE & UI • 400 ET 500

Instrument Sans

Un labeur d’une lisibilité chirurgicale sur tous les écrans, optimisé pour les interfaces denses et les récits éditoriaux d’exception.

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z € % & § •

Dessin contemporain d’orfèvre • Lisibilité micro-typographique
TÉLÉMÉTRIE, CODE & CHIFFRES • 500

JetBrains Mono

STATUS: ONLINE // Φ: 1.618033 // SPRINT_DURATION: 14D // CODE: Allman_Strict

0 1 2 3 4 5 6 7 8 9 { } [ ] ( ) < > = + - * /

Chiffres tabulaires • Espace insécable systématique
06 / Composants & Éléments

Bibliothèque d’Éléments UI JaxX V2

Boutons, badges de statut, cartes Bento, contrôles de formulaires et retours d’interaction.

Boutons d’Action (CTA)

Badges & Télémétrie

● En Production ● Sprint Actif ● Validation JaxX Sprint 2027

Champs de Formulaire (Inputs)

07 / Identité de Marque & Systèmes Visuels

Logos pour le Head, Favicons & Icônes Transparentes

Propositions pour l’en-tête du site, le pack de favicons multi-résolutions (PWA & Web) et la suite d’icônes d’artisanat d’art transparentes compatibles Bright et Dark mode via filtres CSS matériels.

Proposition A • Vectoriel Réactif
Monogramme SVG AnunaQi

Q Power Géométrie Sacrée (SVG)

Vectoriel ultra-léger (< 1 Ko) avec barre descendante (Nombre d’Or Φ). Embarque une règle CSS @media (prefers-color-scheme) pour basculer automatiquement de l’or / cobalt en sombre à l’encre profonde en clair.

Format : SVG • Usage : Head, Favicon & Header
Proposition B • Orfèvre 3D Transparent
Monogramme 3D AnunaQi

Monogramme Q Laiton & Cristal (PNG Alpha)

Sculpture de haute facture joaillière : ruban de laiton champagne brossé et facettes de cristal optique taillé. Détourage au canal alpha transparent sans fond blanc ni liseré parasite.

Format : PNG 1024 px • Usage : Header Prestige, Apple Touch
Proposition C • Wordmark Officiel
AnunaQi Création numérique • Lyon

Wordmark Typographique Fédérateur

Composition binaire alliant le monogramme au nom en police Syne et sa baseline géographique lyonnaise, parfaitement proportionné pour la barre de navigation supérieure.

Format : SVG • Usage : Header Principal Desktop

Pack Favicons & Manifeste PWA Multi-Écrans

Généré et déployé dans _medias/site/logo/ et _theme/ :

16x16
16 × 16 px (Onglet)
32x32
32 × 32 px (Retina)
180x180
180 × 180 px (Apple Touch)
192x192
192 × 192 px (Android PWA)
512x512
512 × 512 px (Splash & Store)
Canal Alpha • Filtres CSS Auto-Theme

Suite des Icônes d’Orfèvre Numérique Transparentes

Chaque icône est un objet 3D détouré sur fond transparent, conçu en laiton, titane, obsidienne et cristal. La classe .icone_auto_theme applique un filtre CSS matériel (filter: brightness... / invert...) qui adapte la lisibilité au mode clair ou sombre sans nécessiter de double fichier.

Communication visuelle
Communication Visuelle Rouleau d’imprimerie • Cuivre & Noyer
Branding
Branding & Identité Sceau de cire dorée • Matrice laiton
Sites Web
Sites Web & Projets Prisme optique • Profilés titane
Applications métier
Applications Métier Mécanisme horloger • Titane & Rubis
SEO & SEA
SEO & SEA Ciblé Lentille optique • Compas d’alidade
IA & Automatisation
IA & Automatisation Polyèdre d’obsidienne • Noyau mécanique
Configurateur de devis
Estimation & Devis Pied à coulisse laiton • Compas acier
Souveraineté & Sécurité
Souveraineté & Sécurité Bouclier d’art • Titane & Laiton doré
08 / Effets & Matières

Lumière, Profondeur & Matière

Des effets presque imperceptibles qui donnent vie à l’interface sans jamais la ralentir. Tous s’éteignent si le visiteur demande de réduire les animations.

Mode sombre : survolez cette carte. Mode clair : promenez la souris sur le fond.

Halo vaporeux selon le mode

En sombre, la lumière n’éclaire que le premier plan (cartes, images, visuels) : un reflet à trois lobes aux inerties différentes. En clair, elle n’existe que sur le fond : trois nappes de brume qui glissent lentement derrière le contenu.

_theme/halo_souris.js • theme.css HALO_VAPOREUX • selecteur_cartes

Cliquez ou touchez cette carte.

Éclosion au toucher et au clic

Au clic de souris comme au toucher sur mobile, une lumière éclot sous le pointeur puis se dissipe : sur l’élément touché en sombre, sur le fond en clair. Un glissement ou un appui long (défilement) ne déclenche rien.

halo_souris.js APPARITION • theme.css HALO_APPARITION

Fond animé en continu

Le dégradé du fond dérive très lentement (60 s) et un second voile respire à contretemps (43 s), sur tous les écrans. Seuls la position et l’opacité bougent : aucun recalcul de mise en page.

body::before fond_derive • body::after fond_respiration

Parallaxe multiplan

La souris (bureau) ou l’accéléromètre (téléphone) décale chaque plan de quelques pixels : le fond en sens inverse, puis les images, les cartes et les boutons. Sur iPhone, l’autorisation est demandée au premier toucher.

_theme/parallaxe.js • --plx_x / --plx_y • propriété translate

AplatSatiné

Satiné des aplats

Un léger dégradé de lumière sur les aplats (cartes, bouton principal, bouton Devis mobile, en-tête) donne une matière satinée, sans relief ni ombre appuyée.

theme.css SATIN • --satin, --satin_accent, --satin_barre

Logo aux couleurs du thème

Le monogramme de l’en-tête est un SVG intégré dont le dégradé suit l’accent du thème actif : or pour Champagne, encre nuit pour Modern Minimaliste, magenta pour Cyberpunk, vert phosphore pour Matrix et indigo pour IA Slop. Changez de thème dans la palette de l’en-tête pour le voir changer.

logo_monogramme_svg() • theme.css LOGO_THEME

Champagne par défaut

Champagne, le style AnunaQi, est le thème servi à tout nouveau visiteur. Le choix fait dans la palette de l’en-tête est ensuite mémorisé (clé version 3) et retenu d’une visite à l’autre.

cookie theme_graphique_v3 • localStorage anunaqi_theme_graphique_v3

Cadenas dans le menu du haut : connexion, puis panneau déroulant de l’atelier.

Menu de l’atelier

Une fois connecté, le cadenas ouvre un panneau : Tableau de bord, Demandes, Portfolio, Journal, Réglages, Dialogue, Déconnexion. Il se ferme par Échap ou par un clic à l’extérieur. Sur mobile, l’accès passe par le tiroir de navigation.

menus.php ADM_MENU_BUILD • theme.js ADM_MENU • theme.css ADM_MENU

Réservée au compte jaxprodart@gmail.com.

Connexion avec Google

Le bouton Google renvoie un jeton d’identité que le serveur fait vérifier par Google (audience, émetteur, expiration, nonce, adresse vérifiée et autorisée). Aucun secret n’est stocké. Le mot de passe reste disponible en secours, replié.

_includes/adm_google.php • adm_google_reglages.php

09 / Matières Vivantes • Arrière-Plan • Parallaxe

5 Textures Abstraites d’Orfèvrerie Numérique

Habillages géométriques en filigrane, conçus pour flotter en arrière-plan à opacité 0,2 (réglable). Grâce aux modes de fusion adaptatifs (screen en mode sombre, multiply avec inversion douce en mode clair), la matière enrichit la profondeur de page sans jamais perturber la hiérarchie typographique ni le confort de lecture.

Texture active :
Mode Témoin • Opacité 0,2 • Parallaxe active

Harmonie de Fond & Lisibilité Absolue

Observez la transition du motif derrière cette carte translucide. Les lignes métalliques d’or champagne et de titane s’estompent délicatement pour laisser s’exprimer le contenu, tout en apportant une vibration organique et matérielle propre aux créations de haute précision.

Texture Orfèvrerie et Géométrie Sacrée 103 Ko • WebP HD
Proposition 01

Orfèvrerie & Géométrie Sacrée

Filigranes d’or champagne inspirés du Nombre d’Or (Φ), arabesques et spirales logarithmiques reposant sur une ardoise d’obsidienne profonde. Les motifs s’adoucissent vers le centre pour préserver un champ de repos textuel parfait.

Rôle : Fond global de page • Bannières d’accueil
Texture Ondes Caustiques et Réfraction 43 Ko • Ultra-légère
Proposition 02

Ondes Caustiques & Prisme Optique

Ondulations caustiques fluides simulant la réfraction de la lumière à travers un verre biseauté d’artisan. Le centre est totalement épuré, laissant les vagues ambrées encadrer le viewport avec une élégance aérienne.

Rôle : Sections immersives • Fond de cartes Bento
Texture Trame Micrométrique et Repères Géodésiques 115 Ko • WebP HD
Proposition 03

Trame Micrométrique & Géodésie

Grille isométrique de haute ingénierie, réticules de visée et repères millimétriques gravés au laser. Évoque la rigueur suisse des ateliers de mécanique de pointe et l’architecture logicielle sur mesure.

Rôle : Pages Expertises • Simulateurs & Devis
Texture Lignes Topographiques et Isoclines 175 Ko • WebP HD
Proposition 04

Lignes Topographiques & Isoclines

Courbes de niveau continues en fil de laiton brossé, dessinant un relief géographique fluide. Donne une impression de matière tactile et de paysage en apesanteur, idéale pour créer une dynamique de mouvement au défilement.

Rôle : Arrière-plans avec forte amplitude de parallaxe
Texture Facettes Quantiques Q-Power 59 Ko • Ultra-légère
Proposition 05

Facettes Quantiques (Esprit Q-Power)

Polyèdres biseautés et plans géométriques suspendus en équilibre gravitationnel. Fusionne l’obsidienne taillée, le titane et les arêtes d’or dans la droite lignée du monogramme Q-Power officiel.

Rôle : Bannières de synthèse • Espace Atelier & Tech

Nos expertises

Toutes les expertises

Parlons de votre projet

Chiffrer mon projet