2タップで、スマホからエディタへ。
この機能を作った理由
実機のスクリーンショットをデザイン用マシンに取り込むのは、いつも手間がかかります。AirDropはAppleデバイス間でしか使えず、USBケーブルはドライバーが必要で、圧縮されてしまうメール転送、同期に時間のかかるクラウドストレージ。多くのスクリーンショットツールは、ディスクからの画像アップロードで問題を回避しています。Screenshotifyは、実機でアプリを開いたその瞬間に、実際の画面をモックアップに取り込みたいというニーズのために作りました。
内部の仕組み
WebRTCデータチャンネルをPeerJS経由で利用しています。エディタ側がPeer接続を開いて6文字のPINを生成し、ピアIDとPINの両方をQRにエンコードします。スマホ側がQRを読み取ると、スマホのブラウザでscreenshotify.app/app?peer=…&pin=…が開きます。スマホ側がPINで認証(3秒のタイムアウト)し、チャンネル経由でファイルデータを送信します。画像は通常のImageLayerとしてエディタに届き、サーバーを経由しません。
対応環境
WebRTCに対応した最新ブラウザであれば利用できます。対応ブラウザは以下のとおりです:Safari 17+、Chrome 100+、Firefox 100+、Edge。スマホ側はiOS 17/18のSafariとAndroid Chromeで動作確認済みです。スマホ側にアプリのインストールは不要で、通常のブラウザタブで動作します。
プライバシー
スクリーンショットはブラウザ間で直接転送されます。スクリーンショットの内容がScreenshotifyに届くことはありません。シグナリングサーバー(PeerJS)は接続のマッチングのみを行い、ファイルの内容は参照しません。PINの検証はエディタ側でローカルに行われ、PINはどこにも保存されません。