20 de exemple minunate de design pop-up pe care le puteți copia astăzi

Știați că ferestrele pop-up de e-mail vă pot ajuta să vă dublați lista de e-mailuri?

Acesta este rezultatul mediu raportat de clienții Wisepops.

Nu ar fi grozav dacă și lista ta de e-mail s-ar dubla ? Dacă sună bine, este timpul să încercați ferestre pop-up pentru a vă conecta la vizitatorii site-ului dvs. Primul pas pe care trebuie să-l faceți: învățați ce face un design pop-up captivant.

Iată 20 de exemple frumoase de design pop-up pentru a începe.

Partea 1: Design-uri pop-up pentru e-mailuri de pe desktop

Să începem cu ferestrele pop-up de captare a e-mailurilor de pe desktop (curioasă de ce separăm ferestrele pop-up de pe desktop și ferestrele pop-up mobile? Vom explica de ce în a doua parte).

Am inclus în această selecție tot felul de exemple de design pop-up pentru înscriere. Dar am vrut să începem cu exemple simple pentru a demonstra că nu trebuie să fii un designer senior pentru a crea ferestre pop-up arătoase.

Flight Club: pop-up direct la punct

Acest exemplu pop-up de la Flight Club este alb-negru, fără o imagine de fundal. Designul se potrivește paletei generale de culori a site-ului web, ceea ce îl face să arate natural. Oferta este foarte clară, la fel și îndemnul. Asta numim o fereastră pop-up direct la obiect.

Weebly: non-intruziv și convingător

Ceea ce este interesant despre exemplul de design pop-up al lui Weebly este formatul barei. Acest format face fereastra pop-up vizibilă în orice moment.

Experiența noastră arată că tarifele de abonament din baruri sunt mai mici decât ferestrele pop-up. Totuși, pot atrage mulți vizitatori dacă îi oferiți o culoare contrastantă și un text convingător.

Peter Shankman: O fereastră pop-up subtilă

Influencerul Peter Shankman a creat un pop-up subtil care apare pe măsură ce utilizatorii derulează în jos. Acest design pop-up este non-intruziv și își face treaba angajând foarte bine vizitatorii.

Nike: Simplu, dar eficient

Doriți să colectați mai multe informații de la vizitatori în afară de e-mailuri? Mai multe câmpuri pot fi un factor de descurajare pentru vizitatori. Cu toate acestea, puteți evita acest lucru ținând cont de experiența utilizatorului în timp ce proiectați pop-up-ul. Exemplul pop-up Nike arată cum o puteți face într-un mod simplu și eficient.

MeUndies: O fereastră pop-up care apare cu adevărat

Acum, să vedem un design pop-up colorat. Acest pop-up de la MeUndies este un exemplu grozav: atrage atenția, este creativ și captivant. Totul este corect în acest design pop-up, de la aspectul vizual la alegerea culorii și CTA care apare.

Vouzie: reflectarea comunității

Când folosirea fotografiilor produselor tale este o problemă (majoritatea SaaS se află în această situație), de ce să nu selectezi imagini din comunitatea ta? Asta a făcut Volusion în acest design pop-up de captură de e-mail.

Livechat: Ilustrație jucăușă

Utilizarea ilustrațiilor în designul pop-up este o altă opțiune bună. Cu siguranță vă poate scoate campania în evidență și aduce un plus de distracție. Iată un exemplu de tip pop-up ilustrat pe blogul LiveChat.

KlientBoost: împingând ilustrația mai departe

Se pare că KlientBoost a primit puțin ajutor de la designerii lor interni pentru această campanie. Ilustrația lor creativă adaugă distracție designului pop-up. Este o modalitate grozavă de a cere oamenilor să se aboneze la un buletin informativ!

Kelly Harrop: Design ieșit din cutie

Iată un alt exemplu de design pop-up super creativ. Copia este convingătoare, iar ochiul este atras de chemare la acțiune datorită culorii contrastante și formei decupate.

Carbon 38: invadează ecranul

Acest exemplu pop-up merge și mai departe. Popup-ul rotund (o formă rară în designul pop-up) este evidențiat de modelul din dreapta. Este un pop-up pe ecran complet, astfel încât captează atenția vizitatorilor în mod eficient.

