#TypeMon — ラテン文字からクリル文字へ。モンゴル語入力
#プロジェクト背景
私は10年間日本にいたから、モンゴル語を打つ機会がほぼなかった。帰国して改めて毎日モンゴル語を書くようになったとき、気づいた。モンゴル語キーボードが使いづらすぎる。
毎回「えっと、この文字はどこだっけ……」みたいな感じで、効率が悪い。本当に苦痛だった。
そんとき、2012年にモンゴル人ブロガーが作った Web アプリを発見。https://krilleer.blogspot.com/
- *コンセプトは完璧だった。**ラテン文字でモンゴル語を打ったら、自動的にキリル文字に変換される。まさに求めてたやつだ。
でも使ってみたら、14年のブランクがすべてをダメにしてた。
**UI-**2012年基準で、今見たらかなり古い
**機能-**テキストエリア 1個だけ
**モバイル-**非対応。スマホで使えない。
**デスクトップ版-**Windows 限定 + .NET 必須
**更新-**2012以降更新なし。
そこで自分で作り直すことを決めた**。。**
#つくるものの定義
単なる「変換ツール」ではなく、モンゴル語を日常的に書く人が、本当に使いたくなるプロダクトを。
- ⚡ リアルタイム変換 — 入力と同時に変換
- 📱 モバイル完全対応 — スマホでストレスなく
- 💾 コピー・履歴・フレーズ保存 — 実用性を極める
- 🎨 UI が美しい — これが最大の差別化
- 🌙 ダークモード + PWA対応 — 現代的
- 🤖 AI 修正機能 — タイポと文法を自動修正
#開発タイムライン — 18時間で完成
#夜間（5月16日）：設計フェーズ
Claude co-work, Claude chat, Codex を全力で使いながら、一気に設計。
- デザイン・カラーレイアウト
- ラテン→キリル変換ロジック
- AI 統合の方法論
- スマホ UX
開発が楽しすぎて、深夜3時まで。（通常は 1時就寝）
#朝（5月17日 8時）：実装フェーズ
5時間睡眠で即座に開発再開。勢いのまま、ノンストップで実装。
#昼（5月17日 12時）：完成
実用レベルまで一気に仕上げることができた。
達成感半端なかったです。
#技術的な選択
#1. 変換ロジック
ラテン→キリル変換の実装は比較的スムーズ。
#2. AI 修正機能（最大の学習ポイント）
初めての AI API 導入。ここで最も時間を費やした。
#なぜ Gemini 無料版か？
有料 API（Claude / ChatGPT）を使えば制限なしで実装できる。でも 収益化の確実性がまだ不明なので、無料版を選んだ。
その代わり、制限を戦略的に設定した。
Upstash Redis でサーバー側のレート制限、localStorage でクライアント側の警告を実装。
【ユーザー当たりの制限】
1日あたり最大10回
1回あたり500文字
【スケーラビリティの計算】
月 150人程度のアクティブユーザーなら
Gemini 無料枠で持続可能。
ここで学んだのは：「無制限が理想」ではなく、「上手に設計すれば制限は武器になる」 ということ。
#デザイン
- ダークモード — Claude のニュートラルブラック + 微かなグレー
- ライトモード — Claude のクリーンホワイト系
最近愛用している Claude ののような落ち着いたニュートラルUIを参考にした。
#旧版との比較
#旧アプリと TypeMon の違い
リアルタイム変換 旧アプリ：✗ TypeMon：✓
モバイル対応 旧アプリ：✗ TypeMon：✓ フル対応 + PWA
コピーボタン 旧アプリ：✗ TypeMon：✓
履歴機能 旧アプリ：✗ TypeMon：✓
フレーズ保存 旧アプリ：✗ TypeMon：✓
UI クオリティ 旧アプリ：当時基準のUI TypeMon：モダン
AI 修正 旧アプリ：✗ TypeMon：✓
オフライン対応 旧アプリ：✗ TypeMon：✓
OS 対応 旧アプリ：Windows のみ TypeMon：全 OS（Web ベース）
#技術スタック
**Next.js-**アプリ全体のフレームワーク
**TypeScript-**型安全な開発
**Tailwind CSS + CSS Variables-**UI とデザイン管理
**Gemini API-**AI修正機能
**Upstash Redis-**レート制限
Vercel-ホスティング
**GitHub-**ソース管理
#今回のプロジェクトで新しく学んだ考え方、機能
#1. 多層レート制限アーキテクチャ
- Redis でサーバー側制限（IP ベース、24h スライディング）
- localStorage でクライアント側制限（UX 警告）
- バリデーションで 500 文字制限
単純に「API 濫用対策」ではなく、スケーラブルな思考 。
#2. Gemini 無料版の戦略的活用
無料版でも制限設計で 150 人規模のサービスにできた。多くのスタートアップは「有料 API か無料版か、二者択一」と思い込むけど、制限の工夫で無料版を最大活用 する。
#3. PWA 化
オフラインで使える、ホーム画面に追加可能。普通の Web ツールではなく、配布可能な環境 にしてる。モンゴルの地方部でネット環境が不安定な場合も対応。
#ビジネス設計
#ターゲット
- モンゴル人（特に若年層・デジタルネイティブ）
- モバイル優先ユーザー
- SNS / ブログで頻繁にモンゴル語を書く層
#差別化の本質
- UI の美しさ — 旧版比で 数倍の快適性
- 機能充実 — 単なる変換ツールではなく「執筆環境」
- モダン設計 — PWA でインストール可能、オフライン対応
- 無料かつ フル機能 — 基本機能は完全無料。AI 修正は制限つき。
#実装と学習
#前のプロジェクトの経験が活きた
ポートフォリオサイト + 筋トレ記録アプリで培った DB 設計、API 操作、デザイン感覚が、すべて TypeMon に活かされた。
#なぜ「きれい」より「ノイズ」か？
Web 制作は「わかりやすさ」を優先するのがセオリー。でも TypeMon では違う選択をした。
- ナビゲーションは最小限
- テキストは短く、ビジュアルに委ねる
- インタラクションは「遊び」に満ちてる（揺れ、スライド、ポップアップ）
これらはすべて 「モンゴル語を書くという行為を、楽しくする」 という目的のための選択。
#リンク
- デモ: https://type-mon.vercel.app/
- GitHub: https://github.com/E-Zaya/type-mon
- 旧版参考: https://krilleer.blogspot.com/
May 17, 2026 / Ulaanbaatar
Zaya