Fundació iSocial

Fundació iSocial

Disseny i desenvolupament del nou web i ecommerce de la Fundació iSocial, amb una estètica renovada i alineada amb la seva identitat corporativa per millorar l’experiència d’usuari i facilitar la inscripció als cursos de manera virtual.

Client

Fundació iSocial

Any de creació

Àmbits del projecte

Lloc web

isocial.cat

El nou web de la Fundació iSocial és la culminació d’una relació que va començar l’any 2018 amb el disseny i desenvolupament del seu primer web, una col·laboració que ha anat creixent i evolucionant per adaptar-se a les necessitats canviants de l’entitat.

Aquest procés d’actualització ha estat marcat per l’expansió de la seva activitat i la creació del seu campus de formació, un espai pensat per als professionals i les organitzacions de serveis socials que volen afrontar de manera creativa i innovadora els reptes de transformació del sector. El nou web integra aquest campus amb un ecommerce que facilita la inscripció als cursos de manera àgil i completament virtual.

Més enllà de l’actualització visual, el projecte va suposar una millora significativa en la navegació, el contrast tipogràfic i la presentació de la informació, amb l’objectiu de simplificar la interacció de l’usuari i assegurar un accés ràpid i intuïtiu als recursos i continguts de la Fundació.

Fundació iSocial
Fundació iSocial
Fundació iSocial
Fundació iSocial
Fundació iSocial

El resultat final és un web modern i accessible amb un ecommerce integrat, alineat amb la identitat corporativa de la Fundació iSocial. Un disseny tipogràfic clar, una paleta cromàtica equilibrada i una estructura simplificada permeten una experiència d’usuari òptima i una presentació clara dels serveis formatius, millorant significativament la presència digital de la Fundació i facilitant l’accés als cursos i recursos de manera ràpida i eficient.

ICC Spain

Disseny i desenvolupament de la pàgina web de la Cambra de Comerç Internacional ICC Espanya.

Client

Comité Español Cámara de Comercio Internacional

Any de creació

Àmbits del projecte

Lloc web

iccspain.org

El projecte per a la Cambra de Comerç Internacional ICC Espanya implicava la creació d’una plataforma web moderna i funcional, que reflectís la importància i el prestigi de la institució. La Cambra de Comerç Internacional és una xarxa global, i la versió espanyola necessitava una pàgina que no només complís amb els seus estàndards corporatius internacionals, sinó que també oferís funcionalitats específiques per als seus usuaris, com ara sistemes de cerca avançada, una botiga en línia i una zona privada.

En el procés de disseny i creació del nou web, vam plantejar des del començament tant el disseny visual com l’estructura dels continguts, assegurant una navegació clara i organitzada. L’objectiu era que la pàgina web servís com una eina de treball per als usuaris i membres de la Cambra, facilitant l’accés a la informació, la compra de recursos i la gestió del perfil d’usuari.

Pel disseny del web ens vam basar en la imatge corporativa d’ICC Espanya, seguint les pautes de colors i formats utilitzats en altres webs internacionals de les Cambres de Comerç. No obstant això, no ens vam limitar a replicar aquests elements, sinó que els vam adaptar i enriquir. Un dels elements distintius va ser l’ús de les línies en arc del logotip d’ICC Espanya com a base per desenvolupar diversos blocs del web. Aquestes línies es van integrar de manera creativa a la composició de la pàgina, aportant dinamisme i coherència visual. A més, vam incorporar imatges combinades amb blocs de contingut, cosa que va ajudar a estructurar la informació de manera clara i atractiva.

Pàgina d'inici web ICC Spain
Pàgina interior web ICC Spain
Pàgina interior web ICC Spain
Pàgina interior web ICC Spain

Una de les principals característiques del web és el sistema de cerca avançada, que permet als usuaris fer consultes sobre diverses temàtiques relacionades amb el comerç internacional i els serveis que ofereix la Cambra. Aquest sistema facilita la navegació i l’accés a informació rellevant, millorant l’experiència d’usuari.

A més, vam desenvolupar una botiga en línia integrada al web, on es poden comprar llibres i altres recursos relacionats amb el comerç i la normativa internacional. La botiga disposa d’un catàleg fàcilment navegable, cosa que permet als usuaris trobar i adquirir els productes de manera ràpida i senzilla.

El web també compta amb una zona privada per a usuaris, on els membres poden registrar-se, gestionar el seu perfil i accedir a contingut exclusiu. Aquesta àrea privada es va dissenyar amb un especial enfocament en la seguretat i facilitat d’ús, garantint que els usuaris poguessin navegar sense complicacions i fer gestions de manera autònoma.

