Electronアイデア
Electronとは
Reactでデスクトップアプリをつくるためのフレームワーク
デスクトップアプリはSEO対策する必要がないので、Next.jsではなくReactを使うのが一般的
Next.jsで作ったウェブサイトをデスクトップアプリ化したいときにも使える
Electronが使われているデスクトップアプリ
DiscordやSlack
① チャットアプリでは複数のユーザーがリアルタイムで通信する
→ JavascriptはPythonより優れたリアルタイム通信ができる（Socket.io）
→ PythonではなくJavascriptを使うほうが良い
② ウェブブラウザだとタブを閉じた瞬間にサーバーとの接続が切れてしまう
→ タブを閉じると相手からチャットが来てもわからない
→ デスクトップアプリはアプリを閉じてもバックグラウンドで動作可能なので、
→ アプリを閉じてもチャット通知（デスクトップ通知）が届く
→ ウェブアプリではなくデスクトップアプリのほうが良い
Visual Studio Code
① プログラミング開発では拡張機能Extension（外部API）を使う
→ JavascriptはPythonよりもAPI通信が得意（Fetch）
→ PythonではなくJavascriptを使うほうが良い
② ローカルファイルに頻繁にアクセスする
→ ブラウザではローカルファイルへのアクセスに制限がある
→ ウェブアプリではなくデスクトップアプリのほうが良い
Figma
① ローカルPCの画像ファイルや動画ファイルを処理する
→ JavascriptはPythonよりも「ファイルのドラッグ＆ドロップ、アップロード＆プレビュー」が得意（PythonはGUIで複雑な設定が必要）
→ PythonではなくJavascriptを使うほうが良い
① HTMLに直接描画（Canvas描画）したり、WebGLで三次元オブジェクトを描画する
→ リアルタイムでUIを更新する作業は（タイマーとかアニメーション含めて）Javascriptにしかできない
→ PythonではなくJavascriptを使うほうが良い
② ローカルPCの画像ファイルや動画ファイルを処理する
→ ネット上のリソースを使わない時間のほうが多い
→ オフラインの方が動作が安定する
→ ウェブアプリではなくデスクトップアプリのほうが良い
プリンター印刷アプリやカメラの画像プレビューアプリ、マイクの接続アプリ
① パソコンと外部機器を接続する
→ JavascriptはPythonよりも外部機器へのアクセスが得意
→ PythonではなくJavascriptを使うほうが良い
② パソコンと外部機器を接続する
→ オンライン上の情報が不要
→ ウェブアプリではなくデスクトップアプリのほうが良い
作ってみたいElectronアプリ
Google画像検索ができるビデオ再生アプリ
【概要】 映画に出てきた商品が何なのかGoogle画像検索で即座に調べたい
→ 再生中のフレームをキャプチャして
→ AIで物体認識させ、（もしくは手動キャプチャさせて）
→ Google画像検索で即調査ボタンをクリック
① Google画像検索ページに自動アップロードする
→ Bing Visual Search APIやGoogle Cloud Vision APIを使って、キャプチャ画像を解析
【Google Cloud Vision APIの有効化＆JSONキー取得手順】
【Google Cloud Vision APIの有効化＆JSONキー取得手順2：https://itport.cloud/?p=18831】
→ Web Detectionで商品名や類似画像URLを取得
→ URLが返ってくるので、
→ Google Custom Search JSON APIで画像検索して類似画像を拾う
| 無料枠 | 有料プラン（超過分） | 設定の手間 | |
| Bing Visual Search API | 毎月1000回のリクエスト | 1000回につき1.5ドル | 少ない |
| Google Cloud Vision API | 毎月1000回のリクエスト | 1000回につき1.5~2ドル | やや多い（APIキーJSONが必要） |
| 無料枠 | 超過分 | ||
| Google Custom Search JSON API | 毎日100クエリ | 1000クエリにつき5ドル | |
| Bingの場合 | 最近価格変動・API廃止 |
Google Cloud Vision APIの7つの機能
| 特徴 | |||
| 物体検出 | 動物や食べ物などのラベルでカテゴリ付けする | ||
| 顔検出 | 目や口の位置情報を分析して喜怒哀楽までわかる | ||
| テキスト検出 | OCR（光学文字認識） | ||
| ロゴ検出 | 企業ロゴが使われていないか確認 | ||
| ランドマーク検出 | スカイツリーや高尾山などのランドマークを検出して位置情報を表示 | ||
| ドミナントカラー検出 | 画像に含まれる配色とその割合 | ||
| セーフサーチ | 画像内に不適切なコンテンツが含まれているか判定 |
① 再生中のフレームをキャプチャする
→ AIで物体認識させるならPythonだが、
→ 手動でキャプチャするならAIによる自動検出は不要
→ Javascriptなら再生中のフレームを<canvas>に描画して即画像化できる（PythonならOpenCVによる取得）
① 動画再生UIが必要
→ Javascriptのほうが簡単でUIも美しい（PythonならPyQtをつかう）
【ボツ案】YouTube視聴時間の可視化（チャート化アプリ）
① 1日1時間を超えたらデスクトップ通知する（デスクトップアプリのメリット）
→ active-winを使えば、アクティブウィンドウのタイトルに「YouTube」が含まれているかを検出できるが、URLでは計測できない
→ Chrome拡張機能のほうが正確に検出できる
【ボツ案】寝ている間に仕事してくれるAI、オリジナルのR18小説を作れる生成AI
BACK