WEBデザインの収集、スクショをするなら「Clipular」が便利!

こんにちは!デザイナーの波塚です。

ここ1年はWEBサイトのデザイン収集に「Clipular」を使っています。もうこのサービスなしでは生きていけません。

さて、今回はWEBサイトのデザイン収集に役立つこと間違いなしの「Clipular」の使い方についてです。ブラウザのスクリーンショットをオンラインで保存しておけるツールで、Chromeの拡張機能として利用できます。

スクショでデザインの収集ができるので、あとで探すときに見つけやすい!!ビジュアル化!

目次

  • WEBサイトデザイン収集に便利な「Clipular」とは?
  • 「Clipular」を登録する方法
  • 「Clipular」の使い方
  • まとめ

WEBサイトデザイン収集に便利な「Clipular」とは?

「Clipular」はWEBサイトのスクショをオンラインでコレクションできるツール。
サイトに登録→Chrome拡張機能を入れる→ボタンポチで保存されます。
https://www.clipular.com/welcome

「Clipular」に登録して、実際にデザインを収集する時はChromeの拡張機能と連携して使う形です。
とても手軽にWEBサイトのデザインを収集できるのでオススメです!

「Clipular」を使うメリット

メリットは、サイトをビジュアルで保存しておけることです。

ブックマークだとどこサイトがどれだったかわからなくなるので、「Clipular」を使わない選択肢はないと思ってます。
また、登録したサイトはタグ付けでき、カテゴリ分けできることに加え、タグごとのまとめページも作成できます。

  • Chromeの拡張機能として手軽に使える
  • パーツごとのデザインを集めるのに適している
  • 保存したスクショを簡単に共有できる
  • 保存したスクショをタグで管理できる
  • 保存したスクショはpngで出力できる
  • タグ分けでき、タグでまとめページを作れる

「Clipular」を登録する方法

Clipular

「Clipular」のサイトに登録する

「Clipular」のサイトを開いたら、「GET STARTED」を押してユーザー登録をしてください。
登録はFacebookまたはGoogleアカウント、メールアドレスでも可能です。

chromeの拡張機能が必要なので、Googleアカウントがオススメ。

「Clipular」のChrome拡張機能を入れる

実際にスクリーンショットを保存するためにChromeウェブストアから拡張機能をダウンロードします。

拡張機能ダウンロードはこちら↓

https://chrome.google.com/webstore/detail/screen-capture-screenshot/cjbjepchlgclmpinlbbeinajphohgfod

これで使う準備は完了です。

「Clipular」の使い方

使い方は簡単で「クリップを保存する」「管理する」の2つのみです。

選択した部分だけをクリップ保存する

拡張機能ボタンから「選択アイコン」をクリックすると選択した部分をクリップすることができます。
好きなパーツだけを保存する時に使います。

見えている部分をクリップ保存する

「ブラウザのようなアイコン」をクリックすると、今表示されているブラウザ画面をクリップ保存できます。
個人的にはこれをよく使うかなと思います。

サイト全体を保存する

これは最近できた新機能です。
サイト全体のスクショを保存することもできるようになりました。
一覧では少し縦長に、クリック後のポップアップでサイト全体のスクショがスクロールして確認できます。

サイト全体をパッと見たい場合にはこちらがオススメ。pngで出力もできます。

その他ボタンの機能

①保存したサイトのurlをコピー

②保存したスクショをpng出力

③保存したサイトの一覧を見る

タグ付けのコツ

保存サイトが増えてくると結構探すのが大変になってきます。必ずこまめにタグ付けすることをオススメします。
あらかじめカテゴリわけを決めて置いて、統一性も重視するべきです。
カテゴリについては大手のギャラリーサイトなどを参考にしています。

タグは一括でつけることもできます。
左上の「group」ボタンを押して複数選択してみてください!

ステキな共有機能

共有機能も兼ね備えた「clipular」は至れり尽くせり。

保存したスクショのurl共有が可能

保存したサイトの共有ボタンをクリックで、スクショのurlをコピーできます。

ツールとしての安定性は?

肝心になるのがツールとしての安定性。私が1年以上使った時点では、一度数日サイトが落ちていたことがありましたが、それ以外は特に不具合はありません

機能も追加されたりと今後にも期待できます。

まとめ

デザインを収集するツールは様々ですが「Clipular」はWEBの保存に特化しているように感じます。
特にWEBサイトをパーツごとにストックする際にとても重宝するツールなのでこれからも活用していこうと思います。

  • シェア
  • twitter
The following two tabs change content below.
Avatar photo

波塚浩平

デザイナー&コーダー株式会社インファクト
デザイナーの波塚です。昔からものづくりが好きで、なんでも自分でつくりたくなってしまうことが多いです。好きな言葉は「若いときに流さなかった汗は、老いてから涙となって返ってくる」です。後で後悔しないよう、今を全力で突き進みます!
  • twitter
  • このエントリーをはてなブックマークに追加
PAGE TOP
LINE it!