Per últim, vam incloure un apartat d’esdeveniments, on els usuaris poden consultar informació sobre seminaris, conferències i altres activitats organitzades per la Cambra de Comerç. Aquest apartat compta amb un sistema de filtratge que permet cercar esdeveniments segons temàtiques, dates o altres criteris, millorant així l’accessibilitat i organització de la informació.

En conjunt, el disseny i desenvolupament del web de la Cambra de Comerç Internacional ICC Espanya va proporcionar una plataforma moderna, funcional i alineada amb els estàndards internacionals, oferint alhora eines avançades per millorar l’experiència dels usuaris i facilitar-ne les interaccions amb la institució.

Flors Lloveras

Creació del web amb botiga en línia per a la floristeria barcelonina Flors Lloveras.

Client

Flors Lloveras

Any de creació

Flors Lloveras és una floristeria amb una llarga tradició a Barcelona, coneguda per l’atenció al detall i la qualitat de les seves composicions florals. L’objectiu del projecte era crear una nova pàgina web que reflectís l’estil únic de la floristeria i, alhora, integrar la botiga en línia ja existent, millorant tant la seva funcionalitat com la seva aparença. El disseny havia de transmetre la delicadesa i bellesa de les flors, al mateix temps que proporcionava una experiència d’usuari intuïtiva i eficient.

Un dels elements clau del disseny va ser la incorporació d’una sèrie de dibuixos a llapis de detalls florals, que actuaven com a fil conductor al llarg de totes les pàgines del web. Aquests dibuixos, que evocaven la delicadesa i naturalitat de les flors, funcionaven com a elements decoratius i unificadors del disseny, aportant una identitat visual coherent i distintiva. Al costat d’aquests dibuixos, es van crear collages amb fotos seleccionades acuradament, que capturaven l’essència del treball artesanal de Flors Lloveras. Aquestes imatges no només mostraven els productes, sinó que també transmetien l’ambient i la dedicació de la floristeria, connectant emocionalment amb els usuaris.

Pel que fa als colors, es va adaptar la paleta corporativa de la floristeria, mantenint una coherència visual que respectés la seva identitat de marca. Es van combinar tons suaus i naturals per crear un disseny harmònic i elegant, en sintonia amb l’estil de Flors Lloveras.

Pàgina web Flors Lloveras
Pàgina web Flors Lloveras
Pàgina web Flors Lloveras

El projecte presentava un repte particular: la floristeria ja comptava amb una botiga en línia que els propietaris volien mantenir. La nostra tasca va consistir en adaptar la botiga al nou disseny, garantint que el canvi estètic no afectés ni el funcionament ni l’experiència de l’usuari. A més, vam dur a terme una revisió global del funcionament de l’eCommerce per assegurar que estigués actualitzada i funcionant de manera òptima, tant en termes de rendiment tècnic com d’usabilitat.

El resultat va ser una pàgina web que combina un disseny elegant i emotiu amb una botiga en línia completament funcional. Aquesta solució va permetre a Flors Lloveras mantenir la seva presència digital actualitzada, oferint als seus clients una plataforma atractiva i fàcil d’usar per a la compra dels seus productes. La combinació d’elements gràfics, fotografies cuidades i una estructura intuïtiva de la botiga va destacar el treball artesanal i la dedicació d’aquesta floristeria.

Bioregions

Disseny i desenvolupament web de Bioregions: bioeconomia circular als boscos europeus.

Client

European Forest Institute (EFI)

Any de creació

Àmbits del projecte

El projecte Bioregions promou la bioeconomia circular als boscos europeus, amb un enfocament innovador per a la gestió sostenible dels recursos forestals. El web original del client ja estava desenvolupat amb WordPress, però presentava problemes d’organització del contingut i de presentació de la informació segons els seus desitjos. Per aquesta raó, es va decidir refer completament el lloc web, mantenint WordPress com a base, però utilitzant l’editor Gutenberg, que permet una major autonomia en la gestió de continguts per part del client.

El nou disseny va ser una oportunitat perfecta per crear una imatge fresca i millor alineada amb els valors del projecte. Ens vam inspirar en el logotip de Bioregions, on es representa una fulla amb línies i punts arrodonits als vèrtexs. Aquestes formes es van convertir en l’eix visual del nou disseny, amb línies fines que creixien i es ramificaven, generant elements decoratius com fulles i punts. Aquestes figures es van integrar harmònicament al llarg de les pàgines, aportant dinamisme i creant una identitat visual coherent amb la temàtica de la bioeconomia i la sostenibilitat.

