Prezentacja Divi Design: nowe zgłoszenia od czerwca 2020 r.

Znowu nadszedł ten czas na naszą comiesięczną prezentację Divi, w której przyjrzymy się dziesięciu niesamowitym witrynom Divi stworzonym przez członków naszej społeczności. Każdego miesiąca prezentujemy najlepsze witryny Divi, które zostały przesłane przez naszą społeczność, a dziś chcemy podzielić się z Wami dziesięcioma najlepszymi witrynami w czerwcu. W całym poście wymienię niektóre z moich ulubionych funkcji projektowych, które przyciągają mnie do każdej ze stron internetowych.

Mam nadzieję, że ich lubisz!

Prezentacja Divi Design: nowe zgłoszenia od czerwca 2020 r.

1. Uśmiechy Prestona

Ta strona została zgłoszona przez Christiana Mauerera. Sekcja bohatera wyświetla animowany tekst z efektem pisania przy użyciu fantazyjnej czcionki i CTA z jednej strony oraz temat obrazu tła z drugiej. Przewijanie ujawnia suwak logo pokazujący media, w których firma była widziana. CTA dla książek wyświetla logo sklepów internetowych pośrodku ze strzałkami skierowanymi na zewnętrzne krawędzie ze zdjęciami książek. Podczas przewijania książki przesuwają się w kierunku środka. Sekcja dotycząca właściciela witryny wyświetla po lewej stronie duże zdjęcie, a po prawej informacje. Zdjęcie przewija się szybciej, gdy przewijasz stronę w dół, aby zobaczyć galerię nakładających się obrazów. Kilka sekcji zawiera stylizowane filmy. Szczególnie podoba mi się sekcja referencje, która pokazuje duży wizerunek właściciela, referencje z Facebooka i zdjęcia z wydarzeń.

Odwiedź stronę

2. WebDevXd

Ta strona została zgłoszona przez Steph z Web Dev Xd. CTA wyświetla się po lewej stronie z czerwonymi przyciskami nad obrazem tła mapy świata i białą nakładką. Pod tą sekcją znajduje się menu o pełnej szerokości, które przykleja się do góry podczas przewijania. W następnej sekcji z jednej strony przedstawiono przykład pracy na ekranie komputera, a z drugiej opis, każdy w firmowych kolorach czerwonym i białym. Usługi są wyświetlane w notatkach z czerwonymi ikonami. Sekcja projektów pokazuje obrazy, które są ułożone w stos. Obrazy są pomniejszane, a obrazy z tyłu przesuwają się na boki po najechaniu kursorem. Sekcja dotycząca elementów wynikowych wykorzystuje czerwone tło z notatkami wyświetlającymi tekst i ikony w kolorze białym. Tytuł jest umieszczony pionowo z boku. Stopka wyświetla suwak postu i kilka widżetów na czerwonym tle.

Odwiedź stronę

3. Monachium

Ta strona została wysłana przez Lethicię Diniz. Wykorzystuje niebieskie i zielone kolory oraz style czcionek, które idealnie pasują do gatunku. Nagłówek wyświetla skumulowane przyciski dla wezwań do działania. Sekcja bohatera zawiera obraz tła z tematem po jednej stronie i dużymi punktami po drugiej. Plany są wyświetlane jako bloki tekstu z różnokolorowym tłem, które powiększają się po najechaniu kursorem. Podoba mi się pełnoekranowe CTA zbudowane z warstw. Wyświetla zdjęcie po jednej stronie, tytuł, który obejmuje drugie dwie trzecie, listę korzyści po drugiej stronie oraz duże pole, które nakłada się na pozostałe dwa z niebieskim tłem i wzorami z samym CTA. Suwak referencji wyświetla się z wzorem tła po prawej stronie. Stopka wyświetla dwa wiersze. Pierwszy zawiera wezwania do działania, aby przeczytać więcej, które są w różnych kolorach i rozmiarach, informacje kontaktowe, a następnie dolny wiersz wyświetla widżety. Dwa wiersze wyświetlają się na tle wzoru paralaksy.

Odwiedź stronę

4. SAMCARA

