スクリーンショットをブラウザ風フレームに入れる
スライドに生のスクリーンショットを貼ると素っ気ない。すっきりしたブラウザ風フレームと余白を付けるだけでプロダクト画像に見えます。
このガイドで使う道具
やりたいこと
ドキュメント、README、ポートフォリオでは、信号ボタンとアドレスバーのあるウィンドウ枠にスクリーンショットを収め、周囲に余白を付けると仕上がりが良く見えます。
使い方
スクリーンショットを選び、ライトかダークのフレームを選んでPNGをダウンロードします。画像の上に汎用的なブラウザ風バーが描かれ、周囲に均等な余白が付きます。
- ライト・ダークともニュートラルな配色で、スクリーンショット本体が主役のままです。
- フレームは汎用表現で、特定のブラウザを模倣するものではありません。
具体例
1440×900のアプリ画面をダークテーマに入れると、上にバー、四方に余白が付いた少し大きめのPNGができ、そのままスライドに貼れます。
注意点
25MiBまでの静止JPG、PNG、WebPに対応。描画によるフレームのため、実機のベゼルや遠近法、複雑な影はありません。出力は常にPNGです。