Si estàs plantejant-te crear o actualitzar la teva web, aquest article t’interessa.
Vull compartir amb tu el mètode que faig servir a Breu, el meu estudi de disseny gràfic, per crear pàgines web. Així podràs començar a fer-te algunes preguntes que t’ajudaran a enfocar-la i saber què has de tenir en compte.
1. Definir els objectius i jerarquitzar
El primer que fem és definir quina és la funció principal o objectiu de la web. En alguns casos això és molt evident, però hi ha vegades que podem tenir diversos objectius. Quan això passa, els hem de saber jerarquitzar i definir prioritats.
També analitzem els nostres usuaris, els seus objectius, necessitats, gustos i expectatives. Normalment també aprofitem aquest moment per definir requeriments tècnics, com per exemple si la web serà estàtica o dinàmica, el gestor de continguts que farem servir, etc…
2. Estructurar els continguts i funcionalitats
El següent pas és fer un llistat de tots els continguts de la web i agrupar-los per categories, com si féssim un inventari. Un cop ho tenim llest, els endrecem amb un esquema o diagrama. Aquest procés te el nom de Arquitectura de la Informació (IA)
3. Estudiar la usabilitat i la interacció
Ara que ja tenim clara l’estructura, ens centrem en l’Experiència d’Usuari (UX). Definim què hi haurà a cada pantalla i quins sistemes farem servir per navegar per la web. Per fer-ho, crearem uns esquemes anomenats wireframes. Per què et facis una idea, seria com mostrar les pantalles de la web sense disseny, treballant només l’estructura.
Aquests wireframes ens serveixen per treballar la usabilitat de la web, creant un prototip amb el qual podem interactuar, fent click als botons i menús, per tal d’assegurar-nos que l’estructura i la navegació són intuïtives.
Li donem molta importància a aquesta fase, ja que estem definint els fonaments del que serà la pàgina web.
4. Dissenyar i testejar
Amb una estructura sòlida definida, podem començar a dissenyar la Interfície d’Usuari (UI). Partim de les directrius de disseny marcades al manual corporatiu de l’empresa, per tal dissenyar una web que sigui coherent amb la seva identitat de marca.
Primer definim el disseny d’algunes pantalles representatives de la web, i un cop el client aprova la nostra proposta, dissenyem la resta de la web, i la seva versió adaptada a dispositius mòbils. Acostumem a acabar aquesta fase amb un nou prototip amb el qual interactuem i testegem el disseny final o un vídeo que mostri el disseny i la interacció entre pantalles.
5. Programar i continuar testejant
Arribats a aquest punt, passem a programar i maquetar la web. Depenent de cada cas, utilitzem uns recursos diferents, per adaptar-nos a les necessitats de cada client i projecte. Per una banda hi ha la part del backend, que fa que la web es connecti al servidor i a la base de dades i recull la informació per fer que la web la pugui consumir. I la part del frontend, que és la que s’encarrega de mostrar tota aquesta informació de manera visual, seguint les pautes que s’han definit durant la creació de la interfície de la web.
Testegem les nostres webs amb els navegadors i dispositius moderns, a no ser que el client ens demani d’entrada que sigui compatible amb altres que ja han quedat desfasats.
6. Formació i manteniment
Un cop la web està online, expliquem als nostres clients com ho han de fer per gestionar-la de manera independent. En alguns casos elaborem uns vídeos tutorials explicant com funciona el gestor de continguts, per tal que tinguin autonomia a l’hora de canviar textos, imatges o crear pàgines noves sense haver de dependre de ningú.
A la meva agència digital Breu, també els hi oferim diferents serveis de manteniment en funció de les seves necessitats o plategem futures fases on en un futur podem introduïr-hi millores o noves funcionalitats.
Espero que aquest article t’hagi servit per entendre millor el procés de disseny d’una web. Si t’ha sorgit algun dubte, estaré encantada de resoldre’l a baix als comentaris.