Contenuti e Copy
Wireframe brief generator
Brief strutturato per nuova landing page.
Obiettivo: Allineare design e obiettivi commerciali.
Wireframe brief (struttura landing)
Prima del mockup alto fedeltà: ordina blocchi, priorità P0/P1/P2, note hero/CTA/form e checklist mobile. Output pensato per UX, product e stakeholder — tutto calcolato nel browser, senza salvataggio remoto.
Landing acquisizione lead B2B SaaS: struttura a blocchi orientata a generazione lead (contatto/demo), pubblico «Responsabili marketing PMI (10–200 dip.) che valutano CRM con integrazione email». Vincoli: Deve rispettare brand guideline: niente pop-up interstitial al primo load
Hero / fold
- Contesto: schermata “Landing acquisizione lead B2B SaaS” — blocchi come rettangoli etichettati, non design finale.
- Micro‑proof sopra titolo (logo clienti o rating), evitare caroselli ingombranti in hero.
- CTA primaria sticky su mobile dopo 40% scroll (annotare su frame mobile).
- Spazio per illustrazione o mock prodotto (placeholder rettangolo + ratio annotato).
Sezioni in ordine
Calcolatore ROI integrato
Sezione richiesta dallo stakeholder: definire copy e asset in iterazione dopo wireframe.
- · Placeholder contenuto dinamico
- · Annotare dipendenze (CMS / API)
Carosello case study
Sezione richiesta dallo stakeholder: definire copy e asset in iterazione dopo wireframe.
- · Placeholder contenuto dinamico
- · Annotare dipendenze (CMS / API)
Social proof / metrica
Ridurre attrito subito dopo hero con numeri o testimonial sintetici.
- · Griglia 3 card quote corte
- · Logo bar (monocromatico in wireframe)
Problema → promessa
Collegare esigenza a offerta in 2–3 bullet.
- · Two-column: testo | elenco bullet
- · Icone placeholder circolari
Form lead / iscrizione
Campi ridotti al minimo: email + consenso; note privacy sotto.
- · Form 1 colonna desktop, full width mobile
- · Checkbox GDPR + link policy
Come funziona / processo
Passi numerati per utenti in considerazione.
- · Stepper orizzontale (3–4 step)
- · Note interazione: hover non obbligatorio in V1
Navigazione
Header trasparente su hero che diventa solido dopo scroll (annotare breakpoint).
Gerarchia CTA
- Primaria: Richiedi demo (un solo colore forte).
- Secondaria: scopri/prezzi/catalogo outline (ghost button).
- Terziaria: chat/widget solo se disponibile davvero — altrimenti omettere dal wireframe.
Bozza form
- — Nome (opzionale se brand B2C forte)
- — Email obbligatoria
- — Telefono solo se SLA lo richiede
- — Checkbox comunicazioni marketing separata dalla privacy policy.
Trust & mobile
- Spazio per certificazioni / partner (loghi in scala di grigi).
- Sezione testimonial con foto placeholder e ruolo aziendale.
- Single column: nessuna tabella larga in hero; spostare comparazioni sotto piega o in sheet.
- Touch target minimo 44px per CTA e link in area pollice.
- Sticky bottom bar solo se non copre form (test su device corti).
Domande per stakeholder
- Copy definitivo per headline «Landing acquisizione lead B2B SaaS» o ancora working title?
- Come gestiamo in produzione i vincoli dichiarati: "Deve rispettare brand guideline: niente pop-up interstitial al primo load"?
- Esiste una pagina di destinazione post-conversione già definita / misurabile?
Brief wireframe generato in locale nel browser: è un canovaccio strutturale deterministico. Valida sempre con ricerca utenti, vincoli di marca e analytics prima dell’alta fedeltà.