clicky

Clickyは、macOS上でカーソルの近くにコンパニオンとして常駐するAI搭載のティーチングアシスタントです。画面を観察し、会話に参加し、特定のインターフェース要素を視覚的に指し示すことができます。このリポジトリには、MITライセンスの下で公開されたClickyのオープンソース版が含まれており、開発者が自由に改造、カスタマイズ、または拡張することができます。 ## 機能 - **画面認識**: ScreenCaptureKitを使用して画面コンテンツをキャプチャおよび分析します。 - **音声インタラクション**: AssemblyAIによるリアルタイム文字起こしを伴うプッシュ・トゥ・トーク音声キャプチャ。 - **会話型AI**: 文字起こしとスクリーンショットをClaudeにストリーミングし、文脈を考慮した応答を生成します。 - **テキスト読み上げ**: ElevenLabs TTSを通じて応答を再生します。 - **カーソルポインティング**: Claudeは特別なタグを埋め込むことで、複数のモニターにまたがる特定のUI要素へカーソルを移動できます。 - **メニューバーアプリ**: コントロールパネルと全画面オーバーレイウィンドウを備えた軽量なメニューバーアプリケーションとして動作します。 ## アーキテクチャ - **Swiftアプリ** (`leanring-buddy/`): 中心となるステートマシン、パネルUI、Claudeストリーミングクライアント、ElevenLabs TTSクライアント、オーバーレイウィンドウ、AssemblyAI文字起こしプロバイダーなど、メインのアプリケーションロジックを含みます。 - **Cloudflare Worker** (`worker/`): APIキーを安全に保持し、リクエストを `/chat`、`/tts`、`/transcribe-token` エンドポイントにルーティングする小さなプロキシです。 - **CLAUDE.md**: AIエージェントがコードベースを理解するための包括的なアーキテクチャドキュメント。 ## セットアップ ### 前提条件 - macOS 14.2+ (ScreenCaptureKit用) - Xcode 15+ - Node.js 18+ (Cloudflare Worker用) - Cloudflareアカウント (無料枠で可) - Anthropic、AssemblyAI、ElevenLabsのAPIキー ### Claude Codeによるクイックスタート 1. Claude Codeをインストールして実行します。 2. 提供されたプロンプトを貼り付けて、リポジトリをクローンし、`CLAUDE.md` を読み、セットアップのガイドを受けます。 ### 手動セットアップ 1. **Cloudflare Workerのセットアップ**: `worker/` に移動し、`npm install` を実行してから、`npx wrangler secret put` を使ってAPIキーをシークレットとして追加します。`wrangler.toml` でElevenLabsのボイスIDを設定します。`npx wrangler deploy` でデプロイします。 2. **Workerをローカルで実行** (任意): `npx wrangler dev` を使用し、キーを含む `.dev.vars` ファイルを作成します。Swiftコード内のプロキシURLを `http://localhost:8787` を指すように更新します。 3. **プロキシURLの更新**: Swiftコード内で `clicky-proxy` を検索し、あなたのWorker URLに置き換えます。 4. **Xcodeで開く**: `leanring-buddy.xcodeproj` を開き、スキームを選択し、署名チームを設定して、Cmd+Rで実行します。 ### 必要な権限 - マイク (プッシュ・トゥ・トーク用) - アクセシビリティ (グローバルキーボードショートカット用) - 画面収録 (スクリーンショット用) - 画面コンテンツ (ScreenCaptureKit用) ## プロジェクト構成 ``` leanring-buddy/ # Swiftソース CompanionManager.swift # 中心となるステートマシン CompanionPanelView.swift # メニューバーパネルUI ClaudeAPI.swift # Claudeストリーミングクライアント ElevenLabsTTSClient.swift # テキスト読み上げ再生 OverlayWindow.swift # 青いカーソルオーバーレイ AssemblyAI*.swift # リアルタイム文字起こし BuddyDictation*.swift # プッシュ・トゥ・トークパイプライン worker/ # Cloudflare Workerプロキシ src/index.ts # 3つのルート: /chat, /tts, /transcribe-token CLAUDE.md # 完全なアーキテクチャドキュメント ``` ## コントリビューション PRを歓迎します。Claude Codeを使用している場合、`CLAUDE.md` を読むことでコードベースを理解し、機能開発やバグ修正を支援できます。フィードバックはX (@farzatv) で作者までお寄せください。