😧

初めてのweb制作でレイアウトをミスった話

2022/05/15に公開

現在、授業の振り返りも兼ねて自己紹介webを作ろうと試みています。
まずはレイアウトを考えようと意気込んで、keynoteで形だけ作ってみました。
以前フリーペーパーを作っていたのでこういったデザインは自信がある!
四角いブロックを意識して、空白はあまり作らないように...
そうして出来上がったものが以下になります。

(、、、うーん、悪くはないけどサイトっぽくはない。)

古い英字新聞のようなデザインを考えていたのですが、その思考に引っ張られすぎてフリーペーパー感が強い。
実際にwebに起こしてみましたが、画面幅ギリギリまで文字があるのでとても見にくいwebになってしまいました。
これはいかん!作り直します。

先程のデザインをwebデザインの先生に見てもらい、アドバイスを頂きました。

*画面幅いっぱいまで文字を詰め込まない。

*できるだけフォントは1種類か2種類にまとめる。

*メリハリをつけると良い。

上記のアドバイスをもとにデザインし直したものが、以下になります。

幾分マシになったかな?
縦長英字新聞のデザインが思いつかなかったので、今回は洋風の建物をイメージして作りました。
窓枠等のパーツはIllustratorで補っています。

先生のアドバイスを参考に、縦中央に視線がいくよう両脇に空白を置くことを意識しました。
以前に比べ、視点が中央に安定して見やすくなったように感じます。
もしかしてこれがUI/UXデザインなのか...!?

課題点として残ったモヤモヤは、
やっぱり英字新聞デザインのwebを作りたい! という点と、
Illustratorでパーツを作ったけど技術が足りなすぎて正直気に入っていない点。
UXデザイン重視で考えた割にはそこまで印象的なwebでも無いし、見やすさも微妙かな...メリハリもついて無いし...

もっと色々なデザインを見て、感性も技術も鍛えたいですね!!

Discussion