スクリーンショットをそのまま貼り付けるだけでは芸がありません。そこには余計な情報も入ってしまっているかも知れませんし、アイコンなどを消したいと思うこともあります。 そんな時に使ってみたいのがScreenshot.Rocksです。Webブラウザのモックアップを使ったスクリーンショットを作成します。

Screenshot.Rocksの使い方

適当な画像をアップロードすると、Webブラウザっぽい枠を表示します。

上に載せる情報は自由にカスタマイズできます。

さらに背景色を変更しました。

できあがった画像はダウンロードできます。

Screenshot.Rocksを使えばPhotoshopなどで作ったWebサイトのデザインをモックアップのWebブラウザ枠で囲めます。自分のWebブラウザでは機能拡張のアイコンや、アドレスバーのURLなど載せたくない情報になっていることもあるでしょう。Screenshot.Rocksで簡単にカスタマイズできます。

Screenshot.RocksはTypeScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。

Screenshot.Rocks | Create browser mockups from screenshots in seconds daveearley/screenshot.rocks: Create beautiful browser mockups from screenshots