ブログのデザインを刷新した。 自分の中でかなり「かっこいい」に寄せられた気がして、しばらくトップページを眺めてしまうやつ。
どこが良くなったのか
以前のデザインは「読める」ことは満たしていたんだけど、どこか素っ気ないというか、作業感が残っていた。 今回の刷新で、少なくとも自分の中では次の点が良くなった。
- 余白と情報のまとまりが自然になって、視線が迷いにくい
- 見出しや本文のリズムが整って、読むテンポが作れる
- サイドバーの存在感がちょうどよくなって、記事一覧が追いやすい
「内容が主役」なのは変えたくないので、派手にしすぎず、でも“ちゃんと作ってある感”は出す、みたいな落とし所を狙った。
Figmaで作ってから実装した
今回のデザインは、いきなりコードを書き始めたわけじゃなくて、まずFigmaで形にした。
- 画面全体のレイアウト（どこに何が来るか）
- 余白の基準（詰めすぎない/空きすぎない）
- 見出しのサイズ感と階層
こういうのを先に決めておくと、実装中に「なんか違う…」って沼る時間が減る。 コードの調整はもちろん必要だけど、方向性が見えているだけで気持ちが楽。
みんなもFigma使おう
デザインって、才能よりも「試行回数」と「戻れる仕組み」だと思う。 Figmaは、その“試して戻る”をすごく軽くしてくれる。
- とりあえず置いてみる
- だめなら戻す
- 何パターンか並べて比較する
この流れが簡単に回せるだけで、完成度が上がりやすい。
まとめ
ブログのデザインを刷新して、かなり気に入った見た目になった。 そして今回はFigmaで作ってから実装したことで、迷いが減って作業が進めやすかった。
もし個人開発で「見た目もちゃんと整えたい」気持ちが少しでもあるなら、Figmaは一回触ってみる価値があると思う。