以前、「素人っぽいデザイン」から抜け出すために、過去に自分で作ったデザインを見なおす3つのポイントという記事を書きました。今回は、その記事でも紹介したポートフォリオを制作してから３ヶ月後にリニューアルしたポートフォリオのサイトの話です。
目次
今回はこのようにリニューアルしました
以前作ったポートフォリオより３ヶ月後にリニューアルしようと思い。
リニューアルしたものがこちらになります。
今見るとすごく恥ずかしいところばかりですが、その時は「できたー！うほほーい」なんて喜んでいた気がします。
デザインを直したいところは沢山ありますが、それは後ほど…
自分の過去のデザインを見直して反省して、「今だったらここをこうした方がいいかも！」「ここはダサくない？」なんて自分に問いかけるようにしていけば、少しづつ成長すると思います。
「素人っぽいデザイン」ってこういうことなのかな？というのが見えてきます。そして「ここはこうした方がいいかも！」「ちょっとここはあのサイトのデザインを真似してみようかな？」なんてことも思ってきます。
新米webデザイナーさんも是非、過去に作った自分のデザインなどを見直してほしいです！！
以前のサイトを比べてみるとこんな感じになりました
変更点
- まずはじめに、グローバルメニューがすごい、メニューとしてわかりずらかったので、メニューなんですよ、とわかりやすくしました。
- スライダー画像ってそんなに強調しなくていいじゃないかな？と思い、サイズを小さくしました。
- 更新履歴が書いてあるのに、そこへ飛ばすリンクがないので、リンク付けた方が親切だよね！とうことでリンクすることに。
- ポートフォリオサイトなので、自分を知ってもらうためのSNSを大きくして強調してみました。
細かく見て、修正箇所を上げていく
以前、「素人っぽいデザイン」から抜け出すために、過去に自分で作ったデザインを見なおす3つのポイントの記事でも紹介したポイントで見なおしてみましょう！
あとは、全体的にのっぺり感がでてるんじゃないと思います。色使いがすべてベタ塗りになっているので、テクスチャを使ったり、グラデーションを使ったり、アイコンを使ったりして、もう少し盛りたいですね！
デザインを修正していく
と、いうことで先ほどの修正箇所を修正していきたいと思います。
修正したデザインがこちらです！
変更点
グローバルメニュー
アイコンを付けて視覚でわかりやすく。内側に１pxのラインを付けてより立体感を。
インフォメーション
インフォメーション欄を、リンクには下線を付けて、リンクというのがわかりやすく。
カテゴリーごとに、ラインを付けて、区別をしました。
あとは、グローバルメニューと対になっているということがわかるように、グローバルメニューで使ったアイコンを付け足してみました。
ソーシャルリンク
ソーシャルリンクが主張していたので、ソーシャルメディア欄を消して、ヘッダーにアイコンとしてもっていきました。
修正前、修正後
ということでこんな感じになりました。
ということで、自分が過去に作ったデザインをみて、色々なところを直していったり、反省点を探していけばきっと少しづつ成長すると思いますので、是非、新米のwebデザイナーさんも自分が過去に作ったデザインを見なおしてみてはいかがでしょうか！
