![見出し画像](https://assets.st-note.com/production/uploads/images/71557270/rectangle_large_type_2_e86fe42840293f09de413aa1a730efeb.png?width=1200)
デザイン分析#011 | Renxa
![](https://assets.st-note.com/img/1644072480294-FlWhUBucCJ.png?width=1200)
■FV
シンプルで洗練されたレイアウト
都会的な印象を受ける
fvではXをモチーフに、連鎖をイメージするアニメーションが実装されている
■書体
英語:futura pt
日本語;游ゴシック
■配色
ヌーディーな配色
海外サイトで使用されているような色トーンで、洗練されたイメージになっているのかと思った
![](https://assets.st-note.com/img/1644073407568-LUg0d4ETPv.png?width=1200)
■余白
コンテンツ、テキスト間の余白
128px 80px 64px
広めの余白がとられている
![](https://assets.st-note.com/img/1644072780731-nnXGyfBjoc.png?width=1200)
平文 14px linehight35px
写真があえて見切れるようなレイアウト
![](https://assets.st-note.com/img/1644073812766-Lajd16Bi4W.png?width=1200)
タイトル部分:英字35px、日本語10px 余白20px
平文:12px タイトルとの間余白72px
ホバーで各コンテンツの写真が表示されるモーション
メニューはハンバーガーメニュー 形式
モバイルに最適化されたレイアウト
![](https://assets.st-note.com/img/1644074175226-z625AA28y4.png?width=1200)
お問い合わせ案内がフッターにかかるようなレイアウトが特徴的
![](https://assets.st-note.com/img/1644074385028-WUEiEEetuX.png?width=1200)
余白を広くとったレイアウトで洗練された構成になっている
32px 40px
![](https://assets.st-note.com/img/1644074391589-aSHFtoYsSm.png?width=1200)
![](https://assets.st-note.com/img/1644074939644-1fvkEfE2KF.png?width=1200)
写真は、コントラストが強く、青みがかったている
■まとめ
IT会社やマーケティング会社のコーポレートサイトなど、都会的なデザインを作成したいときに文字組や余白の取り方が参考になりそうだと思った
この記事が気に入ったらサポートをしてみませんか?