pàgina d'inici Bioregions
pàgina interior Bioregions
pàgina interior Bioregions

El disseny no es va limitar només a l’estètica, sinó que també va millorar la funcionalitat del web. Els elements gràfics es van combinar amb cura amb les imatges i els textos, creant composicions visuals que destacaven per la seva elegància i la capacitat de transmetre els missatges clau del projecte. Cada pàgina va adquirir una identitat pròpia, però mantenint una coherència visual que reflectia els objectius i valors de Bioregions.

Aquest enfocament va permetre crear un lloc web no només atractiu visualment, sinó també molt més funcional i fàcil de gestionar per al client, millorant significativament l’experiència d’usuari i la presentació dels continguts.

MARQuitectura

Disseny i desenvolupament del nou web de l’estudi barceloní d’arquitectura sostenible MARQuitectura.

Client

MARQuitectura

Any de creació

MARQuitectura és un estudi d’arquitectura amb seu a Barcelona, especialitzat en projectes d’arquitectura sostenible, compromès amb l’eficiència energètica i l’ús responsable dels recursos. Tot i la seva sòlida trajectòria en el sector, l’estudi necessitava renovar la seva pàgina web, que havia quedat obsoleta tant en disseny com en funcionalitat.

L’antic web no reflectia adequadament la qualitat i la visió de MARQuitectura. La navegació era confusa, ja que els continguts estaven separats entre la pàgina principal i un blog extern, fet que complicava l’experiència d’usuari i no transmetia una identitat visual coherent.

El projecte es va centrar en el disseny integral del lloc web, posant èmfasi en destacar visualment els projectes de l’estudi amb un enfocament net i modern. Es va apostar per donar protagonisme a imatges de gran format, aprofitant la galeria fotogràfica d’alta qualitat dels projectes destacats de MARQuitectura. Aquestes imatges es van combinar amb elements visuals sobris, com caixes de colors neutres, que harmonitzaven amb la paleta corporativa de l’estudi, respectant sempre la seva identitat visual.

Pàgina d'inici web Marquitectura
Pàgina interior web Marquitectura
Pàgina interior web Marquitectura

A més del desenvolupament web, el projecte va incloure el redisseny del logotip. Basant-se en el concepte original, es van fer ajustaments per modernitzar-lo i donar-li un aspecte més suau i accessible. Les línies es van estilitzar cap a formes arrodonides i més amigables, mentre que la tipografia es va actualitzar per reflectir una imatge contemporània i professional.

Aquest nou web no només va millorar l’aspecte visual de la marca, sinó que també va simplificar la navegació i va reforçar la coherència de la identitat de MARQuitectura.

Logo Marquitectura

Tuber Label

Desenvolupament i disseny de la pàgina web de Tuber Label per a la implementació d’eines per al sector tofoner.

Client

Jasten Fröjen

Any de creació

Àmbits del projecte

Lloc web

tuberlabel.es

El projecte de Tuber Label va tenir com a objectiu desenvolupar una pàgina web que representés la implementació d’eines tecnològiques per al sector tofoner a Espanya. Ja comptàvem amb la imatge corporativa i el logotip proporcionats per l’agència Jasten Fröjen. Aquest logotip incloïa una trama que simulava les formes laberíntiques de les tòfones, i vam decidir expandir aquesta idea en el disseny visual del web. Inspirant-nos en aquestes formes, vam crear una sèrie de figures relacionades amb el món de la tòfona, que van aportar una identitat visual coherent i única al projecte.

Per al disseny del web, vam mantenir els colors corporatius establerts, amb el negre com a color de fons principal. Aquest fons fosc va permetre que la trama i les figures destacaren de manera elegant i cridanera. L’ús del negre no només va aportar un toc de sofisticació, sinó que també va reforçar la connexió visual amb les formes orgàniques de les tòfones, creant una estètica sòlida i coherent amb la marca.

Pàgina d'inici web Tuberlabel
Pàgina interior web Tuberlabel
Pàgina interior web Tuberlabel

Les figures dissenyades, basades en la trama del logotip, es van utilitzar de manera estratègica a les capçaleres del web, integrant-se de forma natural en el disseny general. Aquestes figures, que incloïen elements com un gos tofoner, una pala i referències al menjar gurmet, van reforçar la connexió visual amb el món de la tòfona, assegurant que la web reflectís clarament l’especialització del sector.

