1. Delimitació de l’Objectiu i Definició de la Identitat

El punt de partida en la gestió de la imatge corporativa ha estat la concreció dels objectius principals del projecte. Es va procedir a la identificació precisa de la marca, determinant-ne els valors fonamentals, la missió estratègica i el perfil del públic destí. Aquesta etapa inicial de planificació ha resultat indispensable per assegurar que tot el desenvolupament visual posterior mantingui una alineació estricta amb l’essència de l’entitat.

2. Investigació i Diagnòstic de Mercat

Es va dur a terme una anàlisi a fons de l’entorn competitiu i del sector per tal de detectar les tendències dominants en el disseny de marques. Mitjançant la realització d’una matriu DAFO (Fortaleses, Oportunitats, Debilitats i Amenaces), es va avaluar la posició de la marca, identificant quins recursos i llenguatges visuals encaixaven millor amb la seva proposta de valor i amb les expectatives dels seus usuaris.

3. Fase Creativa i Generació de Conceptes

Durant aquesta etapa, es van explorar múltiples línies conceptuals per configurar la proposta visual. Es van analitzar des de plantejaments més classics o conservadors fins a alternatives trencadores i modernes, elaborant diversos esbossos i esquemes previs. En aquesta cerca es van ponderar acuradament la selecció tipogràfica, l’harmonia del color, l’estructura del logotip i l’equilibri compositiu global.

4. Formulació i Construcció de la Marca

Un cop validada la línia conceptual idònia, es va passar a la producció dels elements visuals. Es van dissenyar diferents adaptacions del logotip, es va estructurar la paleta cromàtica oficial i es van triar les fonts tipogràfiques corporatives. A més, es va elaborar un manual d’estil o guia d’identitat per assegurar l’aplicació rigorosa i uniforme de la marca en qualsevol suport.

5. Desplegament i Implementació de la Imatge

La marca es va traslladar als diferents punts d’interacció i formats d’aplicació, incloent-hi la papereria corporativa (targetes de presentació, capçaleres, documentació), la senyalètica de les instal·lacions, el lloc web i els perfils a les xarxes socials. Es va revisar minuciosament que cada canal transmetés el missatge i els valors de l’organització de manera harmoniosa i cohesionada.

6. Auditoria, Retroalimentació i Ajustos

Per tancar el procés, es va realitzar un seguiment de l’impacte de la imatge corporativa mitjançant la recollida d’impressions i valoracions de clients i usuaris. Amb aquesta informació es van detectar possibles punts d’optimització, aplicant els retocs o ajustos finals necessaris per consolidar l’èxit i l’efectivitat de la marca.

. Justificació de la Paleta de Colors i Accessibilitat

• Elecció i significat de la paleta triàdica: Per al disseny de la identitat visual s’ha triat una paleta de colors basada en la harmonia triàdica (tres colors equidistants en el cercle cromàtic). Aquesta combinació permet mantenir un alt nivell de contrast visual alhora que ofereix riquesa cromàtica i dinamisme.
  

  • Color principal: Transmet professionalitat, confiança i estabilitat.
  • Color secundari: Aporta energia, creativitat i dinamisme.
  • Color d’accent: Utilitzat per destacar crides a l’acció (CTA) i elements clau.

• Reforç de la identitat de marca: L’ús d’aquesta combinació triàdica garanteix que la marca es percebi com a moderna, equilibrada i recognoscible. La jerarquia dels colors ajuda a guiar la navegació de l’usuari de manera intuïtiva.
• Comprovació de contrast i accessibilitat: Per garantir que el lloc sigui accessible per a qualsevol persona, incloses aquelles amb deficiències visuals, s’han verificat les combinacions de text i fons mitjançant eines de validació de contrast segons la normativa WCAG 2.1 AA. Es va comprovar que la ràtio de contrast mínima sigui de 4.5:1 per al text normal i 3:1 per al text gran i elements d’interfície.

2. Aplicació Coherent dels Colors Corporatius

• Consistència en tot el lloc: Els colors s’han aplicat de manera uniforme a totes les pàgines i seccions de la web:
  

  • Fons i estructures: Ús de tons neutres derivats de la paleta per mantenir la llegibilitat.
  • Elements d’interfície (UI): Els botons primaris, enllaços i estats hover utilitzen el color d’accent i secundari de manera coherent.
  • Tipografia: Es manté un alt contrast entre el text principal i el fons per evitar la fatiga visual.

• Reforç continu de la marca: L’aplicació sistemàtica de la paleta en capçaleres, peus de pàgina i targetes de contingut consolida la imatge corporativa i enforteix la presència de la marca a cada interacció de l’usuari.

1. Fundamentos del Diseño Estructural y Experiencia de Usuario (UX)

La distribución espacial de la plantilla se ha estructurado siguiendo las directrices esenciales de composición gráfica y diseño centrado en el usuario (UX). El objetivo principal es ofrecer una navegación fluida, una jerarquía clara del contenido y un acabado estéticamente equilibrado.

• Disposición de los componentes de navegación: Se han ubicado de forma destacada en la cabecera (o en un plano accesible de manera continua) para asegurar que el usuario pueda orientarse e interactuar con el sitio de manera directa, sin esfuerzo de desplazamiento (scroll) innecesario.
• Organización de los bloques de texto: La información textual sigue un orden jerárquico bien definido (encabezados, subtítulos y cuerpo de texto), utilizando tipografías con contraste idóneo y márgenes de descanso para optimizar la legibilidad y evitar la fatiga visual.
• Integración de recursos gráficos e imágenes: Los elementos visuales se integran en paralelo al texto explicativo, reforzando el mensaje conceptual y respetando la cuadrícula sintáctica (grid) y los márgenes de seguridad del diseño.

