10 siti Divi con fantastiche pagine di progetto

Pubblicato: 2018-07-23

Le pagine del progetto sono ottime per mostrare ai potenziali clienti il ​​tipo di lavoro che svolgi. Spesso includono casi di studio, che aiutano a mostrare la tua esperienza e danno loro un'idea realistica di cosa aspettarsi. Esistono diversi modi per creare pagine di progetto con Divi. In questo articolo esamineremo 10 siti Divi con fantastiche pagine di servizi per aiutarti a ispirarti per il tuo prossimo sito Divi.

Le pagine del progetto in genere includono elementi come immagini, gallerie, slider, video, testimonianze e inviti all'azione. Mostrerò un'immagine della sezione che mi piace e discuterò di cosa mi è piaciuto. I siti web non sono in un ordine particolare. Resta in attesa fino alla fine per alcuni link che ti aiutino a far salire di livello la tua pagina di progetto unica.

1. BCBD

Questo mostra uno screenshot del progetto all'interno dello schermo di un laptop da un lato e uno screenshot più grande dall'altro. Sotto le immagini è presente una sezione a due colonne con titolo, descrizione e collegamento al sito Web in una colonna e un elenco di servizi forniti nell'altra colonna. Sotto questa è una sezione con schermate del sito Web visualizzate su diversi dispositivi, una testimonianza del cliente, un divisore e un pulsante per vedere il progetto successivo.

Vedi sito web

2. Jupper

Questa pagina del progetto visualizza un'immagine del progetto seguita dal nome del cliente, il nome del progetto e un divisore. La sezione successiva mostra una descrizione all'interno della colonna di sinistra e un'immagine del prodotto finito a destra utilizzando un'ombra di scatola. Altre immagini con le ombre della scatola mostrano il prodotto finito in una singola colonna seguita da un invito all'azione. Il CTA utilizza i divisori per la parte superiore e inferiore e utilizza il testo con e-mail cliccabili.

Vedi sito web (Il sito web è inattivo.)

3. Partnership per la progettazione della comunicazione

Questo mostra un'intestazione a larghezza intera con un'immagine di sfondo, un logo, un menu, uno slogan, un divisore e una descrizione dell'azienda. Lo scorrimento rivela una riga 2/3, 1/3 con un'immagine grande del progetto nella colonna più grande e la descrizione nella colonna più piccola. La descrizione include una suddivisione del progetto tra cui titolo, nome del cliente, breve descrizione, soluzioni e collegamenti per scaricare il progetto come PDF, a un modulo di contatto e tornare alla pagina del portfolio. Una serie di immagini del progetto insieme al testo in stile viene utilizzata come CTA.

Vedi sito web

4. Volpe cubica

Questa pagina del progetto mostra un'immagine del progetto sullo schermo di un computer seduto su una scrivania. Il testo è posto accanto all'immagine e mostra il nome del progetto, il cliente, l'anno, il CMS, i servizi forniti e un link per visualizzare il sito web. Sotto questo ci sono tre esempi di screenshot del progetto. Facendo clic su una qualsiasi delle immagini, le si apre in un lightbox. Mi piace lo screenshot perché è un esempio del mondo reale.

Vedi sito web

5. Kim Vestergaard

Questo sito mostra una piccola sezione in nero con collegamenti a diverse aree del sito. Lo scorrimento rivela le immagini del progetto in una singola colonna. Le immagini mostrano il carattere tipografico utilizzato, la tavolozza dei colori, il design del progetto (che è un logo), e poi molti esempi di come viene utilizzato. Gli esempi mostrano il logo su diversi colori, come sfondo del desktop, all'interno di un'intestazione, su un sito Web che utilizza dispositivi diversi, all'interno di esempi di poster pubblicitari e sui social media.

Vedi sito web

6. Apprendimento

Questo utilizza un design pulito con un'immagine a tutta larghezza e il titolo del progetto in parallasse. Sotto questo c'è un titolo e poi due colonne. La prima colonna è di testo e fornisce la descrizione del progetto e include una testimonianza in grassetto. La seconda colonna utilizza uno sfondo grigio per risaltare e fornisce le informazioni sulla scuola. In questa sezione è presente un collegamento per scaricare le informazioni sul progetto in formato PDF. Un'altra sezione a tutta larghezza fornisce collegamenti a progetti correlati seguiti da un CTA a tutta larghezza.

