欲しいを叶える個人開発の進め方 / How to Run an Indie Project That Brings Your Ideas to Life

個人単位のニッチな需要でも、実現できるのが、個人開発のいいところです。
ただし、仕事以上にうまく行くか不明なため、モチベーションの維持が重要な課題です。
ビジュアルノベルゲームエンジンを無事にリリースできた自分の進め方をお話ししたいと思います。

Transcript

1. 欲しいを叶える個人開発の進め方 JavaScriptでノベルゲームエンジン作った 19-D-9 Developers Summit 2026 遠藤ヒズミ
2. 自己紹介 - 名前: 遠藤ヒズミ (@endo_hizumi) - 分類: 霊長目ヒト科インドア属ニホン PCオタクモドキ種 - 頻出: 千葉県東葛地域 - 職業: レコメンド系 SaaS企業のフルスタック Rails使い - 経歴: Vue.jsを中心にフロントエンドで４年 - 好き:ロボットアニメ・戦隊ヒーロー・ VTuber
3. お前も個人開発者 にならないか・・・？👹
4. 個人開発はいいぞ・・・
5. 欲しい機能 を持ったソフトウェア の開発が出来る
6. これに限るッ！！ 欲しい機能 を持ったソフトウェア の開発が出来る
7. あなたの個人開発は何処から？ 💊 • 日常の個人的な不満点 ◦ 単調な繰り返しの定型業務 ◦ ミスが許されない手順（毎週のリリース作業とか） ◦ 既存のサービスにないけど、欲しい機能がある → これを改善するソリューションを求めた時
8. 僕の場合 - とっつきやすくノベルゲーム が作れる - ゲームロジック開発に、TypeScriptが使える - npmパッケージ が、使える - ゲームのUIデザインに、CSSが使える …etc
9. 僕の場合 - とっつきやすくノベルゲーム が作れる - ゲームロジック開発に、TypeScriptが使える - npmパッケージ が、使える - ゲームのUIデザインに、CSSが使える …etc → フロントエンドスキル でゲーム開発 をできる ライブラリ が...無い。
10. 欲しいっ！！！ （指パッチンの音）
11. 作りました • TypeScript製ノベルゲームエンジン ◦ ゲームUIをHTMLで作成 ◦ 独自マークアップ言語のWebTaleScriptで制御 ◦ ロジックはJavaScript(TypeScript)で開発
12. 特徴1. UIはHTMLで作る HTML Canvas ゲームUIをHTMLで作成するので自由に画面が作れる
13. 特徴1. UIはHTMLで作る ゲームUIをHTMLで作成するので自由に画面が作れる
14. 特徴2. 見やすく書きやすいセマンティックな制御言語 HTML風の独自言語で作成するので、構造把握が容易
15. 特徴3. ロジックは、JavaScript(TypeScript)で記述 豊富なnpmパッケージも使える
16. 全体の流れ • ビルド • 実行 ビルド済み ファイル シーン ファイル (.scene) WTSパーサー (bin/wtc) ビルド済み ファイル (.ts/.js) 画面用HTML Web Audio canvas 画面 描画 シナリ オ管理 DOM
17. 全体の流れ（ビルド編） シーンファイルと呼ばれるファイルにスクリプトを記述 シーン ファイル (.scene) WTSパーサー (bin/wtc) ビルド済み JSファイル (.js)
18. 全体の流れ（ビルド編） パーサーが解釈して、JavaScriptにトランスパイルする シーン ファイル (.scene) WTSパーサー (bin/wtc) ビルド済み ファイル (.ts/.js)
19. 全体の流れ（実行編） 1. 描画させたいHTMLにWebTaleKitのエントリーファイル (=index.js)をScriptタグで指定 2. ブラウザが呼んだindex.jsがエンジンを初期化 3. エンジンが画面UI用HTMLとビルド済みファイルを読込 4. 必要に応じて、エンジンがDOM操作とJavaScriptを実行 画面用 HTML (.html) ビルド済み ファイル (.ts/js)
20. 全体の流れ • ビルド • 実行 ビルド済み ファイル シーン ファイル (.scene) WTSパーサー (bin/wtc) ビルド済み ファイル (.ts/.js) 画面用HTML Web Audio canvas 画面 描画 シナリ オ管理 DOM
21. 動作デモ
22. 応用活用案 • LLMチャットアプリのフロントエンドのローコード開発 ◦ IPキャラクターとの対話サービス ◦ バーチャルな運営窓口 ◦ インタラクティブなeラーニング • Web技術での動画作成（Remotionのような） …etc
23. 断じて、既存のエンジン構文の勉強を横着したわけじゃない。 これは知的探究心の表れだ　- Endo Hizumi
24. 開発経緯
25. （ラノベや漫画を読んだあと）ノベルゲーム作りたいな …
26. 疑問点・不満点 メジャー所を調べると、 Webアプリの形式をとっている • Webアプリなのに、全部、手続き。 ◦ 画面もスクリプトで...Webなのに？ • 直接HTML(CSS)とJavaScriptで作ればいいじゃん • 今のHTMLの仕様で出来るはずなのにそんなエンジン無い →可能かどうか作ってみるか...
27. アルファ版リリース！ 🎉 祝え！2024年7月、爆誕の瞬間 である
28. 個人開発あるある
29. 個人開発あるある : 自然消滅 - やらなくても誰も困らない - これ誰が使うん？ - 不明点を人に相談できなくて、孤独 - 自分でも覚えていない仕様が出てくる - 仕事で疲れてそれどころじゃない
30. 個人開発あるある : 自然消滅 - やらなくても誰も困らない - これ誰が使うん？ - 不明点を人に相談できん - 自分でも覚えていない仕様が出てくる - 仕事で疲れてそれどころじゃない 苦しみだけになって、開発が止まる
31. 楽しくやるには？ - 完成までのハードルを下げましょう - 期日は努力目標 - 開発時のお約束
32. 完成までのハードルを下げましょう • 自分が実現したいこと（＝事の本質）を定めよう • コアじゃない所は、手を抜こう ◦ 言語設計で工夫して、パーサーの実装工数を削る ◦ 設計だけ書いて、実装をAIに投げる。 → やらないことを決めよう
33. 期日は努力目標 • 期日に遅れても、誰も困らない ◦ 自分を追い込んでも意味がない ◦ 月イチでリリース報告ツイート出来たらする ◦ バグやアイデアはメモする →ストレスとプレッシャーを減らす。要はバランス。
34. 開発時のお約束 • 自分すら使わないものにしない • このメソッドで何をしたいのか、納得する • 最初に設計を文書化・実装後に実装例を用意する • 場当たりなバグ修正を少なくする(調査を徹底する) →仕様は小さく明確 に。そして可視化する。
35. みんなも個人開発始めよう！
36. みんなも個人開発始めよう！ 欲しいは 正 義！！ 「俺が欲しい！」 だけで伝わります！！
37. Thank you for listening!! 　 WebTaleKitの 紹介スライドを 本にしました。 SpeakerDeck で、無料公開中 です。