Acció

Acció és l'agència pública per a la competitivitat de l'empresa catalana. El seu objectiu és impulsar la competitivitat i el creixement del teixit empresarial català, informant-los i ajudant-los a créixer a través de l'estímul de la innovació, la internacionalització i l'atracció d'inversions.

L'agència Acció és un referent públic per contribuir a la transformació de les empreses. Compta amb una xarxa de 40 oficines arreu del món, 7 delegacions a Catalunya i col·labora amb institucions públiques i privades per fer avui l'empresa del demà.

Informar les empreses de tots els seus serveis i ajudes és fonamental per a Acció, per la qual cosa ens van demanar ajuda per aplicar la seva nova imatge de marca en totes les seves comunicacions corporatives d'email marketing.

A més de l'actualització del disseny per reflectir la nova identitat de marca, s'han fet canvis d'estil, estructura de continguts i mides en tots els elements dels emails. Els butlletins d'Acció no s'adaptaven a mòbils correctament, per la qual cosa també hem desenvolupat una nova maquetació responsive que és òptima per a la seva visualització en dispositius de diferents resolucions.

Les comunicacions que Acció fa als seus subscriptors contenen informació molt detallada i completa, per la qual cosa havíem de mostrar tota aquesta informació de la forma més clara possible, equilibrant estètica i densitat de contingut. A més, tots els emails havien de complir amb els estàndards d'accessibilitat AA, que permeten que el contingut sigui accessible per a persones de diferents capacitats.

Un subscriptor d'Acció pot rebre diversos butlletins de diferents seccions, per la qual cosa cadascun dels tipus de butlletí ha de poder distingir-se clarament dels altres, perquè l'usuari pugui diferenciar un tipus de comunicació d'un altre.

Un cop conegudes les necessitats del client, des de Ondho vam estudiar les possibles solucions a utilitzar en aquest projecte de redisseny i maquetació d'emails. El nostre procés de treball s'ha dividit en les següents fases.

Anàlisi de contingut

L'equip, coordinat pel gestor de projecte, va analitzar els diferents emails que s'estaven enviant des d'Acció en aquell moment. D'aquest estudi, vam plantejar diferents millores a implementar d'acord amb les necessitats i possibilitats actuals, com ara:

• Inclusió de botons tipus Call to action visibles i que destacin
• Revisió de la mida del copy i de les imatges

Wireframes i prototipatge

Després d'aquest anàlisi, s'ha realitzat una proposta de nova estructura per al contingut de tots els emails, que ens ha servit com a base per materialitzar el nou disseny plantejat.

Aquesta fase de realització de wireframes també ens ha facilitat crear la reestructuració del ampli contingut i la divisió en blocs, que funcionen tant per a desktop com mobile.

Disseny gràfic

Partint de l'arquitectura aprovada, s'han analitzat les diferents necessitats de disseny juntament amb les de desenvolupament: mides de copy i d'imatge, formats d'imatge, tipografies a utilitzar, gamma de colors, etc. Tot això seguint els estàndards d'accessibilitat i mantenint la identitat visual i corporativa d'Acció.

S'ha utilitzat el color com a element per diferenciar els tipus d'emails. Cada butlletí té un color principal, dins de la gamma cromàtica corporativa d'Acció, que s'aplica en titulars, botons o textos destacats.

Maquetació

L'equip de desenvolupament ha seguit de prop totes les propostes enviades per assegurar que el nou disseny sigui compatible i viable en la maquetació. Es planteja una maquetació html d'estructura clarament jerarquitzada i mobile first.

S'han tingut en compte també els lectors de correu més problemàtics, com Outlook (Windows) i Gmail, que compten amb un menor suport, i es plantegen alternatives per a les opcions de disseny escollides que no es veuen de forma òptima en aquests gestors.

Prova i revisió

Finalment, tots els emails han estat provats en diferents eines per verificar que el contingut s'adapta bé a tots els dispositius. S'ha tingut en compte l'accessibilitat en temes de disseny com el contrast de colors, estructura, mides de text, textos alternatius, etc.