8 Lug. 2019

Intranet mobile design: i pattern di Jesper

Sono un lettore assiduo di Jesper Bylund, un attivo e simpatico intranet manager della pubblica amministrazione svedese che i frequentatori dell’Intranet Italia Day credo conoscano bene (ha infatti partecipato l’anno scorso, qui la sua presentazione, e ci sarà anche quest’anno).

Il buon Jesper non manca mai di mettere a fattor comune le riflessioni che ricava dal suo lavoro di intranet manager alle prese con progetti di innovazione digitale all’interno delle organizzazioni.

Recentemente, ha scritto una serie di quattro post (un quinto seguirà) dedicati ai principi generali di progettazione della intranet mobile, che vi voglio segnalare.

Il primo post è dedicato al tema generale della intranet mobile e del suo ruolo e a come suddividere lo spazio all’interno di un progetto di design mobile.

basics iphone
La divisione di base degli spazi in un progetto di intranet mobile design

Il secondo post parla degli elementi comuni che devono stare su tutte le pagine della intranet mobile, ovvero, tipicamente, la testata.

Secondo Jesper (e sono d’accordo con lui), nella testata dovrebbero trovare posto:

  • Search (because you should be able to search from any place in the intranet);
  • Navigation menu (because you should be able to change section from any place);
  • The intranet name + logo (so you know what site you are using) (name and logo should also be the ”home” button, since this is the internet standard);
  • Profile access (for signing out/in, and intranet settings) (since most intranets need to be personalised in order to deliver the right stuff).
Intranet mobile header (by Jesper Bylund)
La testata tipo della intanet mobile: logo, profilo, ricerca, hamburger menù

Nel terzo post si descrive come deve essere una pagina tipo della intranet mobile, ovvero che elementi deve contenere. Per Jesper gli elementi sono:

  • H1 heading (only one!);
  • Preamble (summary of the page);
  • Action button;
  • Body text;
  • Sub-headings (optional);
  • Fact box (optional);
  • Further reading box (optional);
  • Contact for further questions about the question (optional);
  • Meta info about the page (e.g. facts owner, publicist, date updated, breadcrumb);
  • Minor functions (e.g. save as a favourite, report an error, rating/was this page helpful?, print, share) (optional).
Intranet mobile page  (by Jesper Bylund)
Una pagina tipo della intranet mobile

Se non vi basta lo screenshot, il generoso Jesper ha anche creato un mock up navigabile della pagina tipo.

Nel quarto post si parla invece di come deve funzionare la navigazione locale all’interno della intranet mobile, ovvero, sostanzialmente, sostituendo il menù locale con uno scrolling delle sezioni.

Intranet mobile local navigazion (by Jesper Bylund)
Nella intranet mobile il menù di navigazione locale è sostituito da uno scrolling delle varie sezioni

Tutti i mock up sono disponibili in un prototipo di base

Finisco questo post segnalandovi che alla prossima edizione dell’Intranet italia Day, il 10 e 11 ottobre a Milano, Raffaele Boiano terrà un workshop dedicato alla intranet mobile strategy.

A presto 🙂

Giacomo Mason
Giacomo Mason