Aquest enfocament visual, combinat amb una estructura funcional, va aconseguir transmetre l’essència del negoci de Tuber Label, així com la seva connexió amb la natura i el treball artesanal entorn de la tòfona. La combinació d’un disseny acurat i l’ús estratègic d’elements visuals va fer que la web fos no només informativa i funcional, sinó també altament representativa de la identitat del projecte.

Eufore

Creació de la pàgina web per a The European Forest Research and Innovation Ecosystem.

Client

European Forest Institute (EFI)

Any de creació

Àmbits del projecte

Lloc web

eufore.eu

El projecte Eufore (The European Forest Research and Innovation Ecosystem) té com a objectiu crear un entorn sostenible, transnacional i cocreatiu per definir, implementar i avaluar un full de ruta de recerca i innovació (I+i) centrat en les cadenes de valor forestals a Europa. El desafiament era dissenyar una pàgina web que no només reflectís aquests objectius, sinó que també transmetés visualment la connexió entre la recerca, la innovació i la sostenibilitat en l’àmbit forestal europeu.

El disseny del web va partir del logotip existent del projecte, que presentava un patró d’arbres repetits amb un degradat de colors que anava del taronja al blau, passant per tons de groc i verd. Aquests colors i patrons es van convertir en la base del desenvolupament visual del lloc. Es van utilitzar les figures del logotip de manera creativa, integrant imatges de boscos com a fons, cosa que va reforçar la connexió visual amb la temàtica forestal.

A més, vam crear dibuixos amb línies que representaven persones i entorns, simbolitzant la interacció entre els éssers humans i els ecosistemes. Aquests dibuixos van posar de manifest l’enfocament cocreatiu i col·laboratiu del projecte, afegint una capa de significat visual que complementava la temàtica de sostenibilitat i innovació en els boscos europeus.

Pàgina d'inici web Eufore
Pàgina interior web Eufore
Pàgina interior web Eufore
Pàgina interior web Eufore

Els patrons amb fotos i línies es van utilitzar de manera estratègica a les capçaleres del web, donant a cada secció una identitat única però cohesiva. També es van incorporar a les infografies i gràfics al llarg del lloc, reforçant la identitat visual d’Eufore i facilitant la presentació d’informació tècnica de manera clara i atractiva.

Gràcies a aquest disseny, la pàgina web no només es va convertir en una plataforma informativa sobre els objectius de recerca i desenvolupament del projecte, sinó també en una eina visualment atractiva que connectava els usuaris amb l’essència dels ecosistemes forestals europeus i els esforços per preservar-los i innovar en la seva gestió.

Energiehaus

Disseny i desenvolupament web i imatge corporativa d’Energiehaus.

Client

Energiehaus

Any de creació

El nou web d’Energiehaus, un estudi barceloní d’arquitectura i consultoria especialitzat en arquitectura sostenible i construcció sota els estàndards de Casa Pasiva (Passivhaus), va suposar un desafiament per nosaltres. El nou lloc necessitava integrar una plataforma corporativa amb diversos serveis, un Showroom, la secció Showpass, una botiga en línia per a la venda de cursos, una àrea d’esdeveniments i un bloc, exigint un desenvolupament integral que cobrís tant la creació de la imatge corporativa com el disseny i el desenvolupament del web.

El projecte va començar amb la creació de prototips o wireframes per estructurar les pàgines de manera clara i funcional. La navegació intuïtiva era una prioritat, permetent als usuaris accedir fàcilment a l’ampli ventall de serveis que ofereix Energiehaus. Cada secció, des de la botiga en línia fins al bloc, es va dissenyar amb una identitat visual pròpia, però mantenint una coherència general amb la imatge de marca.

El client es va decantar per un disseny basat en collages que combinaven figures naturals com arbres i altres elements ambientals amb fotografies retallades en blanc i negre. Aquest enfocament estètic distintiu reforçava el missatge de sostenibilitat, alhora que mantenia una imatge elegant i moderna. Vam dissenyar també una sèrie d’infografies i icones que seguien aquesta línia gràfica per comunicar visualment els serveis d’Energiehaus de manera clara i atractiva.

Pàgina d'inici detall
Pàgina interior Energiehaus
Pàgina d'inici detall Energiehaus
Pàgina interior Energiehaus

Exemples de collages que es van realitzar per a les capçaleres i elements del web.

