ディビデザインショーケース：2021年6月からの新規提出
公開: 2021-06-26毎月開催されるDiviShowcaseでは、コミュニティメンバーが作成した10のすばらしいDiviWebサイトを紹介します。 毎月、コミュニティから提出された最高のDivi Webサイトを紹介します。今日は、6月の上位10のWebサイトを紹介します。 投稿全体を通して、私を各Webサイトに引き付ける私のお気に入りのデザイン機能のいくつかを指摘します。
私はあなたがそれらを好きであることを願っています！
ディビデザインショーケース：2021年6月からの新規提出
1.カーサロスシルベストル
このサイトはIdeaDesignによって提出されました。 このサイトは写真とアニメーションを大いに活用しています。 ヒーローセクションには、いくつかのグラフィック要素の上および周囲に浮かぶ製品のグラフィックが表示されます。 スクロール効果は、所定の位置に配置されるまで画像をぼかします。 いくつかのセクションには、マウスに続く興味深い水の波及効果があります。 私はこれを見るのが楽しいと思いました。 フルスクリーンの背景画像では、前景に大きなスタイルのテキストが表示されます。 情報は、一方の側に画像を配置し、もう一方の側にテキストを配置する2列のセクションで提供されます。 パターン化された背景は、テキストの後ろに配置されます。 このサイトは多言語対応です。
サイトを訪れる
2.ヴィヴィアンの法則
このサイトはNickLiによって提出されました。 これは写真と柔らかな色をうまく利用しています。 写真には、背景から目立ち、提供されているサービスを読者に知らせるのに役立つ大きな境界線が含まれています。 ヒーローセクションには、写真とお問い合わせフォームが重なった全幅の画像が含まれています。 サービスの画像には不透明なオーバーレイがあり、画像の一部が透けて見えるようになっています。 いくつかのセクションでは、一方の側に画像が表示され、もう一方の側の情報と重なっています。 ギャラリーとサービスのページには、作品の例がたくさんあります。
サイトを訪れる
3.ウェイメーカー
このサイトはStuartLeoによって提出されました。 影を使ってセクションを区切るすっきりとしたデザインです。 一部のセクションとCTAには、目立つようにパステルカラーの背景が含まれています。 CTAの隅には画像と重なる透かしがあり、目立たずに面白いデザインになっています。 私は特にメガメニューが好きです。 リンクのリストが表示され、各リンクの横にアイコンが表示されます。 ドロップダウンメニューの下部には、CTAバナーが含まれています。 多くのページには、スタイルブラブとメニューが含まれています。 埋め込まれたポッドキャストも興味深いものです。 それらはブログ投稿のように機能しますが、埋め込まれたビデオとオーディオが含まれています。
サイトを訪れる
4. Bisi Alimi Foundation
このサイトはFlavioMesterによって提出されました。 サイト全体のハイライト色としてダークグリーンを使用しています。 ヒーローセクションでは、片側に地図が表示され、反対側に大きな画像スライダーが表示されます。 タイトルが重なっています。 要素の多くには、色を変更したり、画像をズームしたり、情報を表示したりするホバー効果があります。 レイアウトはすっきりしていて、わかりやすいです。 写真の色は、ブランドのグリーンとうまく調和しています。 他のページには、スタイル付きのトグル、フォーム、画像、埋め込みのInstagramフィードが含まれます。
サイトを訪れる
5. iMedica
このサイトはYoannPIERREによって提出されました。 サイト全体のハイライトにホットピンクの色合いを使用しています。 ヘッダーは、一方の側に異なる色で連絡先の召喚状を配置し、ホバーするとアイコンが変化します。 ヒーローセクションには、前景にタイトルとアイコンが付いたビデオが表示されます。 ビデオには、下向き矢印を作成するスタイル付きの仕切りも含まれています。 アイコン、トグル、ボタン、およびホバーアニメーションは、ホットピンク、ホットピンクに変更、またはホットピンクから変更されます。 背景の多くは、スタイル付きのパターンを示しています。 ピンクの要素のいくつかは、画面の中央にスクロールするまで明るくなります。 両面CTAスライドは、ホバーしている側を示します。
サイトを訪れる
6.ジェネシスクリエイティブ株式会社
このサイトはChauceeによって提出されました。 これは、ハイライト、テキスト、ボタンに多くの黄褐色と茶色を使用しています。 茶色はサイト全体の画像の内容と一致します。 ヘッダーはサイトと調和し、CTAが含まれています。 これは面白いレイアウトです。 ヒーローセクションには、3つすべてに重なる中央のCTAと重なる3つの画像が表示されます。 別のセクションも同様のデザインで、画像が小さく、テキストが大きくなっています。 そのセクションのタイトルは、他のセクションとは一線を画す別のフォントを使用しています。 フッターも面白いです。 大きなロゴ、リンク、予約CTAが表示されます。
サイトを訪れる
7. BevCheck
このサイトはMichaelWhiteによって提出されました。 明るい赤は、テキスト、背景、アイコンのサイト全体のハイライト色として使用されます。 特大のヒーローセクションにまたがる背の高い背景写真を使用しています。 ヒーローセクションには、CTAとロゴの埋め込みセットを含む情報が表示されます。 このセクションの次の部分には、スタイル付きのアイコンが付いた宣伝文と、角が丸くてボックスの影が付いた特大のボタンが含まれています。 会社に関するセクションでは、一方の側に画像を、もう一方の側にテキストを表示し、背景から目立たせるためにボックスの影を付けています。 フッターの連絡先CTAが好きです。 これは、背景画像の上に大きなテキストブロックを表示し、赤いオーバーレイがスタイル付きの連絡先フォームで次のセクションに重なっています。
サイトを訪れる
8.そよ風催眠療法
このサイトはSiboraHaliliによって提出されました。 私はこれのグラフィックと色が大好きです。 ライトオレンジとグレーの配色でエレガントな印象を与えます。 ヘッダーは、オレンジ色の片側にCTAを配置します。 これは1ページのデザインです。 ヒーローセクションには、情報とともに前景にスタイル付きテキストを含むフルスクリーンの背景画像が表示されます。 ブランドカラーの手描きグラフィックは、宣伝文や背景画像から使用されます。 オブジェクトの描画であるものもあれば、抽象的なものもあります。 写真、ポッドキャスト、トグル、スライダーなどの多くの要素は、色のブロックで背景に重なります。 視差のある1つの画像や、スクロールするとサイズが変化する線などの細かいディテールが目立ちます。 数色しか使用していませんが、完璧に使用しています。
サイトを訪れる
9. Centrolab
このサイトはLethiciaDinizによって提出されました。 これは色とグラフィックをうまく利用しています。 背景、ボタン、アイコン、描かれたグラフィックのオレンジとブルーに重点を置いた大胆な色をたくさん使用しています。 彼らはターゲットオーディエンスのために完璧に機能します。 グラフィックは、シーンを設定するためのオブジェクトを持つ人々を示しています。 すべての背景には波状の仕切りがあります。 ヒーローセクションの背景には、目立つ丸模様が含まれています。 すべてのセクションには、一方に情報が表示され、もう一方にグラフィックが表示されます。 フッターも好きです。 連絡先情報、リンク、および著作権表示用の領域を作成するために重なり合う複数の色のブロックで作成されます。 青いヘッダーには、メニュー項目のオレンジ色のハイライトと緑のCTAがあります。
サイトを訪れる
10.クレメントフロモン
このサイトはClementFromontによって提出されました。 これは、青とオレンジの配色と非常に大胆な色を使用しています。 ホームページのレイアウトはシンプルで、適切に設計されたCTAを作成します。 これには、ヒーローセクションの短いCTA、全幅のアバウトセクション、情報を含むテキストのセクション、紹介文を含むセクション、およびフッターのCTAが含まれます。 彼らは協力して、同時に目を引くと同時に必要な情報を提供します。 注目を集めるヒーローセクションのアニメーショングラフィックが好きです。 ブログはまた、CTAと最新の投稿を備えたエレガントなデザインになっています。 ポストはユニークなデザインです。 これらは、ケーススタディに似た特大のカードで、片面にタイトル、テキスト、箇条書き、ボタンがあり、もう片面にサイトと一致するグラフィックがあります。
サイトを訪れる
来月まで！
これは、6月のコミュニティDiviWebサイトのベスト10の提出物です。 これらのサイトは素晴らしく見えます、そしていつものように私たちはあなたの提出に対してみんなに感謝したいと思います！
独自のデザインを検討したい場合は、エレガントなテーマのドットコムでネイサンの編集者にメールしてください。 メールの件名は必ず「DIVISITESUBMISSION」にしてください。
コメントもよろしくお願いします！ これらのウェブサイトについてあなたが好きなことを教えてください。彼らがやったことがあれば、ブログで教えてほしいと思います。
Happy Job /shutterstock.com経由の注目の画像