ディビデザインショーケース：2020年5月からの新規提出
公開: 2020-06-01毎月開催されるDiviShowcaseでは、コミュニティメンバーが作成した8つのすばらしいDiviWebサイトを紹介します。 毎月、コミュニティから提出された最高のDivi Webサイトを紹介します。今日は、5月の上位10のWebサイトを紹介します。 投稿全体を通して、私を各Webサイトに引き付ける私のお気に入りのデザイン機能のいくつかを指摘します。
私はあなたがそれらを好きであることを願っています！
ディビデザインショーケース：2020年5月からの新規提出
1. Svadobna agentura Terezy Klizanovej
このサイトはLubomirMicuchによって提出されました。 このサイトはフルスクリーンのバックグラウンドビデオを再生し、ビデオに一致する音楽を備えたオーディオプレーヤーが含まれています。 オーディオはデフォルトでオフになっており、簡単にオンにすることができます。 前景には、ロゴ、タグライン、およびCTAが中央に表示され、[バージョン情報]セクションにつながるスタイル付きセクションセパレーターが表示されます。 このセクションには、テキストを含む数行と、交互のレイアウトの2列の宣伝文が含まれています。 宣伝文句は、重なり合うボタンでスタイリングされています。 証言は、詳細を読むためのリンク付きの画像を示しています。 ビデオギャラリーには、結婚式のクリップが表示されます。 FAQはスタイル付きトグル内に配置されます。 背景画像とスタイル付きのソーシャルボタンを備えたカスタムフッターが大好きです。 このサイトには、スタイル付きのスライドバーとトップに戻るボタンも含まれています。 その優雅さはそのトピックと完全に一致しています。
サイトを訪れる
2. Techint Labs
このサイトはBenSchroederによって提出されました。 画面上の任意の場所にカーソルを合わせると、マウスカーソルが赤い+に変わります。 ホームページは全画面表示で、背景は青色で、中央に宇宙服があります。 ヘルメットの顔は、山を越えて移動する雲のビデオを再生します。 左側にCTAが表示された大きな白いテキストと、右側にソーシャルボタンが表示された会社に関する情報が含まれています。 ヘッダーにはロゴとハンバーガーメニューが表示されます。 メニューは特に面白いです。 画面の約半分に白い背景が表示されます。 リンクは、特大の黒いフォントの1つの単語です。 それらは、ホバーすると青に変わるさらに大きな灰色のフォントで番号が付けられています。 いくつかのページは同じ配色に従うか、アニメーション化された黒い星の背景を持っています。
サイトを訪れる
3.フォーカルポイントマーケティング
このサイトはDerekNelsonによって提出されました。 このサイトでは、サイト全体で黄色、白、黒の大きな太字のテキストが多数使用されています。 ヒーローセクションにはフルスクリーンの背景ビデオが含まれ、前景には大きなタグラインが表示されます。 セカンダリメニューにはスタイル付きの背景が含まれ、次のセクションでは背景に太字の黄色を使用します。 これには、大きなCTAと、これとヒーローセクションに重なるビデオボタンを備えた真の視差のパターンが含まれています。 スクロールで上向きに打ち上げられるスペースシャトルのグラフィックを表示する次のセクションが大好きです。 このセクションには、CTAとクラウドセクションセパレータも含まれています。 同様のセクションには、ホバーで回転するErathが表示されます。 その他には、アニメーション化された作品の例、斜めに表示されたプロジェクト、特大のアイコン、ブランドの色を使用したスタイル付きのブログなどがあります。
サイトを訪れる
4.ブレスフェスティバル
このサイトはRadkoSedlakによって提出されました。 赤と青のハイライトを備えたダークカラースキームを使用しています。 ヒーローセクションは、片側に青い形の黒い背景を表示します。 赤い手が中央に置かれ、その上にCTAがあります。 真の視差の小さな線は、サイト全体にいくつかの視覚的なパターンを提供します。 次のセクションでは、片側にテキスト、反対側に画像を含む別のCTAを表示します。 テキストには青い形の背景が含まれ、画像は赤です。 スタイル付き画像のセクションがFacebookの投稿にリンクすると、その黒い背景が青に変わり始めます。 また、購入CTA、視差のある画像を含むスタイル付きのニュースレターフォーム、パートナーの白いロゴも含まれています。 メニューにはハンバーガーアイコンが表示され、メニューが全画面で開きます。
サイトを訪れる
5.マインドオンリー
このサイトはChetanGuptaによって提出されました。 このサイトは全体を通して柔らかい色を使用して、トピックについて通知し、理想的な視聴者にアピールするのに役立ちます。 ヒーローセクションには、片側にCTAがあり、反対側にスタイル付きの画像が表示された白い背景が表示されます。 コースに関する情報を含むセクションが2つの列に表示され、各列の背景色が異なります。 情報の別のセクションには、同じカットアウト形状のグラフィックが表示されます。 コースのあるセクションでは、コースがカードとして表示され、片面にボックスシャドウ、もう片面に情報とボタンが表示され、下部に特大フォントでタイトルが表示されます。 各コースは、交互のレイアウトで異なる色を持っています。 宣伝文は、スタイル付きのアイコンで情報を提供します。 インストラクターに関する情報には、CTAとスタイル付き画像が含まれます。 全幅のサインアップフォームには、要素とグラフィックのブランドカラーが含まれています。
サイトを訪れる
6.試してみました
このサイトはMickTilleyによって提出されました。 サイト全体で明るい色をたくさん使用しています。 ヒーローセクションには2つの列が表示されます。 左側は青い背景の画像です。 右側は、背景がピンクの画像を示しており、背景が緑の画像の上にCTAがあり、プロジェクトを開始するためのCTAである次のセクションに関連付けられています。 会社に関する情報には、縦のタイトルと重複する画像が含まれます。 背景が青色のメールオプトインは次のセクションに進みます。このセクションでは、ブランドカラーを使用したグラフィックを使用して宣伝文句内のサービスを表示します。 ポートフォリオセクションには、最新のプロジェクトが大きなスクリーンショットとして表示されます。 クライアントのセクションには、背景画像の上に紹介文付きのロゴが表示されます。 ブログと連絡先のセクションには、画像、テキスト、背景のブランドカラーが含まれています。
サイトを訪れる
7.砲兵メディア
このサイトはSiscanuMihailによって提出されました。 黄色のセクションでオフセットされた黒と白がたくさんある大きなテキストを使用します。 ヒーローセクションには、大きなタイトルとタグラインが付いた全幅の画像が表示されます。 他の各セクションには、説明と仕切りのラベルが付いています。 ミッションステートメントは明るい灰色のパターンの上に表示され、その後に黒い背景の上に情報が表示されます。 サービスは、ホバーを拡大する画像とサービスの詳細を確認するための大きな黄色のボタンを含むカード内に表示されます。 クライアントのロゴは、黄色の背景の上に黒と灰色で表示されます。 これに続いて、連絡フォーム、作業プロセス、およびブログのセクションがあります。それぞれ、灰色と黒の背景が交互になっています。 ブログカードは、ホバーすると黄色に変わる黒いボタンと一緒に黒と黄色を結びます。
サイトを訪れる
8.ゼロから
このサイトはPhilippStakenborgによって提出されました。 サイト全体にブランドカラーとして明るい黄色、緑、マゼンタがたくさんあります。 ヘッダーは黄色の背景を表示し、リンクは白いボックス内に配置されますが、ロゴとリンクはヘッダーと重なります。 ヒーローセクションは背景に同じ黄色を使用し、片側に緑色の円があります。 手前には大きなタイトルとタグラインがあります。 背景が黒のテキストが上部にあり、背景が白のテキストが主人公と次のセクションに重なっています。 CTAは、一方の側に大きなテキストの後ろに黄色の背景を使用し、もう一方の側に白い背景を使用するテキストのセクションで作成されます。 同様のデザインは、上部に大きな引用符が付いた紹介文を作成します。 ブランドカラーのボックスシャドウ付きの宣伝文句は、サービスを示しています。 お問い合わせフォームは、3つの主要な色ですべてを結び付けます。 ポップアップニュースレターのフォームでさえ、このデザインに従います。
サイトを訪れる
最後に
これは、5月のコミュニティDiviWebサイトの8つの最高の提出物です。 これらのサイトは素晴らしく見えます、そしていつものように私たちはあなたの提出に対してみんなに感謝したいと思います！
独自のデザインを検討したい場合は、エレガントなテーマのドットコムでネイサンの編集者にメールしてください。 メールの件名は必ず「DIVISITESUBMISSION」にしてください。
コメントもよろしくお願いします！ これらのウェブサイトについてあなたが好きなことを教えてください。彼らがやったことがあれば、ブログで教えてほしいと思います。
PODIS /shutterstock.com経由の注目の画像