OD / 2026 · Vol. 01 / Editie Nº 26 Categorie Design · Intelligentie Apache-2.0 · Made on Earth Live · v0.8.0
NL
Open Design
DownloadStar · 53.4K
Templates · Prototype

59 Prototype.

Interactive product mockups — dashboards, apps, landing pages, internal tools. Anything you’d hand a stakeholder and click through.

Type artefact
Scène
  1. 001 Blogpost Lang artikel / blogpost — met masthead, hero-afbeelding placeholder, artikeltekst met figuren en pull quotes, auteurssignatuur, gerelateerde posts. Gebruik wanneer de briefing vraagt om 'blog', 'artikel', 'post', 'essay' of 'case study'. prototype marketing
  2. 002 Klinisch casus rapport Gestructureerde medische casuspresentatie voor rondes, conferenties en documentatie. Genereert rapporten in SOAP-formaat of narratieve vorm met fysiologisch nauwkeurige vitale functies, laboratoriumwaarden en evidence-based behandelplannen. prototype Zorg
  3. 003 Codex interactieve capaciteitenkaart Zet een lang artikel, thread, memo of productbeschrijving om in een klikbare capaciteitenkaart in Codex-stijl met workflow-loop, use-case-matrix en responsief detailpaneel. prototype Kennis
  4. 004 Critique Voert een 5-dimensionale expertdesignbeoordeling uit op elk HTML-artefact in het project — Filosofie/Visuele hiërarchie/Details/Functionaliteit/Innovatie, elk gescoord van 0-10. Genereert een zelfstandig HTML-rapport met radardiagram, onderbouwde scores en drie lijsten: Behouden/Repareren/Snelle winsten. prototype design
  5. 005 Dashboard Admin-/analysedashboard in één HTML-bestand. Vaste linkerzijbalk, bovenbalk met gebruiker/zoeken, hoofdraster met KPI-kaarten en grafieken. Gebruik voor 'dashboard', 'admin', 'analytics' of 'configuratiescherm'. prototype operaties
  6. 006 Datavisualisatierapport Zet CSV-, Excel- of JSON-gegevens om in een gepolijste visuele rapportpagina. prototype financien
  7. 007 Dating Web Consumentgericht dating/matchmaking dashboard met linker railnavigatie, tickerbar met gemeenschapssignalen, hoofd-KPI's, 30-daagse staafdiagram voor wederzijdse matches en matchrate-trendblok. Redactionele typografie met ingetogen accent. Geschikt voor datingsites, matchmaking, gemeenschapsdashboards of sociale netwerken. prototype persoonlijk
  8. 008 DCF-waardering Geactualiseerde cashflowwaardering en intrinsieke waarde-analyse voor beursgenoteerde bedrijven. Voor DCF, reële waarde, intrinsieke waarde, koersdoel en onder/overwaarderingsanalyses. prototype design
  9. 009 Apparaat 3D-showcase Statische iPhone en MacBook 3D-showcase met echte HTML ingebed op schermen, glaslensrefractie en 360-graden draaitafelcompositie. prototype product
  10. 010 Digitale gids Voorbeeld van een digitale gids met twee pagina's — pagina 1 is een cover (titel, auteur, 'Wat zit erin'-statistieken, inhoudsopgave-teaser); pagina 2 is een spread (les met pull-quote en stappenlijst). Lifestyle- / creatormerk-toon. Gebruik bij verzoeken om 'e-guide', 'digitale gids', 'lookbook', 'lead magnet', 'creator guide', 'playbook', 'PDF-gids' of '电子指南'. prototype marketing
  11. 011 Documentatiepagina Een documentatiepagina met zijnavigatie, scrollbare artikelinhoud en inhoudsopgave. Gebruik bij vermelding van 'documentatie', 'handleiding', 'API-referentie' of 'tutorial'. prototype Engineering
  12. 012 E-mailmarketing E-mailtemplate voor productlancering met masthead, hero-afbeelding, cursieve kop, hoofdtekst, primaire CTA en specificatieraster in gecentreerde HTML-layout met enkele kolom. prototype marketing
  13. 013 Engineering-runbook Een engineering-runbook — serviceoverzicht, waarschuwingentabel, dashboardlinks, veelvoorkomende procedures met kopieerbare commando's, on-callrooster en incident-responsechecklist. Gebruik voor runbooks, ops-docs, on-callgidsen, SRE-docs of 运维手册. prototype Engineering
  14. 014 Financieel rapport Kwartaal-/maandelijks financieel rapport met KPI-koptekst, omzet- en burngrafieken, P&L-samenvattingstabel, belangrijkste punten en vooruitzichtenparagraaf. Gebruik wanneer de brief 'financieel rapport', 'Q3-rapport', 'MRR-review', 'P&L' of '财报' noemt. prototype financien
  15. 015 Flowai live dashboardsjabloon Teambeheerdashboard in FlowAI-stijl met drie tabbladen (Teamleden, Teamdetails, Activiteitenlog), KPI-statistiekrij, ledentabel, staafdiagram rolenverdeling, sparklines voor online aanwezigheid en activiteit, en toppbijdragers-panel. Ondersteunt licht/donker thema, grafiektooltips, klikzoom en CSV-export. prototype operaties
  16. 016 Gamified app Drieframe prototype van een gamified mobiele app: cover, dagelijkse quests met XP-linten en level-balk, questdetails. Geschikt voor gamified apps, habit trackers, RPG-stijl levensapps, level-up apps, dagelijkse quests en XP/streak-apps. prototype persoonlijk
  17. 017 GitHub Dashboard GitHub repository-analysedashboard — sterren, forks, bijdragers, issues, pull requests, recente activiteit en topbijdragers. Gebruik voor GitHub repository-dashboard, open-source groeirapport, repository-gezondheidspagina of GitHub-analyseweergave. prototype Operatie
  18. 018 HR-onboarding Onboardingplan voor nieuwe medewerkers op één pagina — schema eerste week, buddy + manager introductie, leertraject, apparatuur checklist en 'je bent klaar wanneer…'-doelen. Gebruik wanneer de brief 'onboarding', 'nieuwe medewerker', 'eerste week plan' of '入职' noemt. prototype HR
  19. 019 Html Ppt Taste Brutalist 16:9 HTML-deck in tactical-telemetry / CRT-terminal stijl. Gedeactiveerde CRT-houtskool slides, wit-fosfor monospace, gevaar-rood accent, scanline overlay, ASCII-syntaxis, dichtheid boven decoratie. Gedistilleerd uit Leonxlnx/taste-skill `brutalist-skill` (Tactical Telemetry-modus). prototype design
  20. 020 Html Ppt Taste Editorial 16:9 HTML-presentatie in editorial-minimalistische stijl. Warme crèmekleurige slides, schreefletters voor koppen + grotesk voor body, haarlijnen, monospace metadata, ruime witruimte, één accent. Gedistilleerd uit Leonxlnx/taste-skill `minimalist-skill`. prototype design
  21. 021 Factuur Een afdrukbare factuurpagina — blok met verzender + ontvanger, regelitemtabel, belastingspecificatie, totalen en betaalinstructies. Gebruik bij vermeldingen van 'invoice', 'bill', 'billing statement' of '发票'. prototype financien
  22. 022 Kami Landing Produceert een afdrukbaar document van één pagina — warm perkamentcanvas, inktblauw accent, schreef in één gewicht, geen cursief, geen koele grijstinten. De output leest als een professionele white paper of studio one-pager, geen app-UI. Meertalig ontwerp (EN · zh-CN · ja). Eén zelfstandig HTML-bestand, geen afhankelijkheden. prototype marketing
  23. 023 Kami perkamentdocument Warm perkamenten canvas (#f5f4ed), monochroom inktblauw accent (#1B365D), één schreefloos lettertype en typografie van redactionele kwaliteit. prototype persoonlijk
  24. 024 Kanbanbord Kanban- / takenbord met kolommen (To do / In progress / In review / Done), versleepbare kaarten, avatars van toegewezenen, swimlanes en een bovenste filterbalk. Gebruik wanneer de brief 'kanban', 'task board', 'sprint board', 'trello' of '看板' noemt. prototype operaties
  25. 025 Laatste 30 dagen Onderzoek naar community- en sociale trends van de afgelopen 30 dagen. Gebruik wanneer u wilt weten wat mensen nu zeggen, recent sentiment, reacties van de community, sociaal bewijs, lanceringsreacties, trendscan of context van de laatste 30 dagen. prototype design
  26. 026 Tijdschriftartikel Magazine-artikelindeling geïnspireerd door Huashu / huashu-md-html om Markdown of notities om te zetten in een gepolijst long-form HTML-essay. prototype marketing
  27. 027 Tijdschriftposter Redactionele poster in krantstijl met krantenpapier, datumlijn, grote schreeftitel met doorhaling en cursief, tekstblok in 2 kolommen en 6 genummerde secties met geannoteerde citaten. Geschikt voor tijdschriftposters, redactionele layouts, krantstijl of manifesten. prototype marketing
  28. 028 Marketingposter Verticale poster of Stories-stijl deelafbeelding met sterke visuele impact. prototype marketing
  29. 029 Vergadernotities Vergadernotities-pagina — titelbalk met deelnemers, agenda-checklist, besluitenblok, actietabel met eigenaren en datums, en footer voor de volgende vergadering. Gebruik bij vermeldingen van 'vergadernotities', 'notulen', '1:1-notities', 'all-hands-samenvatting' of '会议纪要'. prototype operaties
  30. 030 Mobiele app Een mobiele-appscherm gerenderd in een pixelnauwkeurig iPhone 15 Pro-frame op de pagina. Gemaakt door het seed-bestand assets/template.html te kopiëren en één schermarchetype uit references/layouts.md te plakken. Gebruik wanneer de briefing vraagt om 'mobiele app', 'iOS-app', 'Android-app', 'telefoonscherm' of 'app-UI'. prototype design
  31. 031 Mobiele onboarding Een meerschermige mobiele onboarding-flow weergegeven als drie telefoonframes naast elkaar — splash, waardepropositie, inloggen. Statusbalk, swipe-dots, primaire CTA. Gebruik wanneer de brief verwijst naar 'mobiele onboarding', 'iOS onboarding', 'telefoonaanmelding' of '移动端引导'. prototype design
  32. 032 Modern CV Modern minimalistisch CV, enkele A4-pagina, klaar voor afdrukken of PDF-export. prototype persoonlijk
  33. 033 Motion Frames Single-frame motion-design compositie met loopende CSS-animaties — roterende tekstcirkel, geanimeerde globe, timer, parallax labels. Rendert als hero video poster voor HyperFrames of elke keyframe-gebaseerde exporter. Ideaal voor motion design, geanimeerde hero's, loops, video posters en titelkaarten. prototype marketing
  34. 034 Open Design Landing-pagina Maakt een editorial landingspagina met één pagina in de visuele taal van Atelier Zero (Monocle / Apartamento / Études redactionele collage). Vult inputs.json vanuit een merkbrief, genereert optioneel 16 collage-assets via gpt-image-2 en levert een zelfstandig HTML-bestand met scroll-animaties en vaste navigatie. prototype marketing
  35. 035 Orbit Algemeen Wordt automatisch geactiveerd door Orbit wanneer twee of meer connectoren zijn verbonden. Verzamelt activiteiten van de afgelopen 24 uur van alle geauthenticeerde connectoren (GitHub, Linear, Notion, Slack, 飞书, Agenda, Gmail, Drive, Sentry, Vercel, enz.) en genereert een adaptief bento-grid dashboard bovenaan "我的设计". Wordt automatisch uitgevoerd door de dagelijkse digest-scheduler van Orbit. prototype Orbit
  36. 036 Orbit Github Orbit-vaardigheid voor het automatisch genereren van dagelijkse samenvattingen op basis van GitHub-verbindingen. Haalt PR's, beoordelingsverzoeken, issues, CI-runs en merges van de afgelopen 24 uur op en toont ze in de stijl van native GitHub-notificaties. Wordt automatisch aangeroepen door de Orbit dagelijkse samenvattingsplanner. prototype Orbit
  37. 037 Orbit Gmail Haalt inbox-activiteit van de afgelopen 24 uur op en genereert een dagelijkse samenvatting wanneer Gmail de enige verbonden service is of expliciet geselecteerd. Wordt automatisch geactiveerd door de Orbit-planner en hoeft niet handmatig te worden uitgevoerd. prototype Orbit
  38. 038 Orbit Linear Wordt automatisch geactiveerd door de Orbit-pipeline wanneer Linear de enige verbonden connector van de gebruiker is of wanneer de gebruiker hun dagelijkse digest expliciet beperkt tot Linear. Haalt de afgelopen 24 uur aan issue-bewegingen, statuswijzigingen, toewijzingen en cyclus-voortgang op en rendert dit in Linear's native inbox visuele taal. prototype Orbit
  39. 039 Orbit Notion Open Orbit briefing-vaardigheid — geselecteerd door de Orbit-pipeline wanneer Notion de enige verbonden connector van de gebruiker is of wanneer de gebruiker hun dagelijkse digest expliciet beperkt tot Notion. Haalt de documentbewerkingen, opmerkingen, vermeldingen en databaserijwijzigingen van de afgelopen 24 uur op uit de geauthenticeerde Notion-verbinding van de gebruiker en rendert de digest als een native Notion-pagina (callout/toggle/databasetabel-elementen). Deze vaardigheid mag niet handmatig worden geactiveerd — het wordt aangeroepen door de dagelijkse digest-scheduler van Orbit tegen live Notion-gegevens. prototype Orbit
  40. 040 Productspecificatie Productspecificatie/PRD op één pagina — probleem, succesmetrics, scope, user stories, ontwerpnotities, uitrolplan, openstaande vragen. Voor productspecificaties en feature briefs. prototype product
  41. 041 Prijzenpagina Een standalone prijzenpagina — header, abonnementsniveaus, functievergelijkingstabel en FAQ. Gebruik wanneer de briefing vraagt om 'prijzen', 'abonnementen', 'abonnementsniveaus' of een 'vergelijk abonnementen'-pagina. prototype Verkoop
  42. 042 Reddit-postkaart Realistische Reddit-postkaart met stembalk en aantal reacties, geschikt voor video-overlays of het delen van stories. prototype marketing
  43. 043 SaaS Landing Eénpagina SaaS-landingspagina met hero, functies, social proof, prijzen en CTA. Respecteert de actieve DESIGN.md kleur-/typografie-/layout-tokens. Triggerwoorden: "saas landing", "marketing page", "product landing". prototype marketing
  44. 044 Sociale Carousel Een driekaarten social media-carousel met 1080×1080 vierkanten – drie filmische, merkconforme panelen met display-koppen die over de serie heen verbonden zijn ('voorwaarts.' → 'naar de volgende.' → 'vooruitkijkend.'). Elke kaart heeft een merkteken, nummer/totaal, bijschrift en een 'loop'-affordance. Gebruik wanneer de briefing vraagt om 'carrouselpost', 'sociale carousel', 'Instagram-carousel', 'LinkedIn-serie', 'X-thread-kaarten' of '三连发'. prototype marketing
  45. 045 Social media dashboard Social media analytics dashboard voor makers in één HTML-bestand. Met platformwisselaar (X / LinkedIn / YouTube / Instagram), KPI-kaarten (volgers, betrokkenheidspercentage, likes, reposts), volgersgroei-grafiek, top post van de week preview en zijpaneel met trending onderwerpen/topcommentaren. prototype Maker
  46. 046 Spotify Nu-Afspelen Kaart Spotify-afspeelkaart met albumhoes, voortgangsbalk en afspeelbediening, geschikt voor video-overlays of persoonlijke homepages. prototype persoonlijk
  47. 047 Sprite-animatie Geanimeerde uitlegslide in pixel-art-stijl met crèmekleurige achtergrond, vetgedrukt jaar, geanimeerde pixel-art-mascotte (Hanafuda-kaart, paddenstoel of 8-bit-console), kinetische Japanse typografie en tijdlijnlint. Pure CSS-animatie, klaar voor opname als verticale video. prototype marketing
  48. 048 Team-OKR's OKR-trackerpagina met kwartaalbanner, drie doelstellingen met hun key results als voortgangsbalken, eigenaar-avatars, statuspillen en een zijbalk 'dit kwartaal in één oogopslag'. Gebruik wanneer de brief OKR's, key results, doelstellingen of 目标 noemt. prototype product
  49. 049 Tweaks Voegt een live controlepaneel toe aan elk HTML-element om accentkleur, typografische schaal, dichtheid, beweging en thema aan te passen. Wijzigingen worden direct toegepast op aangepaste CSS-eigenschappen en opgeslagen in localStorage. prototype design
  50. 050 Twitter-deelkaart Twitter-citaat- of datakaart ontworpen om te combineren met een bericht. prototype marketing
  51. 051 Wachtlijstpagina Minimalistische pre-launch landingspagina met e-mailcaptuur, merklogo en optionele decoratieve laag. Leest kleuren, typografie en lay-outregels uit DESIGN.md. Ideaal voor productlanceringen, bèta-aanmeldingen, vroege toegangsprogramma's en indie-projecten. prototype marketing
  52. 052 Webprototype Algemeen desktop webprototype. Zelfstandig HTML-bestand gemaakt door `assets/template.html` te kopiëren en lay-outs uit `references/layouts.md` te plakken. Standaard voor landingspagina's, marketing, documentatie of SaaS-pagina's. prototype design
  53. 053 Web Prototype Taste Brutalist Webprototype in Zwitserse industriële drukkenstijl. Krantenpapierdoek, monolithisch zwart groteskschrift, viewport-overlopende cijfers, haardunne rasterscheidingen, gevarenrood accent, ASCII-syntaxdecoratie. Gedistilleerd uit Leonxlnx/taste-skill `brutalist-skill` (Zwitserse industriële drukmodus). prototype design
  54. 054 Web Prototype Taste Editorial Redactioneel-minimalistisch webprototype. Warm monochroom canvas, serif titels + grotesk body, 1px haarlijnen, gedempte pastelchips, royale witruimte, subtiele micro-bewegingen. prototype design
  55. 055 Web Prototype Taste Soft Zacht webprototype van Apple-niveau. Zilver/crème canvas, dubbele rand kaarten, geneste knop-CTAs, ruime squircle-stralen, verende beweging en ambient mesh. Gebaseerd op soft-skill van Leonxlnx/taste-skill en secties 4–8. prototype design
  56. 056 Wireframe Schets Handgetekend wireframe met ruitjespapier achtergrond, marker-/potloodtoon, meerdere tabbladen, plaknotities en geschetste grafieken. Ideaal voor verzoeken naar wireframe, sketch, lo-fi of whiteboard. prototype design
  57. 057 X / Twitter berichtkaart Realistische X-berichtkaart met betrokkenheidsstatistieken (likes, reposts, weergaven), geschikt voor video-overlays of deelbare afbeeldingskaarten. prototype marketing
  58. 058 X Research X/Twitter-sentimentonderzoek naar markten, bedrijven, producten of gemeenschappen. Gebruik dit om publieke opinie, expertposts of sociale reacties op aandelen, sectoren, bedrijven, producten of marktgebeurtenissen te analyseren. prototype design
  59. 059 Xiaohongshu-kaart Kenniskaarten in Xiaohongshu-stijl, gerangschikt als veegbare carrousel met meerdere kaarten. prototype marketing