WEB

「アイキャッチってなんだろう?」1,000個以上を制作して学んだこと

「アイキャッチってなんだろう?」1,000個以上を制作して学んだこと

デザイナーの佐藤タカアキ(@sato_tkaaki)です。

僕は2年半くらい前に LettersとLIGのコラボ記事でLIGのことを知って、デザイナー募集記事をきっかけにLIGへ入社しました。そして当時メディア事業部のデザイナーだった王さんからLIGブログのアイキャッチの仕事を引き継がれ、現在ではその制作数も1000を超えました。

そこで今回は、LIGブログのアイキャッチ画像について、制作過程や制作から学んだことなどをお話しします。

そもそも「アイキャッチって何?」という方は「ブログの集客を加速させる「アイキャッチ」とそのデザインについて」をご一読いただけますと幸いです。アイキャッチの概要や必要性、効果的な魅せ方について書いています。

LIGブログはなぜアイキャッチにこだわるのか

z2

他のメディアではフリー写真素材をそのまま使ったり、ちょっとテキストを加えただけの写真を使ったりする中、LIGブログはやたら社員を出していたりめっちゃ合成していたり、やけにこだわっていますよね。僕自身、入社前に外から見ていて感じていました。

こだわっている理由は、大きく分けると2つあるかと思います。

1. 個人のブランディングのため

LIGブログは個人のブランディングができる場でもあるため、筆者の情報がわりと大きく表示されたり、メンバーページでもその人がこれまでに書いてきた記事が一覧で並べられたりしています。
そうして見せている「個人のカラー」を、アイキャッチでも表現することがあります。

2. LIGブログ全体のブランディングのため

僕なりにLIGブログのブランディングを分析をしてみたのですが、「アンバランス」であり「アンバランスさでバランスをとっている」という表現が答えとして浮かんできました。(あくまでも僕個人の見解です)

スーツで砂浜に埋まったり、求人記事なのにふざけていたり、トップへ戻るボタンで無駄にウザさを主張して目立たせたり。表に出て目立つのは、面白いコンテンツやふざけたコンテンツです。
しかし、フタを開けてみるとWeb制作や求人サービス・ECサイトの運営、シェアオフィスやゲストハウスの運営など手広い事業をごく真面目にやっていたりします。

他社がやっていないし、やる必要性を感じにくい&直接利益につながらないところをあえてこだわっていく、その「アンバランス」な姿勢がLIGブログのアイキャッチで表現されてきたのではないかと思います。

LIGブログのアイキャッチ制作フロー

z1

「アイキャッチにかける時間は1日2時間」と上司そめひこから言われてきました。(他の業務も考えると2時間しかかけられない。まあ終わらないんですが! 迫り来る時間!)

「1枚の絵をパパっと数枚作るだけじゃん」って思うかもしれませんが、意外と骨が折れる作業だったりします。以下で実際にLIGブログのアイキャッチを制作していく過程をご紹介します。

1. 記事を読む

記事を読み、筆者が何をポイントとしてこの記事を書いたのか、大きく3つほどポイントを抽出して優先順位を決めます。

2. 記事を深く理解する

何について書かれている記事なのかちんぷんかんぷんな場合もあったりするので、そういうときは筆者本人に記事概要を説明していただいたり、編集部と相談してポイントを抽出します。
ここで言う概要の把握とは「何について書かれた記事」「一番伝えたいキーワード(思い)は何か」を理解することです。

3. ターゲット選定

次に、その記事を誰に伝えたいかを考えます。ターゲット層はだいたい3つに分けられます。

  1. キーワード検索で記事にたどり着いたユーザー
  2. LIGブログに毎日訪れてくれるユーザー(技術者、メディア関係の方、LIGブログファンの方などなど)
  3. 筆者の周りの人(Facebookの友人、Twitterのフォロワーなど)

