COLUMN コラム

 
デザインスキルを磨くには、日頃から多くのクリエイティブに触れて、アイデアを蓄積しておくことが大切です。
 
私は今までインスピレーションの元になりそうなWebサイトを、ギャラリーサイトなどで検索してはEvernoteやPinterestにまとめて管理していました。しかし、数が増えてくると管理することが難しくなり、いざ参考にしたい時に目当てのデザインを見つけることができなくなっていました。
 
画像管理に向いている便利なツールがないか探していた所、「Eagle」という画像収集＆管理アプリを見つけました。無料体験版を使用してみた所、その便利さに「Notion」と同じくらいの衝撃を受けたことを覚えています。
 
今回はWebデザイナーのデザイン学習に最適な「Eagle」について紹介いたします。

1. Eagleとは

【 Eagle公式サイト 】
 
対応環境：Windows / Mac
価格：$29.95（3,423円 … 2021年11月現在）
1ライセンスで2台のデバイスまで利用可能。
 
Eagleはオンライン上の画像収集と管理をするアプリです。画像収集とはいっても動画や音声、フォント、テキストファイルなどにも対応しており、デザイン制作に必要な素材をまとめて管理することができます。サブスクリプションサービスではないので、一度購入すれば費用は発生しません。

2. Eagleをオススメする理由

2-1. 保存作業が楽

 
EagleはChromeの拡張機能「Eagle for Chrome」を利用することで、サイト上の画像をドラッグ＆ドロップするだけで保存できるようになります。また、ページの一部または全部のスクリーンショットもショートカットで実行することができます。Eagleを使うとアイデア収集のスピードが早くなることを実感できます。
 
・バッチ保存　…　サイトに使用されている画像をまとめて保存できます。（選択することも可）
・エリアをスクショ　…　ページの一部を選択して保存することができます。
・ビジブルエリアをスクショ　…　ブラウザ上で見えている部分だけを保存します。
・ページ全体をスクショ　…　ページ全体を保存します。
 

2-2. 素材管理が楽

 
保存した画像はタグで管理することができます。また、タグ以外にも画像の「形」「カラー」「タイプ」「サイズ」などを自動で判別して、絞り込み条件として使用することができます。これらの条件を「スマートフォルダ」機能で設定することで、目当てのデザインを簡単に整理することができます。
表示形式も「ウォーターフォールレイアウト」や「整列レイアウト」など、いろんな見せ方があり、管理するフォーマットに合わせて切り替えできるのも良いです。
 
私は保存した画像の参考にしたい要素（配色、レイアウト等）や使用されているフォントをタグに登録しています。フォントを登録しておくと、和文フォントと英文フォントの組み合わせや、女性向けに合うフォントなど、現場で使われるパターンを知ることができてデザイン制作に役立っています。
 

2-3.　コメントが書ける

 
画像の任意の箇所に感想やコメントを書くことができます。
 
私はただ画像を保存するだけでなく、なぜこのデザインが良いと思ったのか、その理由を書いておくようにしています。良いと思った理由を言語化しておくことで、自身がデザインしたものをプレゼンする際にも役立ちます。また、これを繰り返すことで、今多く使われている表現や、デザインの規則に気付くこともあります。
 

2-4.　対応フォーマットが豊富

 
Eagleは画像だけでなくフォントや音楽、動画まで管理することができます。様々なファイル形式に対応しているため、デザインの素材管理にも最適です。特にWebデザイナーは様々なフォントをPCにインストールしているケースが多いので、どんなフォントを入れていたかを確認するにはEagleは非常に便利なアプリです。
 

３. おわりに

今回はWebデザイナーにオススメの画像収集＆管理アプリ「Eagle」を紹介しました。
 
私はこのEagleとNotionを併用することで、デザインとコーディングに関するノウハウを蓄積して、現場で活かすことができるようになったと実感しています。Webデザイナーでデザインの学習法に迷っている方は、ぜひ「Eagle」を試してみてください。（30日間の無料体験版があります）
 
Eagleでデザインのアイデアを収集して、いつでもアウトプットできる環境を整備しておきましょう！