InOut: de botiga de plantilla a consergeria d'elit

InOut és consergeria d'elit per a propietaris de segones residències a Andorra. Partíem d'una botiga muntada sobre Shopify; l'hem reconstruïda amb codi propi fins a una web premium que presenta el servei amb la serietat que exigeix la seva clientela internacional.

El punt de partida

InOut és el nostre projecte insígnia a Andorra: un interlocutor de confiança per a qui administra un patrimoni a distància. El seu client no compara preus en una cistella. Decideix, en segons, si la marca que té al davant està a l'altura del que hi confiarà. En aquest context la web no és un fullet: és el primer filtre de serietat.

La versió de partida no ho era. Era una botiga sobre plantilla Shopify —catàleg, «afegir a la cistella», jerarquia pensada per vendre objectes—. Qui hi aterrava veia un comerç en línia qualsevol, no la porta d'una consergeria d'alt nivell. El desajust entre el servei real i la superfície digital es llegia al primer scroll.

Això no és cosmètica. En hospitality, immobiliària i gestió de patrimoni, la primera impressió digital forma part del servei. Tipografia per defecte i navegació de botiga comuniquen el contrari d'exclusivitat, per ben resolt que estigui el treball de darrere. És la mateixa bretxa que veiem en moltes consergeries d'elit a Andorra i marques d'alt nivell: oferta premium, superfície digital prestada.

El problema no era «falta de pàgines». Era de posicionament. Arquitectura, to i visual empenyien InOut cap al marc mental d'una botiga d'objectes, quan el que es ven és atenció, discreció i criteri. Un visitant amb expectativa d'elit i lògica de cistella no es queda a llegir el «qui som»: tanca la pestanya.

Calia reconstruir des de la lògica del servei. El copy, els titulars i l'ordre de seccions havien de conduir una conversa de confiança —disponibilitat, interlocutor, context del propietari—, no competir amb un catàleg. Sense inventar una veu artificial: alineant el que es veu amb el que InOut és de debò.

Decisions de disseny

Codi propi, de zero. No és caprici tècnic: és la condició perquè el disseny no quedi limitat pel que un constructor permet, i perquè el resultat no es confongui amb altres dues-centes webs del mateix tema. Controlem semàntica, pes de cada pàgina i comportament al mòbil sense barallar-nos amb capes alienes.

En tipografia, una composició editorial: contrast entre display i cos, ritme de lectura pensat per a mòbil i escriptori. L'objectiu no és «veure's més bonic» en abstracte. És que el visitant entengui en segons de què va el servei. Els titulars marquen territori; el cos sosté l'explicació sense soroll.

En fotografia, del stock de producte a un tractament cinematogràfic propi. La imatge deixa d'omplir i passa a sostenir la promesa: cura, ambientació, nivell. En consergeria, la foto no és decoració; és prova de criteri. No cal un dossier de 40 pàgines: cal un cop d'ull que digui que al darrere hi ha un estàndard alt.

L'arquitectura es va reescriure per presentar una consergeria, no un catàleg. Què s'ofereix, a qui, com es contacta. El propietari que gestiona des d'un altre país no vol deu pàgines de productes: vol entendre la proposta i parlar amb algú de confiança. WhatsApp com a canal directe; la web prepara la conversa, no la substitueix amb un embut de blocs.

Cada decisió va passar per la mateixa pregunta: això ajuda que un client internacional confii en segons, o el frena? Si no ajuda, no hi entra. És el mateix filtre que apliquem a la resta de la feina de Seuweb per a marques que no es poden permetre una primera impressió mediocre. Menys elements que omplen; més que decideixen: promesa, prova visual, contacte. Una consergeria d'elit no necessita cridar a la pantalla. Necessita que la pantalla no destorbi.

Resultats

Es veu i es mesura. En producció (inoutad.pages.dev), Lighthouse reporta rendiment 97, accessibilitat 96, bones pràctiques 100 i SEO 100. LCP de 2,1 s. CLS 0.

En experiència humana: la pàgina carrega a l'instant, es manté estable (sense salts de layout) i es llegeix com una web cuidada, no com un constructor amb plugins de més. Un propietari que entra des del mòbil no espera que «acabi de carregar el tema». Entra i entén. Aquesta diferència decideix si hi ha confiança o si es tanca la pestanya a la mateixa sessió.

Els números no són un trofeu d'informe. Són la prova que el codi propi i un hosting ben servit es noten de debò: usabilitat, indexació i lectura sense barallar-se amb la interfície. Quan un projecte es pressuposta a mida al pla Marca, part del que es compra és aquesta base. Si t'interessa el marc d'inversió d'un projecte d'aquest tipus —sense xifres d'aquest cas—, l'article de quant costa una pàgina web resumeix el criteri amb què treballem plans i abast.

Stack

Codi propi, exportació estàtica i CDN global (Cloudflare Pages). Fitxers lleugers, cache a prop del visitant, sense el pes d'un CMS o d'un constructor a cada visita. Menys peces mòbils en producció: menys sorpreses de rendiment i control directe sobre el que es publica.

InOut és la referència quan parlem de craft en disseny web premium a Andorra i al corredor que atenem: la Seu d'Urgell, l'Alt Urgell, la Cerdanya, el Pirineu i Andorra. Mateix estudi, mateix estàndard, sense jerarquies entre zones. Si el teu negoci ofereix un servei d'alt nivell i la web actual encara explica una altra història, el camí és el mateix: reconstruir des del servei, no maquillar la superfície. El delta que importa no és un llistat de features: és que la presència digital deixi de restar i comenci a estar a l'altura del que ofereixes.