スクリーンショット フレーマー

スクリーンショット フレーマーの使い方

このフレーマーは、デザインツールなしで生のスクリーンショットを発表用画像に仕上げます。ライト/ダークのブラウザーアドレスバーや、信号機ボタン付きの macOS ウィンドウでショットを包んだり、素のままにしたりし、8 種類のグラデーションや任意の単色の上に置いて、キャンバス上でリアルタイムに合成します。角丸・パディング・影・アドレスバーの文字はすべて調整でき、PNG 書き出しはブラウザー内でローカルに動きます。

1. スクリーンショットをアップロードエリアへドラッグするか、クリックしてファイルを選ぶか、クリップボードから貼り付けます。
2. 「フレーム」セレクターでフレームを選びます：Browser light、Browser dark、macOS window、No frame。
3. 背景を選びます。8 つのグラデーション見本のどれかをクリックするか、右側のカラースウォッチで任意の単色を選びます。
4. URL またはタイトルのテキスト欄を編集してブラウザーバーや macOS タイトルに描かれるラベルを変え、3 つのスライダーで角丸・パディング・影を微調整します。
5. 書き出しスケールを 1x と 2x の間で切り替え、ライブプレビューを確認してから「PNG をエクスポート」を押して スクリーンショット名_frame.png を保存します。

ドキュメントやアプリストアのギャラリーには 2x 書き出しを。倍の解像度は Retina ディスプレイでもくっきりし、1x はチャットや SNS 投稿向けにファイルを小さく保てます。