Paral·lelament, vam desenvolupar un nou logotip inspirat en el concepte de Casa Passiva, on l’energia externa envolta i beneficia l’interior d’una construcció. El logotip utilitzava una icona d’una casa, representant aquest flux d’energia de manera simple però poderosa. El contrast entre el color negre del logotip i el groc intens que l’envoltava reforçava la identitat visual de la marca, simbolitzant l’energia que envolta i protegeix, un element clau en la filosofia d’Energiehaus.

El resultat final va ser una pàgina web dinàmica, estèticament atractiva i altament funcional que va capturar perfectament els valors d’innovació, sostenibilitat i eficiència energètica d’Energiehaus, consolidant la seva presència en línia i millorant la comunicació de la seva expertesa en arquitectura sostenible.

Logo Energiehaus

Holisoils

Desenvolupament web i disseny per al projecte Holisoils, per a la gestió holística, modelització i seguiment dels sòls forestals europeus.

Client

European Forest Institute (EFI)

Any de creació

Àmbits del projecte

Lloc web

holisoils.eu

El web del projecte Holisoils, dedicat a la gestió dels sòls dels boscos europeus, es va desenvolupar seguint la línia de la imatge corporativa que ja tenien establerta. El logotip del projecte, que simbolitza una empremta digital amb línies circulars, va ser una inspiració clau per al disseny visual del web. Vam utilitzar aquestes línies i els perfils de les fulles com a elements gràfics per donar cohesió visual a la pàgina i reforçar la connexió amb la natura i els sòls forestals.

El disseny web segueix un estil minimalista, amb grans blocs de color que es combinen amb imatges visuals potents. Aquests blocs es contraposen a elements gràfics de línies simples, creant un equilibri entre l’impacte visual i la simplicitat, de manera que la informació es presenta de manera clara i atractiva per als usuaris.

Pàgina d'inici web Holisoils
Pàgina interior web Holisoils
Pàgina interior web Holisoils
Pàgina interior web Holisoils

A més, es va desenvolupar una línia d’icones específiques per representar els diferents aspectes del projecte, així com una sèrie de fitxes detallades dels diferents Test Sites (llocs de prova). Aquestes fitxes es van integrar en un mapa interactiu que permetia als usuaris explorar les diferents zones d’estudi, oferint una experiència dinàmica i informativa. També es van incloure caixes d’informació dedicades als Toolkits, eines pràctiques que faciliten la comprensió i aplicació dels coneixements derivats del projecte.

Amb aquest disseny, el web de Holisoils aconsegueix combinar una estètica visual neta i moderna amb una estructura funcional que facilita l’accés a la informació clau sobre la gestió dels sòls forestals europeus, aconseguint així una plataforma útil i atractiva per a tots els seus usuaris.

Informa Forest

Disseny i desenvolupament web del projecte Informa Forest per a la difusió de coneixements sobre la Gestió Forestal Sostenible.

Client

European Forest Institute (EFI)

Any de creació

Àmbits del projecte

El projecte Informa Forest té com a objectiu proporcionar coneixements que permetin desenvolupar pràctiques de Gestió Forestal Sostenible. Per aquest motiu, vam dissenyar i desenvolupar un web que no només fos funcional, sinó també visualment atractiu, alineat amb la seva imatge corporativa.

A partir del logotip original, que consistia en cercles que creixien de forma radial, vam crear una imatge coherent per al web, utilitzant aquests cercles com a elements visuals clau. Aquests cercles es van utilitzar tant per mostrar informació, com fotografies i textos destacats, dins d’un disseny que transmet una sensació d’ingravidesa, com si aquests elements estiguessin flotant. Les ombres de diversos colors i petits punts de color que envoltaven els cercles aportaven dinamisme al disseny, mentre que el fons gris suau ressaltava aquests elements gràfics, creant un contrast elegant i subtil.

pàgina d'inici Informa Forest
pàgina interior Informa Forest
pàgina interior Informa Forest

Per aquest web es van dissenyar una sèrie d’animacions específiques, incloent-hi una infografia interactiva que explicava els objectius generals del projecte. Aquesta infografia seguia un patró de creixement radial, amb la informació que emergia d’un cercle central, representant visualment el creixement i la difusió del coneixement. A més, la pàgina inicial compta amb una animació dinàmica on diversos missatges de text apareixen dins d’un cercle, reforçant la coherència visual del projecte.

Es van dissenyar capçaleres personalitzades per a cada secció de la web, assegurant que cada pàgina tingués una identitat pròpia, però dins del mateix estil visual, mantenint una imatge global harmònica i coherent.