Ta strona została zgłoszona przez Xaviera Ferre. Menu nawigacyjne wyświetla się pionowo po lewej stronie i pozostaje na ekranie podczas przewijania. Sekcja bohatera wyświetla tytuł witryny dużymi czcionkami, a następnie listę usług i klikalne wezwanie do kontaktu z jednej strony i mały obrazek z drugiej. Informacje są dostarczane na dwóch dużych kartach z różnymi kolorami tła i pozycjami obrazu. Obie nakładają się na następną sekcję, która wyświetla większe stylizowane boisko do koszykówki z góry o podobnym wyglądzie jak dwie pierwsze karty. Kolejne karty następują po tym i są wprowadzane z dużą kolumną tekstu. Ta sekcja zawiera formularz kontaktowy i listę współpracowników. Posty na blogu są poprzedzone stylizowaną strzałką, która powiększa się podczas przewijania. Sekcja bloga prowadzi również czytelnika do formularza logowania.

Odwiedź stronę

5. Ubezpieczenie buforowe

Ta strona została zgłoszona przez Seana Turnera. Strona doskonale wykorzystuje kolory i obrazy. Sekcja bohatera wyświetla dwa obrazy tła. Większy bok ma niebieską nakładkę, a mniejszy zieloną nakładkę. Obraz pierwszego planu jest umieszczany w miejscu ich spotkania i umieszczany na tle w kształcie tarczy. Po drugiej stronie znajduje się CTA. Pierwszy plan zawiera również kształty we wzorach, które pojawiają się w całej witrynie. Kolejna sekcja wyświetla usługi w dużych pudełkach o tych samych wzorach. Następne dwie sekcje wyświetlają po jednej stronie długie notki, a po drugiej obraz w układzie naprzemiennym na obrazie tła z białymi lub niebieskimi nakładkami. Notki wyświetlają pociski. Obrazy używają tej samej tarczy, co sekcja bohatera. Suwak postów o pełnej szerokości pokazuje tytuł i tekst najnowszych postów. Zawiera również mega menu z linkami tekstowymi.

Odwiedź stronę

6. Curlee

Ta strona została zgłoszona przez Antheę A. Ancalade. Sekcja bohatera wyświetla pełnoekranowy obraz tła z polem wyszukiwania pośrodku, które pozwala wybrać lokalizację lub użyć bieżącej lokalizacji. Usługi są wyświetlane z obrazami, które zawierają tytuły i nakładki obok CTA. Polecane style są wyświetlane w 6-kolumnowym suwaku i obejmują obraz, tytuł, ocenę w gwiazdkach i lokalizację. Suwak zawiera zarówno nawigację strzałką, jak i kropką. Kliknięcie jednego ze stylów przeniesie Cię na jego stronę produktu. Nowe style są wyświetlane w 6 kolumnach, ale bez suwaka. Sekcja bloga wyświetla dwa najnowsze posty i umieszcza pod nimi linię z linkiem, aby zobaczyć więcej pod linią. Tutoriale z bloga umieszczone są w trzech kolumnach i są zgodne z tym samym projektem. Zawiera również kanał Instagrama z 6 kolumnami i 2 wierszami oraz stopkę ze stylizowanym formularzem e-mail.

Odwiedź stronę

7. Typogenia

Ta strona została zgłoszona przez Eugenię Janakow. W grafice zastosowano dużo odważnego koloru żółtego. Tytuły są tworzone tak, jakby zostały utworzone za pomocą drukarki etykiet, dzięki czemu tła są czarne, a tekst biały, co nadaje im trójwymiarowy wygląd. CTA znajduje się na środku menu. Sekcja bohatera wyświetla podzielony ekran z CTA po lewej i obrazem po prawej. CTA wykorzystuje ręcznie rysowaną grafikę, która jest animowana podczas przewijania i najeżdżania. Informacje o właścicielu witryny wyświetlają obraz w kółku z wezwaniem do działania, aby przeczytać więcej. Szczególnie podoba mi się sekcja referencje. Wyświetla recenzje od Google wraz z ocenami w postaci gwiazdek i klikalną grafiką, która prowadzi do strony Informacje. Usługi są wyświetlane w notatkach i zawierają duże, ręcznie rysowane grafiki. Blog używa markowego żółtego dla meta, a formularz kontaktowy używa go jako tła całej sekcji.