おおよそ、技術系の記事であれば1、バズ狙いのおもしろ記事であれば2、筆者の思いや見解を伝える記事であれば2や3、と分けられるのかなと思います。

4. コンセプト設計

次に、その記事をターゲット層に向けてどんなデザインで表現し伝えるかを頭の中ないしはテキストベースで固めていきます。

筆者が伝えたいキーワード(思い)は、文字で表現した方がいいのか、色で表現した方がいいのか、写真で表現した方がいいのか、絵で表現した方がいいのか。文字のフォントは、色の組み合わせは、写真の構図は、絵のテイストは、と記事の内容とターゲット層によって1つの軸を元に深く掘り下げていきます。

写真を使用しないデザインであれば、上記フローを元にPhotoshopやIllustratorを使用しアイキャッチを作りあげていきます。

5. 社内モデルのアサイン

eyecatch2-655x437

写真メインのアイキャッチの場合はモデルをアサインします。

記事によっては写真の方が伝わりやすかったり、人の顔を出した方がソーシャルでのクリック率がよかったりするなどの理由もありますが、「社員のブランディング(ひいてはファンの獲得)」「記事の熱量をストレートに伝える手段」として社員の写真を使用することが多いです。

ただ、本質的な狙いは「顔を知ってもらうこと」だと思っています。
外に出て人と会ったときに初対面であったとしても、社員の顔を出した記事をクライアントが見ていれば、壁を一つ取り払うことができて、会話のきっかけとしても機能してくれるのではないかと期待しています。

6. 撮影

モデルをアサインしたら、構図・表情・ポーズ・シチュエーションを考え頭でイメージし、その場で配置や表情などの指示出しもしながら撮影を進めていきます。

大きな撮影になると絵コンテを用意する必要もあるかと思いますが、社員の自然な表情を引き出すためにもあえてガチガチには固めず、臨機応変にシチュエーションを変えポーズを変え撮影していきます。

一番多いときで、撮影した枚数が500枚を超えることもありました。

7. デザイン

設計したコンセプトをもとに、ようやくデザイン作業に入ります。

今まで制作したアイキャッチやその他のデザインをそのまま真似るだけなら5分10分で終わりますが、こうしたフローを踏まえるとさすがに時間がかかってしまいます。ただ、その過程を経ることもデザインの1部ですし、その過程を経ていないものは果たしてデザインと呼べるのでしょうか。

力がない内は、時間をかけてでもこの過程を心身に染み込ませて地力を上げていくのが、長い目で見たときの制作時間の短縮にも繋がるはずです(自戒も込めて)。

反省と振り返り

z3

この度、アイキャッチ制作業務を新米デザイナーのんちゃんに引き継ぐことになったので、その反省と振り返りを少しだけ。

気をつけたこと

僕は元々大のLIGファンで、本当に本当に昔のアイキャッチもなくてテキストも100字程度しかない記事まで遡って見返すくらいにはLIGが好きです。それもあって、これまでのLIGブログを築いてきた社員や外部ライター、ファンの方々には本当に尊敬の念を抱いています。

昔から地道に作り上げられてきたLIGらしさを損なわず、より洗練されたクリエイティブにすること。
LIGブログに対する内部からの目、同業からの目、読者からの目や実際の声、過去の記事やSNS投稿、果ては社長や社員が個人的にやってるブログなどからヒントを拾い、「LIGらしさ」を作り上げることに一番の注意を払ってきました。

もう一つは社員のブランディングです。
これは今でも研究中ですし、正解がわからず外部ライターや社員の方々には大変不快な思いをさせてしまったこともあります。自分が時間をかけて書き上げた記事のアイキャッチがイメージとズレてたりイケてなかったらそりゃあ嫌ですよね。
社員数も増えてきて、より難しくなってきましたが、上記にあげた方法でヒントを集めていくことで、社員をもっと知っていかなければならないと考えています。

大変だったこと

