ディビデザインショーケース：2018年8月からの新規提出

公開: 2018-08-27

毎月開催されるDiviShowcaseで、コミュニティメンバーが作成した10のすばらしいDiviWebサイトを見てみましょう。毎月、コミュニティから提出された最高のDivi Webサイトを紹介します。今日は、8月の上位10のWebサイトを紹介します。投稿全体を通して、私を各Webサイトに引き付ける私のお気に入りのデザイン機能のいくつかを指摘します。

私はあなたがそれらを好きであることを願っています！

ディビデザインショーケース：2018年8月からの新規提出

1.サリン

このサイトはBarryによって提出されました。ロゴとハイライトに一致するサイト全体の背景に赤から青のグラデーションを使用します。ヒーローエリアには、これらのグラデーションを赤と青で反射したクールなグラフィックが含まれています。交互のセクションは、片側に画像を表示し、反対側のロゴと一致するグラフィックを備えたCTAを表示します。また、外側の列にグラフィックを使用し、中央に箇条書きを使用してページへのリンクを表示する3列の情報セクションも気に入っています。

サイトに訪れる

2.Pymagic

このサイトはJoshHallによって提出されました。ヘッダーには、各画像の青から赤へのグラデーションが付いたフルスクリーンの画像スライダーが含まれています。丸みを帯びたセクションのスタイルは、スライダーを次のセクションから分離します。別のセクションには、垂直の白と黄色のグラデーションに重なる青い宣伝文が含まれています。宣伝文句は、ホバーすると赤/青の斜めのグラデーションに変わります。連続スライダーは、セクションスタイルで赤い背景の上にショーからの画像を表示します。このサイトでは、セクションセパレータのスタイル、グラデーション、フォント、明るい原色をうまく利用しています。

サイトに訪れる

3.ツイストトラベルマガジン

このサイトはKelseyによって提出されました。ヘッダーには、被写体が片側に、CTAが反対側にあるフルスクリーン画像が表示されます。メニューには、リンクの上にタグラインが含まれています。グラフィックは次のセクションと重なっており、大きなフォントとニュースレターにオプトインするためのボタンが含まれています。スライダーには、表紙の画像、タイトル、号番号、コンテンツの箇条書き、注文するボタンが表示された最新の号が表示されます。これのより単純なバージョンは、さらに下にデジタルバージョンを示しています。ブログセクションは、ウェブサイトのジャンルを説明するのに役立つように、世界の全幅マップ上にブログ投稿を配置します。このウェブサイトの色とフォントが大好きです。

サイトに訪れる

4.広告代理店

このサイトはMaartenvan derKroftによって提出されました。興味深い背景パターンを持つ特大のヘッダーを使用しています。見ているとロゴが画面に描かれます。左上隅のテキストが変わり、さまざまなサービスが表示されます。次のセクションでは、3列と3行の間にスペースのないプロジェクトを表示します。ほとんどの場合、アニメーション化されている間は画像が表示されます。ホバーすると、名前がカテゴリに表示されます。視差の背景に雲が付いたワイヤー上の鳥を表示するCTAが大好きです。このサイトは画像をうまく利用しています。

サイトに訪れる

5.わさび写真

このサイトはTravisHaughtonによって提出されました。結婚式の写真の写真を含むフルスクリーンの画像スライダーが表示されます。情報セクションには、写真家のアプローチが示され、CTAが含まれています。ポートフォリオセクションには、提供される写真の種類にリンクするオーバーレイ付きの2つの大きな画像が表示されます。ブログセクションには、ホバーにタイトルが表示された画像として投稿が表示されます。緑は、サイト全体および上にスクロールしたときに表示されるメニュー内のテキストを強調表示します。ブログ投稿は、特定のイベントの写真撮影に使用されます。明るい背景はエレガントに見えます。

サイトに訪れる

6.ミラケア

このサイトはレスリー・タゴルダによって提出されました。製品、説明、および行動の呼びかけは、丸みを帯びたセクションスタイルでフルスクリーンの背景画像の上に表示されます。メディアアイコンがスライダーに表示されます。製品の説明と利点は、宣伝文と画像を使用して3列のセクションに示されています。私のお気に入りのセクションはカウントダウンタイマーです。これには、上下の丸みを帯びたセクションのスタイリングが含まれており、興味深いデザインを作成しています。いくつかのセクションは縞模様のカラーパターンを使用しています。アバウトセクションは、無地の影のある画像を示しています。 CTAとフッターのメニューに重なる画像を使用するフッターの近くのCTAが大好きです。

