Patternflow

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Generative Wall Art & 3D Reliefs | Patternflow — Design Your Own Objet</title>

    <!-- SEO -->
    <meta name="description" content="Patternflow offers an experience of subtraction and discovery. Design unique parametric wall art with our interactive generative tool. Where noise becomes form.">
    <meta name="keywords" content="Generative Wall Art, Parametric Wall Art, Custom 3D Printed Relief, Architectural Wall Sculpture, Interior Objet, New Media Art, Generative Art, Patternflow, Seung Hun Lee, 3D Relief Art, 인테리어 오브제, 거실 그림 액자, 특이한 집들이 선물, 제너레이티브 아트, 3D 프린팅 아트, 이승훈, 패턴플로우, 의미를 찾아가는 시간">
    <meta name="author" content="Seung Hun Lee">
    <link rel="canonical" href="https://origin.patternflow.work">

    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website">
    <meta property="og:url" content="https://origin.patternflow.work/">
    <meta property="og:title" content="Patternflow - Design Your Own Objet">
    <meta property="og:description" content="Patternflow offers an experience of subtraction and discovery. Design unique parametric wall art with our interactive generative tool.">
    <meta property="og:image" content="https://origin.patternflow.work/og-image.jpg">

    <!-- Twitter -->
    <meta property="twitter:card" content="summary_large_image">
    <meta property="twitter:url" content="https://origin.patternflow.work/">
    <meta property="twitter:title" content="Patternflow - Design Your Own Objet">
    <meta property="twitter:description" content="Patternflow offers an experience of subtraction and discovery. Design unique parametric wall art with our interactive generative tool.">
    <meta property="twitter:image" content="https://origin.patternflow.work/og-image.jpg">
    
    <!-- Favicon & Mobile -->
    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
    <link rel="apple-touch-icon" href="/favicon.svg">
    <meta name="theme-color" content="#000000">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

    <!-- Open Graph -->
    <meta property="og:title" content="Patternflow - Time To Find Meaning">
    <meta property="og:description" content="Patternflow offers an experience of subtraction and discovery. Design unique parametric wall art with our interactive generative tool. Where noise becomes form.">
    <meta property="og:image" content="https://origin.patternflow.work/og-image.jpg">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">
    <meta property="og:image:type" content="image/jpeg">
    <meta property="og:url" content="https://origin.patternflow.work">
    <meta property="og:type" content="website">
    <meta property="og:site_name" content="Patternflow">

    <!-- Twitter Card -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Patternflow - Time To Find Meaning">
    <meta name="twitter:description" content="Patternflow offers an experience of subtraction and discovery. Design unique parametric wall art with our interactive generative tool. Where noise becomes form.">
    <meta name="twitter:image" content="https://origin.patternflow.work/og-image.jpg">

    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,400&family=Inter:wght@300;400;500&family=Noto+Sans+KR:wght@300;400;500&family=Noto+Serif+KR:wght@300;400;600&display=swap" rel="stylesheet">
    <style>
      body {
        font-family: 'Inter', 'Noto Sans KR', sans-serif;
        background-color: #050505;
        color: #e5e5e5;
      }
      h1, h2, h3, h4, h5, h6, .font-serif {
        font-family: 'Cormorant Garamond', 'Noto Serif KR', serif;
      }
      /* Custom scrollbar for webkit */
      ::-webkit-scrollbar {
        width: 6px;
      }
      ::-webkit-scrollbar-track {
        background: transparent;
      }
      ::-webkit-scrollbar-thumb {
        background: #333;
        border-radius: 3px;
      }
      ::-webkit-scrollbar-thumb:hover {
        background: #555;
      }
      
      .fade-in-up {
        animation: fadeInUp 1s ease-out forwards;
        opacity: 0;
        transform: translateY(20px);
      }
      
      @keyframes fadeInUp {
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
    </style>
  <script type="importmap">
{
  "imports": {
    "lucide-react": "https://esm.sh/lucide-react@^0.562.0",
    "@react-three/drei": "https://esm.sh/@react-three/drei@^10.7.7",
    "react/": "https://esm.sh/react@^19.2.3/",
    "react": "https://esm.sh/react@^19.2.3",
    "react-dom/": "https://esm.sh/react-dom@^19.2.3/",
    "three": "https://esm.sh/three@^0.182.0",
    "@react-three/fiber": "https://esm.sh/@react-three/fiber@^9.5.0"
  }
}
</script>
    <!-- GEO: JSON-LD Structured Data for AI Agents -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@graph": [
        {
          "@type": "Person",
          "@id": "https://origin.patternflow.work/#artist",
          "name": "Seung Hun Lee",
          "jobTitle": "Media Artist",
          "url": "https://origin.patternflow.work/about",
          "sameAs": [
            "https://lshsprotfolio.netlify.app/en",
            "https://www.threads.com/@patternflow.work"
          ]
        },
        {
          "@type": "WebSite",
          "@id": "https://origin.patternflow.work/#website",
          "url": "https://origin.patternflow.work/",
          "name": "Patternflow",
          "description": "An interactive generative art experience where noise becomes form.",
          "author": {
            "@id": "https://origin.patternflow.work/#artist"
          },
          "inLanguage": ["en", "ko"]
        },
        {
          "@type": "VisualArtwork",
          "@id": "https://origin.patternflow.work/#artwork",
          "name": "Patternflow",
          "creator": {
            "@id": "https://origin.patternflow.work/#artist"
          },
          "artform": "Generative Art",
          "material": "WebGL, Three.js, Interactive Web",
          "description": "A generative artwork that explores the threshold between mathematical noise and legible form. Visitors manipulate wave function density to discover patterns."
        },
        {
          "@type": "WebApplication",
          "@id": "https://origin.patternflow.work/#studio",
          "name": "Patternflow Studio",
          "url": "https://origin.patternflow.work/studio",
          "applicationCategory": "DesignApplication",
          "operatingSystem": "Web Browser",
          "offers": {
            "@type": "Offer",
            "price": "0",
            "priceCurrency": "USD"
          },
          "creator": {
            "@id": "https://origin.patternflow.work/#artist"
          },
          "description": "Interactive generative art tool for creating custom 3D relief patterns. Patternflow offers an experience of subtraction and discovery."
        }
      ]
    }
    </script>
</head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>