その他

2022.07.27

【サイトレビュー#39】細かい工夫がたくさんあるアメリカのローン会社のサイト

こんにちは!

Webデザインアワードで入賞しているWebサイトのご紹介第39回です。

今回も引き続き「CSS Design Awards」または「Awwwards」の中から特に目に留まったWebサイトをご紹介していきます!

ご紹介Webサイト「Autonomy」

https://en.autonomy.finance/

今回ご紹介するWebサイトは、アメリカのローン会社の「Autonomy」です。
こちらのWebサイトは、CSS design AwardsとAwwwardsどちらも入賞しています。

▼CSS Design Awards掲載ページ
https://www.cssdesignawards.com/sites/autonomy/35514/

▼Awwwards掲載ページ
https://www.awwwards.com/sites/autonomy

真似したいポイント

申し込みたくなる工夫がある申込フォーム

申し込みフォームにただ金額や必要項目を入力する欄だけでなく、数値を調整できるバーがついています。
また、左側にあるメニューアイコンの中身も申し込みフォームとなっており、ページ内のどこを開いていてもすぐにフォームを開くことができます。
ただの入力欄だけではなかったり、どこからでも申し込める様なひと工夫が入っていると、ついつい申し込んでみたくなると感じました!

すごい!と思ったポイント

立体感のあるアニメーションが入ったロゴ

トップページを開くと、最初に立体感のあるロゴが表示されます。
こちらのロゴはただ立体的なだけでなく、マウスカーソルの動きに合わせて向きが変わる様になっています。
ついついマウスカーソルを動かしたくなる面白い動きで、すごい!と思いました。

物が溢れてくるようなアニメーション

先ほどご紹介したFVをスクロールすると、画面の右側がキャリーバッグ、椅子、指輪などの物でどんどん埋め尽くされていきます。
全て埋め尽くされた後、全てが上に散ってゆき、次のコンテンツに入るようになっています。
次のコンテンツまでのスクロールの量はありますが、遊び心があるアニメーションだと思いました!

まとめ

今回ご紹介した部分以外にもボタンなど細かい部分に動きが入っており、見ているのがとても面白いサイトでした!
ぜひ実際に見てみてください!

前回のレビューはこちら!

この記事をシェアする

関連記事

  • 2022.09.15

    【チャレンジ企画】あの某アーティストのジャケ写再現してみた

    その他

    デザイン

  • 2022.09.08

    この世界はコードでできている#2

    コーディング

    その他

    制作

  • 2022.09.08

    【動画編集時短術】プレミアプロに用意されているトランジションテンプレートのおすすめ15種類を紹介!

    その他

    制作

    動画

おすすめ記事

  • 2022.04.22

    【第1回】Photoshopでテキストの一部の色を変える方法!<初心者向け>

    デザイン

    制作

  • 2021.09.29

    【簡単】プロのようなデザインが作れるツールCanva(キャンバ)のおすすめポイント

    デザイン

  • 好きなフォントは?現役WEBデザイナーに聞いてみた!

    2022.06.01

    デザイナーなら好きなフォントの1つや2つあるでしょ?現役WEBデザイナーに好きなフォント聞いてみた!

    デザイン

    制作

×