-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
291 lines (254 loc) · 16.8 KB
/
index.html
File metadata and controls
291 lines (254 loc) · 16.8 KB
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
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="未完成成果物研究所 - Non-profit Technical Community / Independent R&D Team">
<title>未完成成果物研究所 | Incomplete-Outputs-Lab</title>
<!-- IBM Plex Mono Font -->
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
<!-- Tailwind CSS v4 Play CDN -->
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<!-- Custom CSS -->
<link rel="stylesheet" href="assets/css/custom.css">
<!-- Tailwind Custom Theme -->
<style type="text/tailwindcss">
@theme {
--color-terminal-green: #00ff00;
--color-terminal-bg: #000000;
--color-terminal-text: #cccccc;
--font-mono: 'IBM Plex Mono', 'JetBrains Mono', monospace;
}
</style>
</head>
<body class="bg-black text-[#cccccc] font-mono overflow-x-hidden">
<!-- Scanline Overlay -->
<div id="scanline-overlay" class="scanline-overlay"></div>
<!-- Background Waveforms -->
<div id="background-visual" class="fixed inset-0 -z-10 opacity-20">
<svg id="waveform-svg" class="w-full h-full"></svg>
</div>
<main class="relative z-10">
<!-- Header -->
<header class="container mx-auto px-4 py-8 md:py-16" id="hero-header">
<h1 class="text-4xl md:text-6xl terminal-glow font-semibold glitch-title">未完成成果物研究所</h1>
<p class="text-xs md:text-sm text-[#cccccc] opacity-60 mt-2 fade-in-element">aka. 未成研</p>
<p class="text-sm md:text-base text-[#00ff00] mt-4 fade-in-element">Incomplete-Outputs-Lab</p>
<p class="text-xs md:text-sm text-[#cccccc] opacity-70 mt-1 fade-in-element">Non-profit Technical Community / Independent R&D Team</p>
<p class="text-xs md:text-sm text-[#cccccc] opacity-70 fade-in-element">Active Professionals' Guild</p>
<!-- GitHub Organization Link -->
<div class="mt-6 fade-in-element">
<a href="https://github.com/Incomplete-Outputs-Lab" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-2 text-[#00ff00] hover:underline transition-all">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
</svg>
<span class="text-sm">github.com/Incomplete-Outputs-Lab</span>
</a>
</div>
</header>
<!-- About Section -->
<section id="about" class="container mx-auto px-4 py-12 md:py-20">
<h2 class="text-xl md:text-2xl mb-6 text-[#00ff00]">[ ABOUT ]</h2>
<p class="text-sm md:text-base leading-relaxed max-w-3xl">
未完成成果物研究所は、未成が主導する配信プロダクション向け各種ツール・ハードウェア機材の研究開発チームです。2026年1月現在、全メンバーが兼業であり、メインの業務がある傍ら未成研の研究開発を非営利で行っています。
</p>
<p class="text-xs md:text-sm text-[#00ff00] mt-4 opacity-80">
※ 未成研は会社組織ではありません。独立した技術者集団として運営されています。
</p>
</section>
<!-- Projects Section -->
<section id="projects" class="container mx-auto px-4 py-12 md:py-20">
<h2 class="text-xl md:text-2xl mb-8 text-[#00ff00]">[ ACTIVE_PROJECTS ]</h2>
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-6 md:gap-8">
<!-- Project Card: obs-sync -->
<article class="terminal-border p-6 flex flex-col project-card">
<div class="flex items-center justify-between mb-3 flex-wrap gap-2">
<h3 class="text-lg font-semibold text-[#00ff00]">obs-sync</h3>
<span class="status-badge">[ PHASE: UNDER DEVELOPMENT ]</span>
</div>
<div class="flex items-center gap-2 mb-4">
<p class="text-xs text-[#cccccc] opacity-60">Distributed OBS Synchronization System</p>
<a href="https://github.com/Incomplete-Outputs-Lab/obs-sync" target="_blank" rel="noopener noreferrer" class="ml-auto flex items-center gap-1 text-[#00ff00] hover:text-[#00ff00] transition-all hover:scale-110" title="View on GitHub">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
</svg>
</a>
</div>
<!-- Coming Soon Display -->
<div class="coming-soon-display h-48 md:h-56 mt-2 mb-4 flex-shrink-0 flex items-center justify-center">
<span class="text-2xl text-[#00ff00] terminal-glow">COMING SOON</span>
</div>
<p class="text-sm leading-relaxed mb-4 flex-grow">
中〜大規模配信現場における、マルチインスタンスOBSの完全同期ソリューション。マスター/スレーブ構成による設定値のリアルタイム・ミラーリング。スレーブ側での予期せぬ変更を即座に検知し、インシデントを未然に防ぐ。
</p>
<div class="flex flex-wrap gap-2 mt-auto">
<span class="tech-tag">Rust</span>
<span class="tech-tag">React</span>
<span class="tech-tag">Tauri</span>
<span class="tech-tag">WebSocket</span>
<span class="tech-tag">obs-websocket</span>
</div>
</article>
<!-- Project Card: stream-monitor -->
<article class="terminal-border p-6 flex flex-col project-card">
<div class="flex items-center justify-between mb-3 flex-wrap gap-2">
<h3 class="text-lg font-semibold text-[#00ff00]">stream-monitor</h3>
<span class="status-badge">[ PHASE: UNDER DEVELOPMENT ]</span>
</div>
<div class="flex items-center gap-2 mb-4">
<p class="text-xs text-[#cccccc] opacity-60">Broadcast Statistics Analyzer</p>
<a href="https://github.com/Incomplete-Outputs-Lab/stream-monitor" target="_blank" rel="noopener noreferrer" class="ml-auto flex items-center gap-1 text-[#00ff00] hover:text-[#00ff00] transition-all hover:scale-110" title="View on GitHub">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
</svg>
</a>
</div>
<!-- Coming Soon Display -->
<div class="coming-soon-display h-48 md:h-56 mt-2 mb-4 flex-shrink-0 flex items-center justify-center">
<span class="text-2xl text-[#00ff00] terminal-glow">COMING SOON</span>
</div>
<p class="text-sm leading-relaxed mb-4 flex-grow">
配信データと視聴者体験を数値化する、エッジ動作型のアナリティクスエンジン。マルチビュー監視と並行し、コメント密度や視聴者情報をAPI経由で集積。DuckDB を採用したエッジDBにより、数百万件の統計データから盛り上がりの瞬間を即座に抽出。
</p>
<div class="flex flex-wrap gap-2 mt-auto">
<span class="tech-tag">Rust</span>
<span class="tech-tag">React</span>
<span class="tech-tag">Tauri</span>
<span class="tech-tag">DuckDB</span>
<span class="tech-tag">Webhooks</span>
</div>
</article>
<!-- Project Card: vMix-Control-Series (Hardware) -->
<article class="terminal-border p-6 flex flex-col project-card">
<div class="flex items-center justify-between mb-3 flex-wrap gap-2">
<h3 class="text-lg font-semibold text-[#00ff00]">vMix-Control-Series</h3>
<span class="status-badge">[ PHASE: R&D ]</span>
</div>
<p class="text-xs text-[#cccccc] opacity-60 mb-4">Embedded Interface Units</p>
<!-- PCB Circuit Animation -->
<div class="pcb-circuit h-48 md:h-56 mt-2 mb-4 flex-shrink-0" data-project="vmix">
<svg class="w-full h-full"></svg>
</div>
<p class="text-sm leading-relaxed mb-3 flex-grow">
Raspberry Pi 5 / Pico をベースとした、放送用ソフトウェア vMix 専用のハードウェア・コントローラー群。Embassy (Rust for embedded) を活用し、超低遅延なレスポンスを実現。基板設計からファームウェアまで一貫した自社開発。
</p>
<!-- Lineup -->
<div class="mb-4 text-xs space-y-1">
<div><span class="text-[#00ff00]">▸ VMTALLY:</span> ハイブリッド・タリーシステム</div>
<div><span class="text-[#00ff00]">▸ VMReplay:</span> リプレイ特化インターフェース</div>
<div><span class="text-[#00ff00]">▸ VMSwitch:</span> スイッチング特化モデル</div>
<div><span class="text-[#00ff00]">▸ VMDeluxe:</span> 最上位機（NDIモニタリング）</div>
</div>
<div class="flex flex-wrap gap-2 mt-auto">
<span class="tech-tag">Rust (Embassy)</span>
<span class="tech-tag">RPi 5/Pico</span>
<span class="tech-tag">KiCad</span>
<span class="tech-tag">NDI SDK</span>
</div>
</article>
</div>
</section>
<!-- Members Section -->
<section id="members" class="container mx-auto px-4 py-12 md:py-20">
<h2 class="text-xl md:text-2xl mb-8 text-[#00ff00]">[ MEMBERS ]</h2>
<div class="grid grid-cols-1 gap-6">
<!-- Member Card: Misei -->
<article class="terminal-border p-6 md:p-8 member-card">
<div class="flex flex-col md:flex-row gap-6">
<!-- Avatar -->
<div class="flex-shrink-0">
<div class="w-24 h-24 border-2 border-[#00ff00] flex items-center justify-center terminal-glow">
<span class="text-4xl text-[#00ff00]">M</span>
</div>
</div>
<!-- Profile Details -->
<div class="flex-grow">
<div class="mb-4">
<h3 class="text-2xl font-semibold text-[#00ff00] mb-1">未成 (Misei)</h3>
<p class="text-sm text-[#cccccc] opacity-70 mb-3">Founder / Lead Architect</p>
</div>
<div class="mb-4">
<h4 class="text-xs text-[#00ff00] uppercase tracking-wider mb-2">Focus</h4>
<div class="flex flex-wrap gap-2">
<span class="tech-tag">Rust</span>
<span class="tech-tag">Embedded Systems (Embassy)</span>
<span class="tech-tag">Desktop Application</span>
<span class="tech-tag">Distributed Systems</span>
<span class="tech-tag">StreamDeck Plugins</span>
</div>
</div>
<div class="mb-4">
<h4 class="text-xs text-[#00ff00] uppercase tracking-wider mb-2">Description</h4>
<p class="text-sm leading-relaxed text-[#cccccc]">
未完成成果物研究所の主宰。誰よりも未完成のプロジェクトが多い。配信現場の「不確実性」をコードで制御することに執着する。マイコンを用いたハードウェアからクラウドオーケストレーションまで、放送に関連する技術の全レイヤーを横断的に設計。
</p>
</div>
<div>
<h4 class="text-xs text-[#00ff00] uppercase tracking-wider mb-2">Socials</h4>
<a href="https://x.com/miseinul" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-2 text-[#cccccc] hover:text-[#00ff00] transition-colors">
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/>
</svg>
<span class="text-sm">@miseinul</span>
</a>
</div>
</div>
</div>
</article>
</div>
</section>
<!-- Capabilities Section -->
<section id="capabilities" class="container mx-auto px-4 py-12 md:py-20">
<h2 class="text-xl md:text-2xl mb-8 text-[#00ff00]">[ CAPABILITIES ]</h2>
<div class="terminal-border p-6 md:p-8">
<ul class="space-y-4 text-sm md:text-base">
<li class="flex items-start capability-item">
<span class="text-[#00ff00] mr-3">▸</span>
<span>プロダクションソフトウェアの開発・制作（Windows/Mac/Linux）</span>
</li>
<li class="flex items-start capability-item">
<span class="text-[#00ff00] mr-3">▸</span>
<span>StreamDeckプラグインの新規開発・改修</span>
</li>
<li class="flex items-start capability-item">
<span class="text-[#00ff00] mr-3">▸</span>
<span>companionプラグインの新規開発・改修</span>
</li>
<li class="flex items-start capability-item">
<span class="text-[#00ff00] mr-3">▸</span>
<span>組み込み機器の設計・実装</span>
</li>
<li class="flex items-start capability-item">
<span class="text-[#00ff00] mr-3">▸</span>
<span>NDI/SRT/OMT 関連ソフトウェアの開発</span>
</li>
</ul>
</div>
</section>
<!-- Footer -->
<footer class="container mx-auto px-4 py-12 md:py-16 border-t border-[#00ff00] border-opacity-30 mt-20">
<div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
<div>
<p class="text-sm text-[#cccccc]">未完成成果物研究所 / Incomplete-Outputs-Lab</p>
<p class="text-xs text-[#cccccc] opacity-60 mt-1">Non-profit Technical Community</p>
<p class="text-xs text-[#cccccc] opacity-60">Active Professionals' Guild</p>
</div>
<div class="text-xs text-[#cccccc] opacity-60">
<p>※ 未成研は会社組織ではありません</p>
<p class="mt-1">全メンバーが本業を持つ兼業技術者集団です</p>
</div>
</div>
<div class="mt-6 text-xs text-[#00ff00] opacity-40 font-mono">
<p>[ SYSTEM_STATUS: OPERATIONAL ]</p>
<p>[ SIGNAL_INTEGRITY: NOMINAL ]</p>
</div>
</footer>
</main>
<!-- anime.js -->
<script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
<!-- Configuration -->
<script src="assets/js/config.js"></script>
<!-- Animations -->
<script src="assets/js/animations.js"></script>
</body>
</html>