2019.8.19
知っていると便利なChrome拡張機能6選
いわん

こんにちは〜!
Webをメインにグラフィックもちょっとやってるデザイナーのいわんです。

突然ですが、デザイン制作するときに少しでも楽がしたいと思うこと、ありませんか?

Chrome拡張機能

 

chrome ウェブストアにある拡張機能には、様々なものがありますが、皆さんはどのくらいその機能を使用していますか?
私は少ない方だと思いますが、その中で普段少しでも楽をする効率を図るために使用しているChrome拡張機能をご紹介させていただきます。

スクリーンショット「FireShot」

FireShot

Webサイトを閲覧しているとき、気になったサイトを「スクショ取りたいけど、ページ全体を1回で済ませたい!」ということがありませんか?

そんなときは、このFireShotがオススメです!!
このツールは、

  • ページ全体をキャプチャ
  • 表示部分をキャプチャ
  • 選択範囲をキャプチャ

の3通りの中からスクショの撮り方を選ぶことができます。

また、拡張子もjpg、png、pdfの中から選ぶことができるので、PCの機能やブラウザのデベロッパーツールを起動してスクショを撮るより楽に作業ができます。

 

検索ソート機能「あと1年」(最新1年以内検索)

ato-ichinen

Webサイトを検索しているとき、古い更新日のサイトばかりが結果として表示されるときはありませんか?
検索結果画面に表示された【ツール】の中にある「期間指定なし」というところから、改めて更新期間を指定することで時間を細かく設定することができますが、この機能はタブやウィンドウを新しくするとリセットされてしまい、また設定し直さなければなりません。

そんなときは、このあと1年がオススメです!!
この機能をアクティブにしている限り、ずっと自動で最新1年以内に公開・更新されたWebサイトを検索してくれます。

 

ウィンドウリサイズ「Window Resizer」

Window Resizer

ウィンドウサイズによって表示される状態を確認したいけど、手動でサイズをピッタリ合わせるのって難しくありませんか?
そんなときは、このWindow Resizerがオススメです!!

このツールは、指定したウィンドウサイズに変更してくれるのはもちろん、プリセットからサイズを指定したり、Viewportの調整など、機能がたっぷり!
特にデザインをチェックするときは大活躍しています。

 

閲覧サイトURLのQR化「QRCode」

QRCode

表示しているWebサイトのURLをQR化してくれる拡張機能は様々ありますが、色々試して落ち着いたのがこのQRCodeです!

QR化するのが早く、シンプルにQRのみ表示してくれるので、とにかくわかりやすい。
テキスト情報など一切必要なく、ただQRのみ表示してくれるのであれば、このツールがオススメです!!

 

使用フォントを表示「Fontface Ninja」

Fontface Ninja

Webサイトを見ているとき、気になったフォントがあったりしませんか?
最近はWebフォントを適用しているサイトも多く、気になったこのフォントを使ってデザインしてみたい!ということもあるかと思います。

そんなときは、このFontface Ninjaがオススメです!
このツールは、表示しているWebサイトで使用されているフォントの種類を表示し、使用されている太さはもちろん、さらにその入手先まで教えてくれる。
わざわざデベロッパーツールを開いて調べなくても良い、優しい設計のツールです。

 

デザインカスタムツール「VisBug」

VisBug

こちらはデザイナーだけではなく、ディレクターやエンジニアにもおすすめのツールです。

VisBugはブラウザに表示されたページのデザインやコンテンツを検証・編集することが可能です。
デベロッパーツールでもある程度のことは可能ですが、このツールはもっと直感的にふれることができます。

動画で動きが見たい場合は、ストアページのスライド2つ目にある動画の23:00あたりにあるので、そちらをご覧ください。
英語なのでよくわからない、日本語の解説求む!って場合は、私も普段からお世話になっているcolissさんに詳しく載っているので、そちらをご覧ください。

 

以上6つのツールをご紹介させていただきました。
次回は、デザインをするときに使用しているツール系サイトか、PhotoshopやIllustrator、XDの文字設定のCSS変換のお話をできればと思います。

  • TWEET!
  • SHARE!