やはり、時間との兼ね合いです。
よく「時間をかければ誰だっていいモノを作れる」と言いますが、逆に能力がない内は時間をかけないといいモノは作れないとも思います(時間をかけたからっていいモノが絶対作れるわけではありません)。

「アイキャッチ制作にかけていい時間は2時間」という教えを破って、コソコソと時間をかけて1つのアイキャッチを作り、まだまだ浅い考えしかできていないであろう自分でも、深いところまで考えて作ったときは1つのアイキャッチを作るのに最低2時間はかかってました。
時間がかかっても、1つのアイキャッチ制作からなにか糸口を見つけたり思考のフローを体に覚え込ませることによって、少しずつですが時間の短縮が可能になりました。

改善したこと

まだまだ経験の浅い僕ですが、それでも制作を続けるにつれて制作時間が短くなってきました。時間を短縮できたことによって少しですが余裕ができます。その余った時間を使い、過去に作成したアイキャッチと僕が入社する以前のアイキャッチの見直しをおこないました。

今見ると「これ何も考えられてないやん」と突っ込みたくなるようなデザインが多々あり、その記事をもう一度読み直してリデザインするという地道なことをやってました。

アイキャッチ制作から得られたもの

2年間のアイキャッチ制作業務から得られたことを振り返りのためにも書き起こしておこうと思います。

Photoshop技術

一番身についたのはPhotoshopの技術力じゃないかと思います。
これは前任者の王さんがPhotoshopマスターだったこともあり、彼の過去制作物のPSDをいじりまくったり、無茶振りに応えるためにPhotoshopの機能を駆使しまくったりしたおかげかなと思います。(いつかPhotoshopの機能&実例技術本を書きたいです)

個人ブランディングの重要性に気づいた

入社当初は「ブランディング」という言葉をあまりわかっていませんでしたが、個人としてブランディングをやることの重要性を学ぶことができました。

LIGには個人をメディアとして考えブランディングしている人が多数います。
そこから仕事につなげる人もいれば、やりたいことをやれる環境作りを可能にしたり、LIGというブランドの中に個人としてのブランドを構築し、より自分の生活を豊かにしていく人もいます。LIGの理念でもある「Life is Good」を自分で生み出し、周りにも影響を与える、そんな場面を多々見てきました。

客観視することの重要性に気づいた

僕自身、内部外部へのアンテナは張ってる方でLIG関連のエゴサもめちゃくちゃやります、ほぼ毎日やります。そんなことばかりやってると、否定的な意見が出てくることも多かったりもします。
しかしそれは本当にありがたいことで、自分では気付けなかった、自分に足りない部分を埋めていくための今後の指標にすることができるということを学びました。

自分自身が作ったもので「これはいいだろう」と自信満々に作れたものは正直1つとしてなくて、逆に他人の作る制作物にはすぐ尊敬の念を抱いてしまい、劣等感ばかりが溢れてしまいます。
ただこれも自分自身の制作物を客観視し分析をおこない、他人の制作物にも同じような考え方で見ることができれば、すべて自分へのプラスの要因として働くのではないかと思いました。

まとめ

「アイキャッチってなんだろう?」と思ってから2年が経ちました。

どんな記事なのかパッと見でわかればいいんじゃないのかな、とも思っていましたが、アイキャッチ制作を経験し、まわりの方々からアドバイスをいただくことで、アイキャッチに対する考え方に幅広さを持つことができました。

今後もLIGブログの監修としてデザインに携わったり、1ファンとしてLIGブログを楽しみつつ、アイキャッチのクオリティに日々疑問をふっかけていければと思います。ダラダラと5000字ほど書き連ねてきましたが、ただの1デザイナーの拙い文章をここまで読んでくださり本当にありがとうございました。

この記事を書いた人

佐藤タカアキ
佐藤タカアキ デザイナー 2014年入社
3年目に突入したのですが、デザイナー兼カメラマン的なフワフワした立ち位置で、良くも悪くも毎日多忙な日々を送っているフリをしています。