7日目の活動記録です。
今回は、
アイキャッチ画像のデザイン統一
を目標に作業を進めていきたいと思います！
やったこと
目標を達成するために、やったことを下にまとめました。
やったこと
①アイキャッチ画像の作成
②記事に設定した画像の変更
①アイキャッチ画像の作成
【具体的な内容】
「テンプレート」「設定メモ」「活動記録」で使用するアイキャッチ画像を作成しなおしました。
文字だけだと寂しいのでイラストも作成したのですが、以下の事を意識して行いました。
・色味の統一
⇒色は以前に決めた「ベースカラー」「メインカラー」「アクセントカラー」を中心に使う。
・イラストを多用しない
⇒イラストを多用するとごちゃごちゃして見にくくなってしまうので、
マスコットになるようなキャラに各記事の内容に合わせて「ノート」「メモ帳」「鉛筆」
などのアイテムを合わせたイラストにしました。
イラストは「Figma」を使用して作成しています。
※Figmaは本来、アプリ・Webサイトのプロトタイプを作成するツールですが、
個人的に作業がしやすいので簡単なイラストを作成する際にも使用しています。
実際に作成したアイキャッチ画像はこちらです。
マスコットにはバクを使っています。私が夢を見るのが好きなので、夢繋がりで選んでみました～
▼アイキャッチ画像
【感想】
アイキャッチ画像のデザインを考えるはかなり難しいですね。。。
画像内の文字やイラストの大まかな配置はすぐに決まったのですが、イラスト作成に時間がかかりました。
イラスト内で記事の内容ごとにアイテム（本・鉛筆・メモ帳）を登場させているのですが、
タイトルとイラストでイメージが伝わるように試行錯誤して作成しました。
絵は描けないので、図形のパス編集で作成しましたが、3時間近く時間がかかってしましました。
②記事に設定した画像の変更
【具体的な内容】
既に投稿している記事のアイキャッチ画像を新しい画像に変更しました。
せっかくなのでBefore / Afterを載せておきます。
▼「テンプレート」Before / After
▼「設定メモ」Before / After
▼「活動記録」Before / After
【感想】
アイキャッチ画像のデザインを揃えたことで、変更前にあったごちゃつき（画像・イラストが混在している状態）が軽減されたように感じます。ただ、記事内容の区別化のためのアイキャッチ画像なので、分かりにくくならないようにイラストのパターンを増やしておく必要がありそうですね。
まとめ
【満足度】
満足度は「5.0」です！
初めてアイキャッチ画像を作成したにしては、完成度が高いものが出来てとても満足です！
今後、増えるであろうアイキャッチ画像を作成する際はイラストのパターンを増やしておきたいと思います！
【気づき】
今回、アイキャッチ画像を作成する中で「デザイン統一」と「区別化」のバランスをとることの
難しさに気が付きました。
区別化するための要素であるイラストのパターンが少ないため、
デザインを統一しようと思ってイラストの配置を揃えると区別化が難しく、イラストを増やして
区別化しようとすると画像内のバランスや情報量の多さで見にくくなってしまうという点が難しいです。。。今後、アイキャッチ画像を増やす際は、そこを考慮して作成しないといけないですね。
【次回やりたいこと】
次回は、
メニューのデザイン変更 ～境界線の追加～
をしていきたいと思います！
コメント