サイトに訪れる

7.サイコスリラー

このサイトはAlexHawroによって提出されました。タイトルと説明を含むフルスクリーンの背景画像をオーバーレイで表示します。波状のセクションのスタイリングがアニメーション化され、画面を右から左に移動する波が作成されます。次のセクションには、サイトのブランドに一致するグラフィックを使用する情報の列と宣伝文の列が含まれています。心理学者に関するセクションには、テキストと点滅するカーソルを含む円形の画像が表示されます。このセクションには、上部と下部の波状セクションアニメーションが含まれており、それらは異なる方向に移動しています。番号付きのアコーディオンはプロセスを示し、リストが重複しているフルスクリーン画像は何を期待するかを説明しています。それは色とイメージを大いに利用します。

サイトに訪れる

8. WorldTeach

このサイトはJonLangbergによって提出されました。タグライン、説明、CTAがオーバーレイされた真の視差でフルスクリーンの背景ビデオを表示します。トップメニューには、寄付、申し込み、ソーシャル共有のボタンが含まれています。メニューはエレガントで、大きな検索ボックスが含まれています。情報は、宣伝文句と大きなグラフィックを使用してサイト全体に提供され、影の効果を持つアイコンを作成します。画像は2つのセクションに重なっており、別のセクションには中央のCTAと重なっている2つの画像が含まれています。これらの画像はページにリンクし、CTAを完了します。スタイル付きの紹介文は2つのセクションに重なり、目立つボックスシャドウが含まれています。このサイトのレイアウト、画像、色、メニューが特に気に入っています。

サイトに訪れる

9.アペリトゥーン

このサイトはMicheleTenagliaによって提出されました。オーバーレイに角度の付いたタグラインが付いたフルスクリーンの背景アニメーションが表示されます。ページの残りの部分には、同じ赤みがかったオレンジ色の背景が含まれています。宣伝文は、古いスタイルのアニメーションの時間枠に一致するグラフィックを表示します。それらのタイトルは、ヘッダーのタグラインと一致するように角度が付けられており、各宣伝文は前の宣伝文よりわずかに高くなっています。これらの角度の付いたタイトルは、サイト全体で使用されています。フルスクリーンスライダーは、吹き出し内の証言とスピーカーの画像を、画像の上に同じ赤みがかったオレンジ色のオーバーレイで表示します。フルスクリーンメニューは、古いスタイルのアートデザインと色を保持しています。このサイトのアートワークが大好きです。

サイトに訪れる

10.乗組員の訓練

このサイトはクリスピークによって提出されました。このサイトには、説明とCTAを含む全画面画像が表示されます。このセクションには、スタイル付きセパレーターが含まれています。次のセクションには、関心のある背景パターンが含まれ、情報を提供し、顧客のアイコンを表示します。全幅のビデオセクションには、セクションの上部と下部の両方にセパレータスタイリングが含まれています。私のお気に入りは、ケーススタディのセクションです。これには、ケーススタディの画像があり、間にスペースがない複数列のレイアウトが含まれています。画像はさまざまなスタイルを使用しており、オーバーレイなし、単色のオーバーレイ、グラデーションオーバーレイが含まれています。タイトルとリンクも含まれています。ソーシャルセクションには、ブログ投稿のようなフィードが表示されます。

サイトに訪れる

結論は

これは、8月のコミュニティDiviWebサイトの投稿ベスト10です。これらのサイトは素晴らしく見えます、そしていつものように私たちはあなたの提出に対してみんなに感謝したいと思います！

独自のデザインを検討したい場合は、エレガントなテーマのドットコムでネイサンの編集者にメールしてください。メールの件名は必ず「DIVISITESUBMISSION」にしてください。

コメントもよろしくお願いします！これらのウェブサイトについてあなたが好きなことを教えてください。彼らがやったことがあれば、ブログで教えてほしいと思います。

VitaminCo /shutterstock.com経由の注目の画像