トレース01

模写させていただいたwebサイト

http://www.pwc-internship.com/

見本

f:id:wakeup_y:20180522083424p:plain

ワイヤー

f:id:wakeup_y:20180522083624j:plain

  • ワイヤーとよべるのか?笑
  • 情報の境目に線をいれるなりしないと見返したときに意味不明かも。
  • 反省

トレースしてみました

f:id:wakeup_y:20180522132527j:plain

  • 見出しなど画像が使われていた部分のトレースは、なるべく手持ちの似たフォントで対応しました。
  • 「PROGRAM」の1日の流れのHTML・CSS構造について、矢印だけをliにくみこんでいるのかなと思ったら、見出しの画像もセットで組み込まれていて、こういう手もあるのかと思いました。
  • 背景だけじゃなくて、文字もグラデーションになっていたのに気づいて、これはCSSでやろうと思ったらできるのかな?と疑問におもいました。
  • buttonが画像だったけど、HTMLでもよさそうと思いました。
  • 「 VOICE」にリアリティを感じづらかったので、自分だったらもうちょっと社員の表情などがわかる写真をvoice1、2それぞれに使うかな?とおもいました。

まとめ

f:id:wakeup_y:20180522141529p:plain

  • marginのルールがあまり定まってないかも

所感

  • 色合いが可愛くてトレースしていて楽しかったです。
  • photoshopでトレースしましたが、XDのほうが使いやすいなあと思う部分が多々ありました。(ガイドやリピートグリッド等)多分photoshopの使い方が悪いんだとおもいます。
  • 画像がふってくるよりじわっと表示されるアニメーションだったらどうなるのか気になる。
  • アニメーションやりたい。