Vedi sito web

7. Patti Houston

Questo mostra il titolo e la descrizione del progetto seguiti dalle immagini del progetto in un layout a più colonne, alternando da due colonne a una colonna e immagini basse e alte. Una sezione include testo accanto a un'immagine per fornire ulteriori informazioni sul progetto. La navigazione dei post fornisce collegamenti ai progetti precedenti e successivi. Un divisore separa il progetto da un CTA costruito con testo e un pulsante. Adoro il layout di questo.

Vedi sito web

8. Costruttori di acque blu

Questa pagina del progetto mostra un'intestazione a larghezza intera con un'immagine di sfondo con una sovrapposizione e un titolo. Le informazioni sul progetto sono fornite all'interno di una sezione a larghezza intera come testo diviso da divisori verticali. Due colonne mostrano la galleria di immagini del progetto e i dettagli con il testo. Segue una sezione con i loghi dell'azienda per vedere altri progetti, una mappa per vedere il progetto di persona e la navigazione dei post per il progetto successivo e precedente.

Vedi sito web

9. Kenny Payero

Questo mostra il progetto all'interno di due colonne. Il primo mostra il titolo, la posizione, una descrizione, la navigazione dei post per passare al progetto precedente e successivo e un pulsante fatto di quadrati che ti porta alla pagina del portfolio. La seconda colonna mostra le immagini del progetto all'interno di una griglia. Facendo clic su qualsiasi immagine si apre in una lightbox.

Vedi sito web

10. Il gruppo Zimmerman

Questo è uno dei più elaborati della lista. Utilizza un'intestazione a schermo intero con immagine di sfondo, gradiente e nome del cliente come titolo del progetto. Lo scorrimento rivela due colonne con le informazioni sul cliente e le descrizioni dei servizi forniti accanto a un'immagine. Di seguito c'è un video sul cliente, le immagini del progetto compreso il sito Web e le campagne pubblicitarie (inclusa una fantastica timeline), una panoramica del progetto su un gradiente di sfondo e un CTA.

Vedi sito web

Pensieri finali

Questo è il nostro sguardo a 10 siti Web Divi con pagine di servizi interessanti per aiutarti a ispirarti per il tuo prossimo design Divi.

Ci sono molti articoli di design e istruzioni qui sul blog di ET che sono perfetti per creare pagine di progetto. La pagina del progetto è un tipo di post personalizzato che può essere creato con Divi Builder e spesso utilizzano elementi come gallerie e design di pagine come post di blog per mostrare il lavoro. Ho incluso collegamenti a tutorial che coprono sia gallerie che post di blog e layout di pagina generali.

  • 3 bellissimi layout di pagina del progetto gratuiti (e come costruire di più con Divi Builder)
  • Come utilizzare un portfolio filtrabile e la navigazione dei post per organizzare casi di studio con Divi
  • Come creare una tavoletta di anteprima del testo scorrevole con Divi
  • Quali 11 dei migliori siti Web di portfolio possono insegnarci sulla presentazione del nostro lavoro?
  • Come creare splendide testimonianze di gallerie con Divi
  • Creazione di una galleria di colori in scala di grigi con il modulo Galleria Divi
  • Pacchetto gratuito Divi Photo Gallery Layout: 5 fantastici layout di pagina della galleria in un comodo download
  • Utilizzo del modulo Galleria Divi per creare una galleria piastrellata con imbottitura personalizzata
  • Il pacchetto gratuito di layout per post sul blog Divi porterà i tuoi articoli basati su Builder al livello successivo
  • Il segreto per progettare layout di griglia spezzata in Divi
  • Come progettare un layout diagonale unico con Divi

Vogliamo sentire da voi. Quale di questi siti Web con fantastiche pagine di progetto è il tuo preferito? Fateci sapere nei commenti.

Immagine in primo piano tramite PODIS / shutterstock.com