Frank Body: Folosește-ți personalitatea mărcii

„Pantaloni jos, 10% reducere la prima achiziție” – acest titlu creativ, care atrage atenția este în conformitate cu tonul vocii lui Frank Body. Restul textului urmează aceeași strategie, susținând personalitatea ciudată și jucăușă a mărcii.

Taylor Stitch: Folosește o imagine de erou uriaș

Răsfoiești site-ul lui Taylor Stitch și bam — stai afară și privești spre un lanț muntos frumos. Bine, asta nu s-a întâmplat (cei din laborator încă lucrează la teleportare), dar acest design pop-up creează acest efect frumos. Formatul pe ecran complet și imaginea de fundal uimitoare este o combinație izbitoare.

Partea 2: Designuri pop-up pentru e-mailuri mobile

Într-o lume în care mai mult de jumătate din trafic este mobil, aveți nevoie de o strategie de marketing pop-up adaptată dispozitivelor mobile.

Și, ținând cont de regulile Google cu privire la anunțurile intercalate mobile, nu puteți lucra doar pentru a face creațiile dvs. receptive.

Patagonia: Păstrați-o simplă

Să începem cu cel mai simplu exemplu de tip pop-up posibil: copie neagră pe un fundal deschis. Patagonia respectă regulile Google cu un pop-up care nu împiedică vizitatorii să acceseze conținutul paginii de destinație și să folosească aceeași paletă de culori.

Timberland: Folosiți culoarea selectiv

Timberland a urmat același design ca și Patagonia. Singura diferență este că brandul a adăugat puțin mai multă culoare, păstrând-o în același timp în stilul site-ului.

Ceremonia de deschidere: Creșteți relevanța conținutului pentru abonații de e-mail

Acest design pop-up ne amintește de ferestrele pop-up de pe desktop. Pe lângă câmpul de e-mail, permite vizitatorilor să-și selecteze preferințele de modă (bărbați, femei sau ambele). Este o modalitate bună de a vă asigura că trimiteți conținut relevant abonaților.

Vans: Folosind un CTA pentru a crea mai mult spațiu

Există o modalitate prin care poți afișa ferestre pop-up mai mari pentru mobil și să-ți faci Google fericit: adaugă un îndemn înainte de a-ți afișa popup-ul. Asta a făcut Vans în acest exemplu pop-up. Consultați fila din colțul din dreapta jos al paginii de destinație. Inteligent.

OverstockArt: Evidențiați avantajul de bază

Acest design pop-up (un fundal mai închis și un text mai deschis) face ca principalul beneficiu să fie clar. Butonul CTA contrastant cu „Obțineți 20% reducere acum” îi încurajează pe vizitatori să-și asume acțiunea.

Master Dynamic: Folosiți culori strălucitoare pentru a ieși în evidență

Master Dynamic s-a confruntat cu o provocare atunci când a creat acest design pop-up pentru site-ul web. Site-ul mărcii folosește deja culori puternice, iar pop-up-ul necesar să iasă în evidență pentru a genera abonamente. Soluția excelentă la această problemă a fost utilizarea unui galben strălucitor contrastant.

Not Pot: Oglindiți designul site-ului

Dacă sunteți în căutarea unui design pop-up care se potrivește cu imaginile și designul site-ului, acesta este cel potrivit. Site-ul și pop-up-ul sunt ambele izbitoare. Consecvența designului face ca pop-up-ul să pară parte a site-ului web. Chiar și titlul pop-upului, „Nu este spam”, este în concordanță cu numele mărcii.

Învelire

Sperăm că aceste exemple de design pop-up au fost interesante și inspirate pentru tine.

Dar... designul este doar o piesă a puzzle-ului. Pentru a fi cât mai eficiente posibil, campaniile dvs. au nevoie de o copie solidă și de o ofertă bună. Împreună, aceste elemente pot realiza campanii performante care generează clienți potențiali și conversii.

Vrei să creezi primul tău design pop-up? Înscrieți-vă la Wisepops (probă gratuită de 14 zile, nu este necesar un card de credit) pentru a face primul pop-up în mai puțin de cinci minute.