it

TPI – Senza giri di parole

Rebranding Web // 2017

Co-Design ~ Experience Design ~ Front-end Visita il sito
Il cliente

Color palette & Tipografia


La tipografia rinnovata di The Post Internazionale unisce lo stile classico del Times con quello moderno del Proxima Nova Alt e rispecchia così a pieno l’indole della redazione.

Il Times, carattere tenace e resistente al tempo,  si è contraddistinto – dal suo debutto nel 1932 – per la sua leggibilità, la sua personalità sofisticata e solida. Al classicheggiante Times si contrappone il Proxima Nova Alt, un carattere semplice e versatile, spesso indicato come Helvetica del web. La sua grande varietà di pesi ci ha permesso di giocare, combinando stili diversi per conferire dinamicità ai testi.

Anche la color palette di TPI si è rinnovata con l’introduzione di una versione più brillante del rosso – che aveva definito il marchio in passato – che rende la veste grafica più vivace. La combinazione di diverse tonalità di grigio completa la gamma di colori e infonde un mood accattivante e moderno, ma nello stesso momento pulito e semplice che non distoglie l’attenzione dai contenuti.

Color palette & Tipografia

Design System


Abbiamo progettato un design system in cui i widget sono gli atomi, i componenti base dell’interfaccia utente. Sono piccoli blocchi che codificano la resa grafica di funzioni ed interazioni. Sono composizioni che distinguono e delineano tipi di contenuti.

Per TPI abbiamo definito diversi widget per conferire continuità visiva alla moltitudine dei contenuti presenti sul sito.

La sfida principale è stata quella di trasmettere l’anima di TPI attraverso un layout dinamico e flessibile. Le griglie modulari sono sempre state qualità peculiare dei quotidiani cartacei per attribuire peso a headline, articoli e contenuti correlati nel rispetto dei vincoli della stampa tipografica.

L’interfaccia utente di TPI ha accolto questa sfida traslando le griglie tipografiche in ambiente digitale conferendo un aspetto omogeneo che all’occorrenza gestisce i contenuti con fluidità dando alla redazione la facilità di ricombinare gli elementi grafici e testuali secondo le necessità editoriali.

Design System & Modularità

Focus


Abbiamo progettato una homepage dinamica per assicurare un servizio editoriale sempre più veloce, tempestivo e di qualità.

In base alle esigenze giornalistiche, la redazione può scegliere tra
3 aperture diverse:

 

  1. Breaking News”, griglia a 12 colonne che sfrutta tutta la larghezza dello schermo per dare risalto ad articoli importanti con enorme impatto comunicativo sull’utente.
  2. Breaking News con correlati”, griglia a 9 + 3 colonne per collegare alla breaking news importanti articoli di approfondimento.
  3. Main News”, griglia a 9 + 3 colonne per mettere in evidenza una news primaria e una secondaria.

La nuova struttura e grafica di TPI dà inoltre maggiore rilievo ai reportage dall’estero, alle interviste e alle opinioni della redazione e dei collaboratori, sparsi per il mondo. Lo sfondo chiaro del sito viene interrotto da questi contenuti tramite colori e foto che ne esaltano il contenuto.

Focus
Responsive Intro

Mobile first


La nuova interfaccia utente è stata studiata per adattarsi meglio alle esigenze dei lettori e agli schermi dei propri dispositivi mobili come tablet e smartphone. La pubblicità, pur essendo importante per garantire il servizio gratuito e di qualità, è stata progettata in modo che non sia troppo invasiva o che interrompa il flusso delle informazioni.

Mobile First

Ti piace come lavoriamo? Contattaci!

Passa a trovarci anche su Facebook e Twitter.
Please, rotate the screen
or view the website on other screen.