スクリーンショットを撮るのはChromeがいちばん?! | DevelopersIO
新しい職場、新しいパソコン。まず始めに入れるツールの一つがスクリーンショットではないでしょうか。 でも、Chromeのver.59からは、標準機能として装備されたようなのです。 やりかた ChromeのDevelopers Toolを立ち上げる。 Macだと、Chromeを開き「alt + command + i」を同時に押す。 レスポンシブ表示にする 続いて、command + shift + m を押します。または、下記のボタンを押してください。 画面上部に、解像度やデバイスを変更するセレクトボックスが表示されます。 デバイスの選択肢を増やす 必要最低限はありますが、PCのスクリーンショットも取れるようにしたいので、Editを押します。 デベロッパーツールの表示が切り替わるので、「Laptop with HiDPI Screen」と「Laptop with MDPI Screen」をチ
サーバーサイドで画面キャプチャ #その4 SpookyJS
サーバーサイドキャプチャも早くも4回目になりました。 今回はNodeJSでPhantomJSとCasperJSをNodeJSで使えるようにした「SpookyJS」というヤツです。 本家サイト https://github.com/SpookyJS/SpookyJS インストール 今回はNodeJSを基本インストールして、PhantomJSとCasperJSはnpmを使ってインストールします。 # 直接インストール $ wget http://nodejs.org/dist/v0.10.25/node-v0.10.25-linux-x64.tar.gz $ tar zxvf node-v0.10.25-linux-x64.tar.gz $ ln node-v0.10.25-linux-x64/bin/node /usr/bin/ # 確認 $ node --version > v0.10.3
OS X：スクショ撮影で覚えとおくと便利な5つの小技 - りんごが好きなのでぃす
Macの画面を撮影するときに使うキーボードショートカットは主に下の二つ。 画面全体を撮影：shift＋command＋3（数字キーはテンキーじゃない方） 画面の一部を撮影：shift＋command＋4 このうち、後者の「画面の一部を撮影」をする際に、一緒に覚えておくと便利な複合操作を以下に紹介します。 ウインドウ単位の撮影方法 shift＋command＋4を叩いた後にspaceキーを叩きます。これにより通常の選択範囲撮影モードからウインドウ撮影モードに切り替わります。 選択状態にあるウインドウは上図のように薄い "強調表示色" で塗られます。上図ではグリーンですが、通常はたぶんブルーだと思います。 ［memo］強調表示色：システム環境設定＞一般＞強調表示色 ちなみに撮影対象にデスクトップを選ぶと（これがウインドウなのかどうかはさておき）メニューバーやデスクトップアイコン、ウインドウ類が
pageres - 指定幅でのスクリーンショットをまとめて取得
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました コマンドで実行できるから自動化も楽々ですね！ レスポンシブWebデザインはブラウザ幅によって表示が変わるので確認が大変です。一つのURLごとに複数の表示を確認しなければなりません。 そんな手間を軽減してくれるツールがpageresです。コマンド一つで複数のブラウザ幅におけるスクリーンショットを取得してくれます。 pageresのインストール インストールはnpmコマンドでできます。 $ npm install -g pageres pageresの使い方 完了したらヘルプを出してみましょう。 $ pageres --help Get screenshots of websites in different resolutions. Usage pageres <url> [</ur
有料だったが無料化した超多機能スクリーンショットソフト「SnapDraw」
単に見ている画面のデスクトップやウインドウを画像ファイルとして保存するだけでなく、あとから矢印や説明付きの吹き出しを付けたり、鏡面反射・回転・パースを付けて立体的にするなどの特殊効果、さらには枠線・ウォーターマーク・余白の付加といった高度な編集機能までをも実現しているのがこのフリーソフト「SnapDraw」です。 以前は有料のシェアウェアだったのですが、現地時間2011年8月19日に突如「フリーソフトにする」と宣言し、一切の機能制限を持たない無料版としてリリースされました。もともと有料だっただけのことはあり、通常のフリーソフトの範疇をはるかに凌駕する機能が満載となっています。 Print Screen Capture Software with Special Effects, Annotation Tools and support for Windows 7, Vista and XP
Webサイトのサムネイル生成に。RubyでGeckoエンジンを操作する·MozShot MOONGIFT
MozShotはRubyでGeckoエンジンによるWebサイトのサムネイル画像を保存するソフトウェア。 MozShotはRuby製のオープンソース・ソフトウェア。WebサイトのURLを指定してスクリーンショットを撮影するサービスはニーズが多い。やはり単なるタイトルやURLといったテキストの羅列に比べて、サムネイルが表示されることによるインパクトの大きさがある。 MOONGIFT 一般的な手法としては、Webブラウザをリモートで操作してその画面を画像として保存する方法をとる。レンダリングをGeckoエンジンで行うならばMozShotを使うのが良いだろう。 MozShotはLinuxでXサーバを使い、gtkmozembedを使ってWebサイトをレンダリングし、そのキャプチャを画像として保存する。デモのCGIインタフェースも用意されており、Apache + mod_ssiを使って三パターンのスク
無茶し過ぎ。クライアントサイドでWebサイトのスクリーンショットを作成·html2canvas MOONGIFT
html2canvasはHTML5/Canvasを使って任意のWebサイトのスクリーンショットを作成するソフトウェア。 html2canvasはHTML5/JavaScript製のオープンソース・ソフトウェア。これはまた…非常に面白い、トリッキーなソフトウェアが出たものだ。Webサイトのサムネイル表示はニーズが高いサービスだ。単なるテキストではなく、サムネイルがあるだけでずいぶん華やかな表示になるからだ。 例 通常、その手の外部サービスを使う。自分で作るならばFirefoxやWebKitのレンダリングエンジンを使うだろうか。だがhtml2canvasは違う。JavaScriptだけでWebサイトのサムネイルを作ってしまう。 html2canvasのテクニックは簡単に言えばCanvasタグの中で独自のレンダリングエンジンを使って取得したHTMLを描き出すという方法だ。非常にマニアックで面白い
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Mapture - MacOS X向けキャプチャユーティリティ
GitHub - bbc/wraith: Wraith — A responsive screenshot comparison tool
fujitaiju.com