Odwiedź stronę

8. Bushcrafter

Ta strona została zgłoszona przez Simone Talamo. Sekcja bohatera wyświetla obraz pełnoekranowy z tematem pośrodku. Na pierwszym planie jest wyświetlany slogan z wezwaniem do działania i przyciskami społecznościowymi. Kilka sekcji o pełnej szerokości ma podobny projekt. Każda sekcja ma postrzępiony separator, który idealnie pasuje do gatunku. W następnej sekcji wyświetlane są duże obrazy zawierające informacje z tekstem i ikonami w nakładce. Większość ma ciemne tło lub miesza się z ciemnym tłem. Jeden do instrukcji wyświetla okładkę książki wraz z tekstem. Najnowsze posty na blogu wyświetlają je jako karty z cieniami. W stopce wyświetlane są produkty wraz z ich nazwami, zdjęciami, ocenami w gwiazdkach i cenami. Strony kursu mają ten sam projekt i dodają zegar odliczający i stylizowane przełączniki.

Odwiedź stronę

9. Cyfrowy KWALT

Ta strona została zgłoszona przez Nicolasa Peignera. Ten ma wiele ciekawych animacji, stylizowany tekst, grafikę i strzałki w całej witrynie. Żółty jest używany jako kolor firmowy i jest używany w kreatywny sposób. Sekcja bohatera wyświetla tekst po jednej stronie z efektem pisania. Pod nim znajduje się pasek z listą usług. Po prawej stronie znajduje się kilka niezależnych elementów graficznych, które unoszą się i reagują na kursor. Następna sekcja wyświetla tytuł z animowaną grafiką po jednej stronie i prostymi CTA po drugiej. Najnowsza praca podąża za tym i przedstawia zrzuty ekranu pracy na tłach o różnych kolorach i wzorach. Sekcja wyjaśniająca korzyści umieszcza notki z boku z dwukolorowymi ikonami. Po drugiej stronie znajduje się obraz, który prowadzi czytelnika do notek. Prosty suwak referencji jest umieszczony na ciemnoszarym tle, aby się wyróżniać.

Odwiedź stronę

10. Eksploracje

Ta strona została wysłana przez Ava Charpentier. Wykorzystuje wiele odcieni opalenizny do markowych kolorów. Górny pasek znika podczas przewijania, logo nakłada się na sekcję nagłówka i bohatera, a nagłówek zawiera animacje po najechaniu kursorem. Główny obraz wyświetla tytuł, opis i przycisk do złożenia zamówienia. Kolejny obraz jest umieszczany jako okno na obrazie bohatera w prawdziwej paralaksie. Informacje są wyświetlane w formie notatek z niestandardową grafiką. Produkty są wyświetlane z kolorowym tłem za górną częścią obrazu produktu. Podobny wzór tła jest używany w sekcji bloga. CTA do przeczytania o firmie wyświetla tekst po jednej stronie i obraz po drugiej. Referencje przedstawiane są w formie kartek z cytatem u góry na białym tle i nazwiskiem u dołu na jasnobrązowym tle. Witryna zawiera również kanał na Instagramie i niestandardową stopkę z animacją najechania.

Odwiedź stronę

W zamknięciu

To 10 najlepszych zgłoszeń na naszą stronę internetową Divi w czerwcu. Te strony wyglądają niesamowicie i jak zawsze chcemy podziękować wszystkim za wasze zgłoszenia!

Jeśli chcesz, aby Twój własny projekt został rozważony, wyślij e-mail do naszego edytora nathan na eleganckie motywy kropka com. Pamiętaj, aby w temacie wiadomości e-mail umieścić „ZŁOŻENIE WITRYNY DIVI”.

Chcielibyśmy również usłyszeć od Was w komentarzach! Powiedz nam, co lubisz w tych witrynach, a jeśli jest coś, co zrobili, chcesz, abyśmy nauczali na blogu.

Polecane zdjęcie za pośrednictwem domonku / shutterstock.com