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
|
import { Masthead } from "../components/Masthead";
import { Logo } from "../components/Logo";
import { RewriteLink } from "../components/RewriteLink";
export default function HomePage() {
return (
<div className="relative z-10 min-h-screen flex flex-col">
<Masthead showTicker showNav />
<main className="flex-1 p-6 md:p-8">
<section className="grid grid-cols-1 md:grid-cols-[1.1fr_0.9fr] gap-6 items-center mb-8">
<div className="order-2 md:order-1">
<span className="inline-block px-2 py-1 border border-[#3f6fb3] bg-[#0f1c2f] text-[#9bc3ff] font-mono text-xs tracking-wide uppercase mb-3">
Real-time STT Platform
</span>
<h2 className="m-0 mb-3 text-xl text-[#f0f5ff] tracking-wide">
リアルタイム音声認識
</h2>
<p className="my-2 text-[#e4edff]">
Makima provides real-time speech-to-text transcription with speaker
diarization. Stream audio from your microphone or upload files for
instant transcription.
</p>
<p className="my-2 text-[#e4edff]">
高精度なリアルタイム音声認識エンジン。WebSocket
経由でストリーミング処理を行い、話者分離にも対応。
</p>
<div className="flex flex-wrap gap-3 mt-4">
<RewriteLink to="/listen" className="!py-2 !px-3 text-sm">
Start Listening
</RewriteLink>
<RewriteLink href="https://github.com/soryu-co" external className="!py-2 !px-3 text-sm">
GitHub
</RewriteLink>
<RewriteLink href="https://soryu.co" external className="!py-2 !px-3 text-sm">
soryu.co
</RewriteLink>
</div>
</div>
<div className="order-1 md:order-2 flex justify-center">
<Logo size={160} />
</div>
</section>
<div className="panel p-4 md:p-5 relative">
<span className="absolute -top-2.5 left-3 px-1.5 py-0.5 bg-[#0f1c2f] border border-[#3f6fb3] font-mono text-xs tracking-wide">
FEATURES//MAKIMA
</span>
<h3 className="mt-2 mb-3 text-lg text-[#eef5ff]">Platform Features</h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-3 mt-3 text-sm text-[#e4edff]">
<div className="border border-[#3f6fb3] bg-[#0d1b2d] p-3 font-mono tracking-tight">
<strong className="text-[#9bc3ff]">Real-time Streaming</strong>
<br />
WebSocket-based audio streaming with low latency transcription
</div>
<div className="border border-[#3f6fb3] bg-[#0d1b2d] p-3 font-mono tracking-tight">
<strong className="text-[#9bc3ff]">Speaker Diarization</strong>
<br />
Automatic speaker identification and labeling
</div>
<div className="border border-[#3f6fb3] bg-[#0d1b2d] p-3 font-mono tracking-tight">
<strong className="text-[#9bc3ff]">End-of-Utterance</strong>
<br />
Smart detection of speech boundaries
</div>
<div className="border border-[#3f6fb3] bg-[#0d1b2d] p-3 font-mono tracking-tight">
<strong className="text-[#9bc3ff]">Multi-format</strong>
<br />
Support for PCM32F and PCM16 audio encoding
</div>
</div>
</div>
<div className="mt-6 border border-[#0f3c78] bg-[#0f3c78] text-[#dbe7ff] shadow-[inset_0_0_0_1px_rgba(255,255,255,0.1)]">
<header className="border-b border-[rgba(197,219,255,0.4)] px-3 py-2.5 font-mono tracking-wide text-xs flex justify-between items-center">
<strong>API // makima.jp</strong>
<span className="text-[#92b8ff]">endpoint: wss://api.makima.jp</span>
</header>
<pre className="m-0 px-3 py-4 font-mono text-xs leading-relaxed bg-[linear-gradient(0deg,rgba(255,255,255,0.05)_1px,rgba(15,60,120,0.25)_1px)]">
{`[001] endpoint ............... /api/v1/listen
[002] protocol ............... WebSocket
[003] encoding ............... pcm32f / pcm16
[004] sample_rate ............ 16000 Hz (default)
[005] features ............... transcription, diarization, eou`}
</pre>
</div>
</main>
<footer className="px-4 py-3 border-t-4 border-double border-[#23477a] bg-gradient-to-b from-[rgba(11,18,32,0.95)] to-[rgba(14,26,45,0.7)] text-xs text-[#e4edff] text-center">
<p className="m-1">© makima.jp</p>
<p className="m-1">
<a
href="https://makima.jp"
className="text-[#dbe7ff] underline"
>
https://makima.jp
</a>
{" / "}
<a
href="https://soryu.co"
target="_blank"
rel="noopener noreferrer"
className="text-[#dbe7ff] underline"
>
https://soryu.co
</a>
</p>
</footer>
</div>
);
}
|