こんにちは。
今日はnoteのプロフィールアイコンを作った制作過程を、
Webデザインの勉強記録として残しておこうと思います。
投稿が少しずつ増えてきた中で、
「この人の文章だ」と伝える入口になるプロフィールアイコンについて、
一度きちんと考えてみたいと思いました。
なぜアイコンを見直そうと思ったのか
noteでは、
記事一覧やフォロー画面などで
アイコンがかなり小さく表示されます。
そのため今回は、
・凝りすぎない
・主張しすぎない
・文章の邪魔をしない
ことを前提に、
「小さく表示されること」を強く意識して作ることにしました。
最初に作ったアイコン(Before)

小さく表示すると要素が多く、視線が散るように感じました。
この段階では、
・円や装飾の存在感がやや強い
・人物より背景に目がいってしまう
という点が気になりました。
どこをどう直したか
Beforeを見ながら、
次の点を意識して調整しました。
・円形にトリミングされる前提で
顔〜本が中心にくる配置にする
・装飾は主役ではなく
フレームとして弱める
・人物の線をほんの少しだけ強めて
小さくしても沈まないようにする
大きく変えるというより、
「見え方を整える」という感覚での調整です。
調整後のアイコン(After)

noteのプロフィール用としてしばらく使ってみることにしました。
小さく表示したときににも、
・人物がわかる
・本を読んでいることが伝わる
・全体がうるさくならない
という点を重視しました。
今回の結論
今回のアイコンは、
「これが完成形」というより、
「今はこれでいく」という位置付けです。
投稿が増えたり、
書く内容や雰囲気が変わってきたら、
また見直すこともあると思います。
アイコンも、
発信と一緒に育てていくものだと感じました。
作ってみて感じたこと
今回の制作を通して、
・デザインは見た目だけでなく
使われる場面を想像することが大切
・小さな調整でも
印象はしっかり変わる
ということを改めて実感しました。
Canvaでも、
考えながら作れば
十分に学びのある政策ができると感じています。
まとめ
今日は、
・Beforeを確認する
・課題を言語化する
・Afterで判断を下す
という流れで、
noteのプロフィールアイコンを整えました。
完成品だけでなく、
その判断の過程を残すことも
Webデザインの勉強として大切だと思い、
今回記録としてまとめました。


コメント