品評会画像メーカー

新しいウェブアプリをリリースしました。

アプリの説明

集合写真のURLを入力すると、各人物の顔に番号を割り振った画像を出力するツールです。

入力画像

出力画像

入力画像

出力画像

URL入力欄に画像のURLを入力します。オプションで番号のフォントサイズ、番号の位置を顔の上にするか横にするか、番号に()をつけるかつけないかを選択できます。

解析するボタンを押すと人物に番号を割り振った画像のURLが出力されます。解析後の画像がImgurにアップロードされ、解析後の画像のURLが表示されます。

フロントエンドはReactを使用しています。なお、作者はHTMLとCSSを書けないためスタイリングにはReact Native Webを使用しました。

フロントエンドでは、入力された画像URLとオプション(フォントサイズや数字位置など)をaxiosを使ってウェブAPIにPOSTリクエストを送信しています。

APIからは番号を振った後の画像のURLが返されます。出力結果としてAPIから返された画像URLを表示しています。

アプリのホスティングにはFirebase Hostingを使用しています。

バックエンドでは以下の処理を行うPythonスクリプトをCloud Runで実行しています。

ソースコードはGitHubに公開しています。

精度はまぁまぁ高い。