mpcsample/index.html at main · WorldLinkStudio/mpcsample · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />

    <!-- Primary Meta Tags -->
    <title>MPC Sample — Akai MPC Kit Builder &amp; Sample Manager</title>
    <meta name="title" content="MPC Sample — Akai MPC Kit Builder &amp; Sample Manager" />
    <meta
      name="description"
      content="Build and manage Akai MPC drum kits in your browser or desktop. Load existing MPC projects, preview samples on a 16-pad layout, rearrange pads, and export ready-to-use .xpj project files directly to your MPC hardware or SD card."
    />
    <meta
      name="keywords"
      content="mpc sample, akai mpc, drum kit builder, mpc project, xpj file, sample manager, beat making, drum machine, mpc beats, akai mpc one, mpc live, mpc x, drum pad, sample packs, mpc workflow, mpc kit, akai drum machine, beat producer, hip hop beats, drum samples"
    />
    <meta name="author" content="MPC Sample" />
    <meta name="robots" content="index, follow" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <link rel="canonical" href="https://mpcsample.app/" />

    <!-- Open Graph / Facebook / Discord / LinkedIn -->
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://mpcsample.app/" />
    <meta property="og:site_name" content="MPC Sample" />
    <meta property="og:title" content="MPC Sample — Akai MPC Kit Builder &amp; Sample Manager" />
    <meta
      property="og:description"
      content="Build and manage Akai MPC drum kits in your browser or desktop. Load existing MPC projects, preview samples on a 16-pad layout, rearrange pads, and export ready-to-use .xpj project files directly to your MPC hardware or SD card."
    />
    <meta property="og:image" content="https://mpcsample.app/demo.jpg" />
    <meta property="og:image:secure_url" content="https://mpcsample.app/demo.jpg" />
    <meta property="og:image:type" content="image/jpeg" />
    <meta property="og:image:width" content="599" />
    <meta property="og:image:height" content="599" />
    <meta
      property="og:image:alt"
      content="MPC Sample app — 16-pad drum kit layout with sample assignments and waveform preview"
    />
    <meta property="og:locale" content="en_US" />

    <!-- Twitter / X Card -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@mpcsample" />
    <meta name="twitter:creator" content="@mpcsample" />
    <meta name="twitter:url" content="https://mpcsample.app/" />
    <meta name="twitter:title" content="MPC Sample — Akai MPC Kit Builder &amp; Sample Manager" />
    <meta
      name="twitter:description"
      content="Build and manage Akai MPC drum kits in your browser or desktop. Load existing MPC projects, preview samples on a 16-pad layout, rearrange pads, and export ready-to-use .xpj project files."
    />
    <meta name="twitter:image" content="https://mpcsample.app/demo.jpg" />
    <meta
      name="twitter:image:alt"
      content="MPC Sample app — 16-pad drum kit layout with sample assignments and waveform preview"
    />

    <!-- Theme / Browser Chrome -->
    <meta name="theme-color" content="#0e1626" />
    <meta name="msapplication-TileColor" content="#0e1626" />
    <meta name="msapplication-config" content="/favicon/browserconfig.xml" />
    <meta name="color-scheme" content="dark" />

    <!-- Favicons & PWA Manifest -->
    <link rel="icon" type="image/x-icon" href="/favicon/favicon.ico" />
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png" />
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png" />
    <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png" />
    <link rel="manifest" href="/favicon/site.webmanifest" />

    <!-- JSON-LD Structured Data -->
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "WebApplication",
        "name": "MPC Sample",
        "url": "https://mpcsample.app",
        "description": "Build and manage Akai MPC drum kits in your browser or desktop. Load existing MPC projects, preview samples on a 16-pad layout, rearrange pads, and export ready-to-use .xpj project files directly to your MPC hardware or SD card.",
        "applicationCategory": "MusicApplication",
        "operatingSystem": ["Web", "macOS"],
        "browserRequirements": "Requires a modern browser with Web Audio API support",
        "inLanguage": "en",
        "isAccessibleForFree": true,
        "offers": {
          "@type": "Offer",
          "price": "0",
          "priceCurrency": "USD"
        },
        "screenshot": {
          "@type": "ImageObject",
          "url": "https://mpcsample.app/demo.jpg",
          "width": 599,
          "height": 599
        },
        "featureList": [
          "Load and preview Akai MPC drum kits",
          "16-pad sample layout with bank switching",
          "Drag and drop pad rearrangement",
          "Export .xpj project files for MPC hardware",
          "SD card workflow support",
          "Waveform and FFT visualisation",
          "Browser and native macOS desktop app"
        ],
        "keywords": "mpc sample, akai mpc, drum kit, beat making, sample manager, xpj, drum machine",
        "creator": {
          "@type": "Organization",
          "name": "MPC Sample",
          "url": "https://mpcsample.app"
        }
      }
    </script>

    <!-- Fonts -->
    <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=Bebas+Neue&family=Barlow+Condensed:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&family=Antonio:wght@500;600;700&display=swap"
      rel="stylesheet"
    />
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>