Sites web
Design d’un site web de recrutement
Kimi Careers par OpenDesign
Une page Carrières racontée en huit scènes lunaires, avec des transitions liées au défilement et un processus de candidature illustré en quatre étapes.
Exemple de hackathon
Bibliothèque d’exemples de design
Vitrine OpenDesign :
Exemples de design par IA
- Sites web
- Applications
- Tableaux de bord
- Présentations
- Créations graphiques
- Motion design
98 exemples de design de sites web, applications, tableaux de bord, présentations et créations graphiques, dont les modèles officiels OpenDesign. Ouvrez un projet pour découvrir ses choix de mise en page et un prompt suggéré ; les noms des modèles d’IA ne sont indiqués que lorsqu’ils sont documentés.
98 exemples de design · trois séries · 10 modèles d’IA documentés
Exemples de design
Trouvez l’inspiration pour votre prochaine idée
Filtrez les projets par type de livrable, objectif, série ou modèle utilisé.
Exemple de hackathon
Sites web
Design du site Bianjing Night Tour
Bianjing After Dark par OpenDesign
Un voyage nocturne interactif dans une Bianjing imaginaire de l’époque Song, entre ville fluviale omniprésente, poésie, lanternes et chapitres au rythme adapté à plusieurs langues.
LLM Arena · GPT 6 Sol
Sites web
Design d’un site web pour une visite nocturne de Kaifeng
Bianjing After Dark par OpenDesign
Suivez une rivière illuminée par des lanternes à travers les cinq chapitres de Bianjing After Dark, de la porte de la ville et du marché nocturne à la poésie et au lâcher de lanternes.
LLM Arena · Claude Opus 5.5
Tableaux de bord
Design du tableau de bord de planification de voyage
Halcyon Cove par OpenDesign
Organisez une journée en six étapes à Halcyon Cove : reliez lieux enregistrés, emplacements sur la carte et temps de marche dans un seul tableau de bord.
LLM Arena · Claude Opus 5
Applications
Design de l’application de collection marine
Abyssal Log par OpenDesign
Une collection de spécimens marins liée à des missions de plongée. Chaque fiche de spécimen inconnu indique la tâche et la progression nécessaires pour le découvrir.
LLM Arena · Claude Opus 5
Tableaux de bord
Design du tableau de bord personnel
Life System par OpenDesign
Un score hebdomadaire, des indicateurs corporels, les rythmes quotidiens et cinq expériences sur un tableau de bord pour ordinateur, présentés à travers quatre vues détaillées annotées.
Exemple de hackathon
Sites web
Design d’un site web de réservation au restaurant
Ember & Pepper par OpenDesign
Plats signature et informations pratiques, avec une fenêtre de réservation pour les clients prêts à réserver.
LLM Arena · GPT 5.6 Sol
Applications
Conception d’un jeu d’aventure insulaire
Harbor Skirmish par OpenDesign
Une petite île en bord de mer, avec des itinéraires sur les toits, trois emplacements d’armes et une interface à la première personne pleine de fantaisie.
LLM Arena · GPT 6 Astra
Présentations
Conception d’une présentation produit
Agent-Native Workspace par OpenDesign
Une histoire produit en trois diapositives : une idée directrice, un concept d’application mobile complémentaire et une salle de contrôle pour les entreprises.
Exemple de hackathon
Applications
Conception d’un planificateur d’excursion à la journée
Solara Bay par OpenDesign
Six étapes à horaires définis dans la ville fictive de Solara Bay, avec une carte illustrée, des estimations de marche et des avertissements utiles sur l’itinéraire.
LLM Arena · GPT 5.6 Sol
Applications
Conception d’une application de collection de découvertes
Abyssal Atlas par OpenDesign
Une collection de spécimens reliée à une file de plongée : fiches verrouillées, deux rangées de filtres et compteurs de progression indiquent les prochaines découvertes.
LLM Arena · Grok 4.6
Sites web
Conception d’un site de restaurant de fondue chinoise
Yàn Huǒ par OpenDesign
La fondue chinoise est présentée avec un menu signature et ses prix, une galerie du restaurant et des informations pratiques avant la réservation.
LLM Arena · Qwen 3.8 Max
Sites web
Design d’un site web de restauration forestière
Second Spring par OpenDesign
Une branche tombée interactive mène à des récits de terrain en forêt, à un plan de restauration et à des façons simulées de contribuer.
LLM Arena · DeepSeek V4.1 Flash
Sites web
Conception d’un site de conservation interactif
Second Spring par OpenDesign
Faites pousser une touffe de mousse sur un tronc tombé, puis découvrez les récits du sol forestier et des façons simulées d’agir.
LLM Arena · Claude Fable 5.1
Créations graphiques
Conception d’un explicateur produit interactif
iPhone Inside par OpenDesign
Les couches séparées d’un téléphone conceptuel, avec des préréglages photo, un curseur et un panneau regroupant huit ensembles de composants.
LLM Arena · GPT Astra
Applications
Conception d’un jeu de tir à la première personne sur une île
Harbor Skirmish par OpenDesign
Un écran titre audacieux sur une île mène à une partie à la première personne, avec des panneaux d’état encadrés et des commandes d’armes numérotées.
LLM Arena · DeepSeek V4.1 Flash
Créations graphiques
Conception d’un site de CV
Tom Goodman par OpenDesign
Un CV fictif qui associe expérience, graphiques de compétences et réalisations sélectionnées, avec une lecture en deux colonnes et une mise en page distincte pour l’impression.
Exemple de hackathon
Créations graphiques
Conception d’un site de portfolio créatif
Maya Rowan par OpenDesign
Un portfolio fictif qui relie des cartes de projets façon affiches, une pratique en trois étapes, des notes de travail et un contact.
Exemple de hackathon
Sites web
Design de site web narratif sur un temple
Narration architecturale par OpenDesign
Parcourez Kage, un temple de montagne imaginaire raconté à travers une architecture au clair de lune, de paisibles notes sur les jardins et des vues rapprochées du travail du bois.
Projet officiel
Sites web
Conception de site web pour studio de design IA
Landing page éditoriale en collage pour OpenDesign Atelier Zero par OpenDesign
La conception du site web de studio de design IA d’OpenDesign transforme le concept d’un studio local-first en landing page éditoriale, où les compétences, les expérimentations et la méthode sont faciles à parcourir.
Modèle officiel
Sites web
Conception de site web d’infrastructure d’IA
Site web marketing apaisé de Halcyon pour une infrastructure d’agents d’IA via OpenDesign
Un concept de page d’accueil d’infrastructure d’IA tout en douceur, avec des exemples de métriques d’exécution, des cartes de fonctionnalités imbriquées, des animations subtiles et une unique invitation commerciale.
Modèle officiel
Créations graphiques
Conception d’affiche éditoriale sur les workflows IA
Affiche éditoriale d’un passionné d’IA présentant six workflows de conception par OpenDesign
Cette affiche éditoriale sur les workflows IA présente six affirmations, organisées en chapitres numérotés, avec des exemples concrets de prompts et des accents typographiques rouille sur un fond crème.
Modèle officiel
Créations graphiques
Conception d’un carrousel social sur les workflows IA
Éditorial social en sept cartes sur l’amélioration des workflows d’édition avec l’IA via OpenDesign
Sept cartes verticales utilisent des titres chinois surdimensionnés, des habitudes numérotées, des aplats de couleur changeants et une conclusion pour expliquer les workflows d’édition avec l’IA.
Modèle officiel
Tableaux de bord
Conception de wireframe de tableau de bord analytique
Wireframe greybox de tableau de bord analytique Acme par OpenDesign
Un tableau de bord greybox OpenDesign cartographie un espace de travail analytique au moyen d’une barre latérale, de quatre emplacements KPI, d’un graphique schématique, de cinq lignes de tableau et d’annotations de mise en page bleues.
Modèle officiel
Motion design
Vidéo motion design de logo et histoire de l’art
Vidéo motion design de logo et histoire de l’art par OpenDesign
Un film OpenDesign de 15 secondes en 16:9 garde un logo circulaire à curseur reconnaissable à travers des styles rapides inspirés de l’histoire de l’art, puis se termine sur un logo fixe blanc sur noir.
Projet officiel
Créations graphiques
Conception de shader Aurora Field
Composition Aurora Field WebGL2 animée automatiquement par OpenDesign
Un champ de bruit bleu-vert animé automatiquement donne son atmosphère à un hero WebGL, tandis qu’un titre fixe et un petit indicateur local de fréquence d’images ancrent la scène.
Modèle officiel
Créations graphiques
Conception du shader Aurora Veil
Aurora Veil interactif original — composition shader OpenDesign par OpenDesign
Aurora Veil est une composition shader interactive qui transforme des lumières superposées, des étoiles et les mouvements du curseur en un hero WebGL atmosphérique.
Modèle officiel
Créations graphiques
Conception d’une spécification produit d’authentification
Document de spécification produit Northwind pour l’authentification à deux facteurs par OpenDesign
Une proposition Northwind d’authentification à deux facteurs relie responsabilités, périmètre, récits utilisateurs, quatre objectifs d’exemple, phases de déploiement et décisions non résolues.
Modèle officiel
Présentations
Conception d’une présentation d’histoire de marque
Présentation OpenDesign de l’histoire de marque pour partenaires et médias par OpenDesign
La conception d’une présentation d’histoire de marque offre aux partenaires, aux médias et aux communautés un récit fondé sur des preuves, de la conviction aux canaux, au calendrier et à la vérification.
Modèle officiel
Sites web
Conception de site web de journal brutaliste
Site web de journal éditorial brutaliste Field Unit 04 via OpenDesign
La conception de site web de journal brutaliste transforme un numéro en forme d’imprimé en un système de lecture web lisible, en associant une typographie audacieuse à une structure éditoriale mesurée.
Modèle officiel
Créations graphiques
Conception du shader Caustic Pool
Caustic Pool interactif original — composition shader OpenDesign par OpenDesign
Un champ lumineux WebGL turquoise associe des filaments caustiques éclatants à une typographie fixe et à une ondulation déclenchée par le pointeur, qui infléchit brièvement le motif.
Modèle officiel
Créations graphiques
Conception d’un rapport de cas clinique
Rapport de cas fictif en médecine d’urgence avec signes vitaux, examens et prise en charge par OpenDesign
La conception d’un rapport de cas clinique organise une présentation fictive aux urgences selon un parcours lisible, des symptômes et observations aux examens, à l’évaluation et à la prise en charge.
Modèle officiel
Applications
Design d’application de boîte de réception de revue de code
Boîte de réception GitHub des demandes de revue et des mentions par OpenDesign
Ce design d’application réunit demandes de revue, échecs CI, tickets assignés et activité dans un espace de travail lisible d’un coup d’œil pour le tri quotidien.
Modèle officiel
Motion design
Vidéo animée de jalon communautaire
Conception d'une vidéo animée de jalon communautaire par OpenDesign
Une vidéo animée OpenDesign de 30 secondes passe d'un compteur de 100K étoiles à une mosaïque de contributeurs, un montage produit, puis une invitation à écrire un prompt.
Projet officiel
Tableaux de bord
Design de tableau de bord de performance des contenus
Analyse des contenus sociaux multiplateformes avec cartes thermiques d’engagement et graphiques de revenus par OpenDesign
Un tableau de bord de contenus sombre relie les aperçus par plateforme à l’examen des graphiques, à la planification des brouillons et à une analyse approfondie des signaux d’audience et de conversion.
Modèle officiel
Créations graphiques
Conception de résumé quotidien d’e-mails
E-mail de résumé quotidien Gmail regroupé par priorité par OpenDesign
Cette conception de résumé quotidien d’e-mails transforme un briefing Gmail de six messages en un parcours de lecture classé par priorité afin de déterminer quoi traiter en premier.
Modèle officiel
Applications
Design d’application de quêtes quotidiennes
Application mobile Level de quêtes quotidiennes gamifiées, présentée sur trois écrans distincts par OpenDesign
Le design d’application de quêtes quotidiennes transforme les objectifs de tous les jours en un parcours mobile en trois écrans, avec des XP d’exemple, des cartes de catégories et le détail des tâches.
Modèle officiel
Sites web
Conception de site web de documentation pour développeurs
Documentation pour développeurs Filebase et guide de démarrage rapide de la CLI par OpenDesign
Un guide de démarrage rapide de la CLI Filebase associe la navigation dans la documentation à une séquence de lecture claire couvrant l’installation, l’authentification et la synchronisation de dossiers.
Modèle officiel
Sites web
Design de site web éditorial pour produit
Page de destination éditoriale OpenDesign sur papier chaleureux pour un produit via OpenDesign
Ce design de site web éditorial pour produit associe papier chaleureux, typographie surdimensionnée et lecture par chapitres pour présenter un studio privilégiant le fonctionnement local comme une publication rédigée.
Modèle officiel
Créations graphiques
Conception de guide d’intégration des employés
Plan d’intégration des nouvelles recrues de Northwind avec le premier jour et les jalons à 30/60/90 jours par OpenDesign
Cette conception de guide d’intégration transforme le premier jour, la première semaine et les jalons à 30/60/90 jours d’une nouvelle recrue en un parcours pratique ponctué d’étapes visibles.
Modèle officiel
Sites web
Conception de site web de blog d’ingénierie
Article d’ingénierie de Filebase consacré à la réécriture d’un moteur de synchronisation en Rust par OpenDesign
Un article d’ingénierie associe une colonne de lecture étroite et une introduction en italique à un panneau en dégradé chaleureux, une bande de métriques d’exemple et des compromis techniques explicités.
Modèle officiel
Sites web
Conception de site web SaaS de synchronisation de fichiers
Page d’atterrissage SaaS Filebase de synchronisation de fichiers économe en bande passante par OpenDesign
Une page de destination de synchronisation de fichiers associe un titre axé sur la bande passante à trois colonnes de bénéfices numérotés, à des noms d’entreprises illustratifs et aux forfaits Solo, Team et Enterprise, présentés en contraste.
Modèle officiel
Créations graphiques
Design de CV d’ingénieur frontend
CV chinois d’ingénieur frontend senior sur deux colonnes via OpenDesign
Ce design de CV chinois sur deux colonnes associe une chronologie professionnelle détaillée à des sections compactes consacrées aux compétences, à la formation et aux langues.
Modèle officiel
Présentations
Conception d’une présentation de mémo de levée de fonds
Mémo de financement de série A de Quartz dans une typographie éditoriale discrète via OpenDesign
Le mémo de levée de fonds de Quartz, en dix diapositives, associe une typographie serif discrète à des principes produit, des indicateurs de traction donnés à titre d’exemple et une demande de financement destinée à un petit groupe d’investisseurs.
Modèle officiel
Motion design
Design vidéo motion futuriste
Design vidéo motion futuriste par OpenDesign
Un reel rendu en bleu électrique avec tunnel de mots, compte à rebours SET et final FUTURE chromé, refait en code sur une grille de coupes à 120 BPM. Découvrez son rythme et comment l'adapter.
Modèle officiel
Créations graphiques
Design de rapport d’indicateurs de croissance
Rapport mensuel de croissance en chinois avec KPI, tendances, tableau de données brutes et insights via OpenDesign
Une mise en page de rapport chinois réunit quatre cartes KPI, deux graphiques de tendance associés, neuf lignes d’exemple mensuelles et trois cartes d’insights dans un document vertical.
Modèle officiel
Présentations
Design de suivi des métriques de croissance
Diaporama de suivi des métriques Ops et Growth diagnostiquant la perte de conversion dans Safari par OpenDesign
Le design de présentation de suivi des métriques de croissance transforme un problème de conversion dans Safari en un récit ciblé qui aboutit à une décision clairement attribuée.
Modèle officiel
Créations graphiques
Conception de shader en trame
Composition WebGL2 d’un champ tramé réagissant au curseur par OpenDesign
Une trame de points inclinée transforme un champ fluide orange et crème en une texture inspirée de l’impression, avec une influence lissée du pointeur et une typographie fixe en bas à gauche.
Modèle officiel
Créations graphiques
Conception d’un shader de feuille métallique holographique
Holographic Foil interactif d’origine — composition de shader OpenDesign par OpenDesign
Une surface procédurale multicolore à l’aspect de feuille métallique évolue avec le temps et la position du pointeur, sous un titre fixe sur deux lignes, de petits libellés d’aperçu et une indication d’inclinaison.
Modèle officiel
Présentations
Conception de présentation de télémétrie d’incident
Jeu de diapositives sur la télémétrie de l’incident Operation Halcyon et la décision de refonte du résolveur via OpenDesign
Incident Telemetry — Operation Halcyon transforme une panne d’exécution illustrative en un briefing structuré permettant de retracer les causes, les risques et les décisions.
Modèle officiel
Sites web
Conception de site portfolio interactif
Page d’accueil de portfolio interactif OpenDesign en plein écran, en police à chasse fixe par OpenDesign
La conception de site portfolio interactif d’OpenDesign associe une interface en police à chasse fixe, une identité 3D spatiale et une grille de projets pour une narration privilégiant l’exécution locale.
Modèle officiel
Créations graphiques
Conception d’un shader liquide irisé
Iridescence liquide interactive originale — composition de shader OpenDesign par OpenDesign
Une apparence vive d’huile sur l’eau s’écoule sous une typographie fixe, tandis que des mouvements de pointeur lissés infléchissent un champ de couleurs procédural sans texture.
Modèle officiel
Applications
Application de synthèse des tickets
Synthèse de tickets Linear avec progression du cycle et travail assigné par OpenDesign
Cette conception transforme un résumé quotidien de type Linear en espace de travail de bureau ciblé pour le statut du cycle, les points d'attention et l'historique des tickets.
Modèle officiel
Créations graphiques
Typographie cinétique et globe orbital
Composition de typographie cinétique Charlotte & Vine avec globe orbital par OpenDesign
Un globe filaire en rotation, des orbites imbriquées et une typographie à empattements aux accents rouille forment une étude animée éditoriale et chaleureuse sur la portée internationale.
Modèle officiel
Créations graphiques
Conception d'un digest d'espace de connaissances
Document de digest matinal de type Notion avec modifications, mentions et mises à jour de bases de données par OpenDesign
Un digest matinal daté, dans le style de Notion, sépare les modifications de documents, les mentions directes et les lignes d'état de projet en une séquence compacte pour la revue quotidienne.
Modèle officiel
Créations graphiques
Conception d’un shader de métal liquide
Composition de shader Liquid Metal animée automatiquement par OpenDesign
Un champ de type chrome, en évolution automatique, associe bruit déformé, couleurs irisées et reflets balayants sous une typographie fixe en bas à gauche.
Modèle officiel
Sites web
Design de site web immobilier de luxe
Site marketing immobilier de luxe Velar par OpenDesign
Velar est un design de site web immobilier de luxe qui associe des images d'architecture cinématographiques, une typographie sobre et un parcours éditorial maîtrisé.
Modèle officiel
Sites web
Wireframe de site marketing
Wireframe de landing page marketing Acme avec barre latérale d’annotations par OpenDesign
Un wireframe marketing Acme associe cinq zones de page numérotées à une barre latérale de spécifications, et montre où les notes de conception concordent avec la mise en page implémentée, ou s’en écartent.
Modèle officiel
Applications
Maquette filaire d’application de checkout pour marketplace
Parcours d’achat sur une marketplace en quatre maquettes filaires mobiles distinctes par OpenDesign
Une maquette filaire mobile en quatre écrans relie accueil, navigation, fiche produit et confirmation en un parcours d’achat ciblé.
Modèle officiel
Présentations
Présentation de recherche sur le microbiome
Présentation de réunion de laboratoire sur le microbiote intestinal et le sommeil profond via OpenDesign
L'exemple de recherche en neuf diapositives du Raman Lab combine séparateurs bleu marine, diapositives de preuves crème et réserve causale pour rythmer un argument illustratif sur l'intestin et le sommeil.
Modèle officiel
Applications
Conception d’app d’onboarding pleine conscience
Parcours d’onboarding de pleine conscience Lull sur trois écrans de téléphone par OpenDesign
Cette conception d’app d’onboarding de pleine conscience utilise trois écrans mobiles apaisants pour présenter la pratique de Lull, adapter sa promesse et proposer des choix de compte.
Modèle officiel
Tableaux de bord
Tableau de bord de briefing matinal
Briefing matinal personnel avec notifications groupées par source et priorités de tâches par OpenDesign
Cette conception transforme une journée de travail chargée en un briefing de bureau calme, groupé par source, qui associe tâches prioritaires et contexte des projets, messages et documents.
Modèle officiel
Motion design
Showreel de motion designer
Showreel de motion designer par OpenDesign
Un showreel de 15 secondes à 128 BPM refait en code, avec des coupes de couleur franches, un HUD en direct et sept chapitres calés sur la mesure. Découvrez le rythme, la typographie et la palette.
Modèle officiel
Créations graphiques
Design de cartes sociales motivationnelles
Trois cartes sociales coordonnées sur l'idée d'aller de l'avant et de regarder devant soi par OpenDesign
Trois cartes carrées statiques associent de courtes phrases motivationnelles à des scènes en dégradé, des silhouettes abstraites, des repères numérotés et un traitement serif commun.
Modèle officiel
Créations graphiques
Conception d’un shader de grille néon
Composition shader d'horizon synthwave animée automatiquement par OpenDesign
Un soleil rétro à bandes ancre un horizon violet tandis qu'une grille néon défile au sol, avec un titre fixe et quelques détails de ciel procéduraux.
Modèle officiel
Présentations
Présentation du modèle opérationnel
Support de décision pour la refonte du modèle opérationnel de Meridian Freight via OpenDesign
Meridian Freight transforme un diagnostic de son modèle opérationnel en un support de décision ciblé, reliant pression sur les coûts, choix stratégiques, valeur et feuille de route sur 18 mois.
Modèle officiel
Présentations
Design de présentation de revue opérationnelle
Revue opérationnelle OpenDesign avec réduction du burn et décision BYOK par OpenDesign
Ce design de présentation de revue opérationnelle transforme une décision de pérennité en récit de conseil en six diapositives, associant une recommandation affirmée à des options et arbitrages explicites.
Modèle officiel
Motion design
Animation en papier découpé
Design d’animation en papier découpé par OpenDesign
Un film en papier découpé de 20 secondes transforme une question manuscrite en cinq démonstrations de design, puis les rassemble dans un livre des possibles.
Modèle officiel
Créations graphiques
Design de visualiseur de champ de particules
Visualiseur de champ de particules en Canvas 2D avec Web Worker local et libellés d’exécution par OpenDesign
Un champ dense de points verts s’associe à un titre sur le calcul hors du thread principal, avec des libellés de nombre de particules, de transport et de rendu local sur un canevas quasi noir.
Modèle officiel
Créations graphiques
Design de shader de galaxie de particules
Composition de galaxie WebGL2 de 50000 points, animée automatiquement par OpenDesign
Trois bras spiraux discrets évoluent sur un canevas WebGL2 sombre, sous une typographie fixe, avec des nombres de points et d’appels de dessin définis dans le code source et un affichage local des FPS.
Modèle officiel
Créations graphiques
Affiche animée en sprites pixel art
Affiche éditoriale animée en sprites pixel art sur l'année 1889, inspirée de Nintendo par OpenDesign
Une affiche éditoriale animée sur fond crème associe une carte à fleur en pixel art, une typographie 1889 surdimensionnée, un lettrage japonais animé et une frise chronologique défilante.
Modèle officiel
Sites web
Conception de site produit Pomodoro
Landing page desktop du produit Pomodoro Tomato par OpenDesign
Une landing page Tomato sobre cadre des cycles de travail de 25 minutes grâce à une typographie retenue, des sections centrées sur les bénéfices et un appel à l'action direct, de l'usage individuel à l'équipe.
Modèle officiel
Créations graphiques
Conception d’e-mail de lancement de produit
Conception d’e-mail de lancement de produit par OpenDesign
Un e-mail de lancement de sneakers associe une illustration produit orange, une typographie surdimensionnée, une seule action d’achat et quatre caractéristiques sur un canevas crème étroit.
Modèle officiel
Motion design
Design de vidéo animée de lancement de produit
Design de vidéo animée de lancement de produit par OpenDesign
Un film de lancement OpenDesign de 37 secondes évolue d’une ouverture picturale vers des exemples de design denses et une typographie cinétique, avant une conclusion sobre sur le logo.
Projet officiel
Motion design
Motion design promo produit
Motion design promo produit par OpenDesign
Une promo de 15 secondes passe d'une mascotte en demi-teinte et de cartes produit à un paiement mis en scène, puis résout son message dans le logotype Pennyflow.
Modèle officiel
Sites web
Conception de site web pour liste d’attente produit
Page de liste d’attente « bientôt disponible » de Meridian avec illustration géométrique de spirales et de grille, et un bandeau défilant animé par OpenDesign
Meridian associe un message de lancement surdimensionné, un formulaire d’inscription compact et un bandeau « Coming Soon » en boucle pour donner à sa page de liste d’attente une identité de lancement distincte.
Modèle officiel
Créations graphiques
Conception de rapport financier trimestriel
Rapport financier du T3 de Northwind avec données de chiffre d'affaires, de coûts et de compte de résultat par OpenDesign
Cette conception de rapport financier trimestriel transforme des données financières illustratives en un récit d'une seule page reliant KPI clés, comparaisons, comptes clients et perspectives.
Modèle officiel
Tableaux de bord
Conception de tableau de bord OKR trimestriel
Tableau de bord OKR trimestriel de Northwind avec responsables des résultats clés et points bloquants par OpenDesign
Ce tableau de bord OKR trimestriel regroupe objectifs, responsables, avancement des résultats clés et un point bloquant d’effectifs, pour lire l’état de livraison à côté d’une décision.
Modèle officiel
Créations graphiques
Conception de carte de citation à partager
Carte typographique de citation avec identité d'auteur pour les réseaux sociaux via OpenDesign
Une citation en chinois avec des noms de technologies en caractères latins, des accents dorés et une mention d'auteur visible occupe un canevas éditorial sombre quadrillé.
Modèle officiel
Créations graphiques
Design de shader : sculpture en raymarching
Sculpture WebGL2 à champ de distance signé, animée automatiquement par OpenDesign
Cinq formes de champ de distance, fondues en douceur, orbitent sur un fond bleu marine, avec ombres douces, contours lumineux, orbite lente et automatique de la caméra et typographie fixe.
Modèle officiel
Tableaux de bord
Conception d’un tableau de bord d’analyse des relations
Tableau de bord d’analyse des relations avec contacts mutuels et tendances du taux de match par OpenDesign
Ce tableau de bord d’analyse des relations transforme des exemples de signaux (contacts mutuels, communautés, taux de match) en un espace de travail desktop lisible pour comparer l’état actuel aux tendances récentes.
Modèle officiel
Tableaux de bord
Conception d’un tableau de bord de métriques de dépôt
Tableau de bord de métriques de dépôt OpenDesign avec étoiles, activité et contributeurs par OpenDesign
Ce tableau de bord transforme des signaux de dépôt d’exemple en espace de travail sur ordinateur lisible pour comparer la croissance, la participation et le travail récent.
Modèle officiel
Sites web
Design de site de tarification SaaS
Page de comparaison des tarifs SaaS Filebase et d'aide à la décision d'achat par OpenDesign
Ce design de site de tarification SaaS transforme le choix d'une offre en parcours d'achat lisible, avec options de facturation, détail des offres, lignes de comparaison et questions ciblées.
Modèle officiel
Tableaux de bord
Tableau de bord de revenus SaaS
Vue d'ensemble de l'analyse des revenus SaaS Pulse par OpenDesign
Cette conception de tableau de bord de revenus SaaS réunit en une seule vue les métriques d'abonnement, un graphique de revenus sur 30 jours, les statuts de comptes et les événements récents.
Modèle officiel
Sites web
Conception de site web de runbook de service
Runbook opérationnel du service d'identité Northwind par OpenDesign
Le design du runbook d'auth-service réunit responsabilité du service, réponse aux alertes, procédures de déploiement et passations d'incident dans une seule référence opérationnelle facile à parcourir.
Modèle officiel
Tableaux de bord
Conception de tableau de bord d’audience sociale
Tableau de bord d’analyse sociale X d’OpenDesign avec croissance des abonnés et géographie de l’audience par OpenDesign
Ce tableau de bord d’audience sociale réunit la croissance sur X, la géographie de l’audience, les signaux de publication et les retours de la communauté dans un espace de travail desktop facile à parcourir.
Modèle officiel
Créations graphiques
Design d’affiche de lancement logiciel
Affiche bilingue de lancement produit HTML Anything via OpenDesign
Une affiche verticale de lancement logiciel associe un lettrage blanc et doré surdimensionné, quatre promesses fonctionnelles, un dégradé du chaud au violet et des indices techniques en pied de page.
Modèle officiel
Applications
Design d'application de tableau de sprint
Tableau de sprint de la Northwind Growth Squad avec barre latérale de charge de travail et de Sprint Pulse par OpenDesign
Le design d'application Northwind Sprint Board réunit l'état du sprint, les responsables des tickets, les estimations et les blocages dans un espace de travail desktop lisible d'un coup d'œil.
Modèle officiel
Tableaux de bord
Wireframe de tableau de bord d’examens étudiants
Tableau de bord d’examens étudiants Zentou AI traité en wireframe dessiné à la main par OpenDesign
Ce wireframe de tableau de bord d’examens étudiants organise des scores, une progression, des matières et des prochaines étapes d’exemple dans une vue d’étude de bureau esquissée.
Modèle officiel
Créations graphiques
Conception de facture de studio
Facture client Sable Studio avec lignes de détail, totaux et instructions de paiement par OpenDesign
Cette facture de studio organise en un seul long document client le périmètre du projet, les honoraires détaillés, les conditions de paiement, les ajustements et les notes de règlement.
Modèle officiel
Créations graphiques
Design de notes de réunion d’équipe
Document de réunion hebdomadaire de la Growth Squad avec décisions et actions à mener par OpenDesign
Ce design transforme l’ordre du jour hebdomadaire de la Growth Squad en compte rendu lisible : horaires, décisions, responsabilités, questions ouvertes et prochaine réunion.
Modèle officiel
Tableaux de bord
Design de tableau de bord des opérations d’équipe
Tableau de bord d’équipe FlowAI avec tableau des membres, graphiques par rôle et onglets d’activité par OpenDesign
Le tableau de bord d’équipe FlowAI réunit statut des membres, répartition des rôles, tendances d’activité et signaux de risque dans un espace de travail desktop ciblé.
Modèle officiel
Tableaux de bord
Conception d'un tableau de bord d'espace de travail d'équipe
Tableau de bord d'espace de travail d'équipe Acme, de style Notion, avec tâches et synthèses de projets par OpenDesign
Ce tableau de bord d'espace de travail d'équipe réunit statut des tâches, activité, volume hebdomadaire et signaux de relecture dans une vue de bureau facile à parcourir.
Modèle officiel
Sites web
Conception de site web de rédaction technique
Site marketing de l'espace de rédaction technique Quartz via OpenDesign
Quartz est une conception de site web de rédaction technique qui transforme un concept d'espace éditorial en parcours ciblé, de la rédaction à la publication.
Modèle officiel
Tableaux de bord
Tableau de bord de simulateur de trading
Tableau de bord de simulateur de risque et d'exécution de trading avec graphiques explicatifs par OpenDesign
Cette conception de tableau de bord réunit signaux, contexte de chaîne d'options, états d'exécution et graphiques de risque dans un seul espace de simulation à examiner.
Modèle officiel
Motion design
Design d'animation de morphing d'interface
Design d'animation de morphing d'interface par OpenDesign
Un film de 14 secondes entièrement en code où une forme se transforme en lecteur, onglets et palette de commandes, chaque changement étant provoqué par un curseur à 120 BPM.
Modèle officiel
Motion design
Vidéo animée de réinitialisation d'usage
Vidéo animée de réinitialisation d'usage par OpenDesign
Une vidéo animée carrée de six secondes dans OpenDesign associe un anneau de repères radiaux à deux barres de progression légendées, puis se fige sur un état terminé en vert.
Projet officiel
Créations graphiques
Design de shader Voronoï
Composition de cellules de Voronoï en WebGL2, réactive au curseur par OpenDesign
Des cellules colorées irrégulières dérivent sur un canevas WebGL2, avec des contours pâles lumineux, une distorsion lissée au pointeur et une typographie fixe surdimensionnée.
Modèle officielAucun projet ne correspond à ces filtres
Effacez les filtres pour voir tous les projets ou parcourez un autre type de création.
La pagination remplace le défilement infini afin que chaque projet reste accessible au clavier et aux robots d’exploration.
Communauté
Revisitez le hackathon et comparez les modèles
Un hackathon communautaire qui vient de se terminer et une série d’évaluations où dix modèles ont répondu aux mêmes briefs.
Hackathon de design produit
Terminé · 18 sept. 2026- Dates
- 9–18 sept.
- Récompenses
- Les 10 premiers + les 50 premiers participants
- Exemples
- 5
Les designers ont publié sur X des produits créés avec OpenDesign, avec une publication et un lien communautaire par participation. Les participations ont été classées selon le nombre de mentions J’aime.
- Kimi Careers
- Life System
- Agent-Native Workspace
- Tom Goodman
- Maya Rowan
LLM Arena sept. 2026
Notes sur la série- Modèles
- 10
- Briefs communs
- 6
- Exemples de design
- 14
Six briefs, chacun traité par deux modèles. Chaque page indique le modèle et la tâche, pour comparer les réponses côte à côte.
- Claude Opus 5
- GPT 5.6 Sol
- DeepSeek V4.1 Flash
- Qwen 3.8 Max
- Grok 4.6
- GPT Astra
- GPT 6 Astra
- Claude Fable 5.1
- GPT 6 Sol
- Claude Opus 5.5
Comment créer des exemples de design IA dans OpenDesign
Partez d’un exemple de design proche de votre idée
Filtrez les exemples de design ci-dessus par type de résultat et ouvrez-en un qui se rapproche de ce que vous souhaitez créer. Lisez son brief, découvrez le modèle utilisé et les choix de mise en page expliqués, puis notez ce que vous garderiez et ce que vous changeriez.
Rédigez le brief avant de demander une proposition visuelle
Indiquez le type de résultat, les écrans ou les sections, le contenu d’exemple et l’interaction essentielle. Précisez quelles informations sont réelles et lesquelles sont des espaces réservés, afin que le design n’invente pas de faits.
Prompt suggéréCrée un design de site web pour une boulangerie de quartier fictive. Ajoute une section principale avec les fournées du jour, un menu réparti entre matin et après-midi, les horaires d’ouverture et un formulaire de précommande avec des champs réservés clairement indiqués. Garde une navigation explicite, crée tous les titres sous forme de texte réel et prévois une mise en page mobile lisible.
Choisissez un modèle ou comparez-en deux
Choisissez le modèle auquel vous faites confiance pour la mise en page et les textes. Pour voir comment deux modèles traitent le même brief, lancez-le dans LLM Arena d’abord, comme l’ont fait les exemples de design de l’Arena sur cette page.
Affinez une section avant de travailler sur toute la page
Demandez des modifications section par section : hiérarchie, espacements, états et texte. Vérifiez la mise en page sur mobile et l’affichage avec réduction des animations avant d’étendre un effet à toute la page.
Exportez et obtenez un lien de partage
Exportez le design final au format HTML, puis utilisez Partager dans OpenDesign pour obtenir un lien. Ouvrez-le dans une fenêtre de navigateur distincte et vérifiez que la version souhaitée et ses ressources se chargent avant de l’envoyer.
Pour commencer
Créez vous-même le prochain exemple
Gratuit, open source et exécuté sur votre propre machine avec vos propres clés. Apportez un brief, choisissez un modèle et créez un site web, une application, un tableau de bord ou une présentation à partager.
Versions pour macOS et Windows. Gratuit et open source sous licence Apache-2.0.