2. Coherencia Visual y Definición de la Plantilla

Se ha desarrollado un modelo de plantilla global que actúa como marco de trabajo normalizado, garantizando la uniformidad estética y funcional en la totalidad de la plataforma:

• Identidad visual unificada: Definición y aplicación sistemática de una misma paleta cromática, familias tipográficas proporcionales y estilos de componentes a lo largo de todas las secciones.
• Regularidad en el maquetado: Se conservan las proporciones, los espacios en blanco y la alineación de los bloques de contenido en cada pantalla, logrando una presentación sólida, ordenada y con un estándar profesional.

1. Justificació de la Tipografia i Combinació

Per al desenvolupament de la interfície web s’ha seleccionat la font principal Poppins (Sans-Serif):

• Llegibilitat: Poppins és una font geomètrica sans-serif dissenyada específicament per a pantalles. Té una alçada de la “x” gran i formes obertes que garanteixen una lectura còmoda i clara en qualsevol dispositiu i mida de text.
• Jerarquia Visual: Permet treballar amb una àmplia varietat de pesos (Font Weight) i mides (Font Size). Això garanteix que els títols, subtítols i texts de cos (Body Font) es distingeixin clarament entre ells, guiant l’usuari de manera intuïtiva.
• Coherència amb la Imatge Corporativa: La seva línia moderna, neta i professional transmet una imatge digital actualitzada i adaptada als estàndards de disseny web moderns.

2. Paràmetres de Configuració Aplicats

A través del menú de personalització del tema (Customizing > Typography > Base Font / Body Font), s’han definit de manera global els següents valors:

• Família de Font (Font Family): Poppins, Sans-Serif.
• Pes de la Font (Font Weight): Normal 400 per al cos del text, assegurant una lectura lleugera i sense fatiga visual.
• Mida de Font (Font Size): 16px, la mida estàndard recomanada per a una òptima accessibilitat en entorns web.
• Interlineat (Line Height): 1.65, un espaiat proporcional que millora el flux de lectura i la claredat entre línies.

3. Registre de Passos i Evidències Visuals

Per tal d’aplicar aquests canvis de manera coherent a tot el lloc web, s’ha seguit el següent procés pas a pas:

1. Accés a la Configuració Global: Dins del personalitzador, s’ha accedit a la secció Global.
2. Selecció de Tipografia: S’ha entrat a l’apartat Typography per gestionar les opcions del lloc.
3. Ajustaments de la Font Base: Dins de Base Font / Body Font, s’ha configurat la font Poppins amb mida de 16px i interlineat de 1.65.

Evidències del procés:

1. Justificació i Anàlisi dels Plugins Triats

Plugin 1: PDF Generator For WP

• Necessitat concreta del projecte: Permetre als usuaris o administradors exportar articles, pàgines o contingut específic del lloc web directament en format PDF per a la seva descàrrega o impressió neta.
• Anàlisi de Compatibilitat: És totalment compatible amb les darreres versions de WordPress i la majoria de temes estàndard. Integrat directament al panell d’administració.
• Manteniment: Rep actualitzacions periòdiques per part dels desenvolupadors per corregir errors i mantenir la seguretat.
• Impacte en el rendiment: Molt baix. Només executa codi quan un usuari sol·licita la generació del document PDF, per la qual cosa no afecta la velocitat de càrrega general del lloc.

Plugin 2: Post Type Switcher

• Necessitat concreta del projecte: Proporcionar una eina d’edició ràpida per canviar el tipus de contingut (Custom Post Type) de qualsevol publicació (per exemple, convertir una Entrada/Post standard a una Pàgina o un Producte) sense haver de reescriure el contingut.
• Anàlisi de Compatibilitat: Integració fluida amb l’editor de blocs (Gutenberg) i l’editor clàssic de WordPress.
• Manteniment: Plugin lleuger i consolidat en el repositori de WordPress que requereix un manteniment mínim.
• Impacte en el rendiment: Nul en el front-end (part pública). Només afegeix una opció a l’àrea d’edició de l’administrador (back-end).

2. Procés d’Instal·lació, Configuració i Integració

Per tal de garantir un entorn eficient i lliure de conflictes, s’ha seguit el següent procediment pas a pas:

1. Accés al Tauler d’Administració: Navegació fins a la secció Plugins > Afegeix de nou des del menú principal de WordPress.
2. Cerca i Instal·lació: Cerca individual dels plugins PDF Generator For WP i Post Type Switcher al repositori oficial.
3. Activació: Prement el botó Activar en cadascun per posar-los en funcionament.
4. Ajustos de Configuració:

   • PDF Generator For WP: Configuració dels paràmetres visuals del PDF (capçalera, peu de pàgina i botó de descàrrega visible a les entrades).
   • Post Type Switcher: Verificació de l’aparició del selector de tipus de publicació a la barra lateral de l’editor de publicacions.

Pas 1: Ves als temes

1. Inicieu la sessió al Tauler del WordPress.
2. Feu clic a Aparença al menú de l’esquerra.
3. Feu clic a Temes.

Pas 2: Afegeix un tema nou

4. Feu clic a Afegeix un tema nou.
5. Veuràs diferents temes.

Pas 3: Trieu un tema

6. Trieu el tema que voleu.
7. Feu clic a Instal·la.

Pas 4: Activa el tema

8. Espera que acabi la instal·lació.
9. Feu clic a Activa.

Pas 5: Consulta la teva web

10. Ves al teu lloc web.
11. Verifiqueu que el tema nou està activat.
12. Ara pots personalitzar el teu lloc web.