見出し画像

Webflowの日本での制作事例を紹介!

こんにちは!屋久です!

今回はWebflowの日本での制作事例を紹介していきたいと思います!

かわいいものからスタイリッシュなものまでございますので、ぜひ一緒に見ていきましょう!

制作事例①

ではまず最初に紹介するのはアートのサブスク「Casie


直筆アートを定額でレンタルできるサービスのLPとなっています。

スマホ用のサイズで作成されておりますが、角の取れた写真を使っており、落ち着いた色合いでとても優しい感じが伝わるwebサイトです。

1枚ものなので、スクロールするだけで内容がよくわかるのもいいですね。


制作事例②

続いては起業家のためのソーシャルクラブ「Thinka

こちらは、ユーザベースグループのUB Venturesが運営するソーシャルクラブで、日本の産業を進化させるというミッションのもと、次世代を担う起業家が、集い・学び・表現する場を提供されています。

各セクションにアニメーションをいれており、フォントを複数用意して表現することで一つ一つのタイトルが際立って見えますね。

レスポンシブに対応しておりますので、PC・スマホでぜひ見比べていただければと思います。


制作事例③

続いては、林岳様のホームページのご紹介です。


ファーストビューから目を見張るアニメーションを入れておりますね!

さらにマウスカーソルに合わせて追従するようなアニメーションを設定しているので、とても面白いですね。

他にも線から文字が飛び出してくるような表現を使われていたり、とても参考になるアニメーションが多用されているなと感じました。


制作事例④

続いての紹介は多摩美術大学の学生さんが作成されているデザインフリーペーパーのご紹介です。


こちらは本当に面白いWebサイトとなっており、矢印は至るところにあるということを紹介したサイトとなっております。

まずスクロールすれば背景が変わっていくのがおもしろいですね。

また画像の中にもアニメーションが仕掛けられており、ホバーすることで画像または矢印が表示されるような作りをしております。

‍クリックして、当たりはずれを表現するアニメーションや、動画と線の動きを組み合わせたものもあったりと、本当に細かく工夫を凝らしているがわかります。

学生さんでここまでのものを作り上げるなんて本当にすごい・・!

制作事例⑤


最後の紹介は一般社団法人SPACETIDEが主催のSPACETIDE2022のイベントページのご紹介です。

このページはシンプルですっきりとした印象で、1枚で情報がまとめられておりとても見やすいですね。

こんなにも大企業の名前が連なるイベントページがWebflowで作られていることを考えると、Webflowが認知されつつあること、またそれだけWebflowというツールの利用価値があるという風にも捉えることができますね。


最後に

今回はWebflowで制作されたwebサイトの事例をご紹介させて頂きました。

ノーコードでこんなことができるのか….!!と思った方もいらっしゃるのではないでしょうか?

‍Webflowはノーコードではありますが、「イメージする作りたいもの」が作れるツールです。ただし今回ご紹介したwebサイトも簡単に作れる訳ではございません。

ノーコードといえど、ここまでのものを作るにはやはりしっかりと学習が必要ですが、コードを学習するよりも何倍も簡単で手軽に作れるので、ぜひ一度無料版から使ってみてはいかがでしょうか?

webflowを無料で使ってみる!

ではここまでお読みいただきありがとうございました!

この記事が気に入ったらサポートをしてみませんか?