Transformit

Transformit

Creación y diseño web para Transformit, un proyecto del European Forest Institute que tiene como objetivo la conservación de la biodiversidad forestal.

Cliente

European Forest Institute (EFI)

Año de creación

Ámbito del proyecto

Transformit es una iniciativa del European Forest Institute centrada en la gestión forestal sostenible, la preservación de la biodiversidad y la promoción de los servicios ecosistémicos. Su principal objetivo es proteger los bosques europeos mediante enfoques innovadores y colaborativos que fomenten la conservación de la naturaleza.

Nuestra tarea consistía en diseñar una página web que reflejara la relevancia de estos valores y que sirviera como plataforma efectiva para comunicar las acciones y resultados del proyecto.

Nos basamos en la identidad corporativa existente y en la idea central del logotipo, que evocaba la imagen de un vitral, donde varios elementos se entrelazan a través de líneas que conectan y definen las formas. Esta metáfora visual inspiró el concepto de diseño, donde las imágenes de la web se presentan a través de márgenes y formas, imitando el efecto de un vitral. Este planteamiento no sólo es visualmente atractivo, sino que aporta coherencia con la identidad gráfica del proyecto.

La línea gráfica de la web se define por un estilo minimalista, con grandes blogs de color que contrastan con imágenes impactantes, creando un equilibrio entre claridad y modernidad. Los gráficos de líneas simples se integran con estos elementos visuales, reforzando la estética limpia y actual. Este enfoque permite que los principales valores del proyecto, como la sostenibilidad y la conservación de los ecosistemas, sean el foco de atención.

En su conjunto, la web no sólo transmite la importancia de la conservación forestal, sino que también se convierte en una herramienta de comunicación eficaz para los esfuerzos del proyecto Transformit.

Pàgina inici web Transformit
Pàgina interior web Transformit
Pàgina interior web Transformit

Además, para la página de inicio creamos una animación en la que diferentes elementos gráficos se desplazan, reforzando la idea de movimiento y transformación en la gestión forestal. Esta animación no sólo aporta dinamismo al sitio, sino que también captura el espíritu innovador del proyecto Transformit.

También integramos un mapa dinámico que muestra las diferentes zonas de los “Living Labs”, áreas específicas en las que se llevan a cabo acciones concretas para la conservación de la biodiversidad y el desarrollo de prácticas forestales sostenibles. Este mapa permite a los usuarios interactuar con las distintas regiones y obtener información detallada sobre los trabajos que se realizan en cada una.

El resultado final fue un sitio web que combina una experiencia visual atractiva con una navegación intuitiva, facilitando la difusión de los esfuerzos del proyecto Transformit.

Wildcard Project

Wildcard Project

Creación y diseño web para Wilcard Project, una iniciativa del European Forest Institute enfocada en la autorrecuperación de ecosistemas degradados y dañados.

Cliente

European Forest Institute (EFI)

Año de creación

Wilcard Project es un proyecto del European Forest Institute que se centra en la regeneración natural de ecosistemas afectados, promoviendo la restauración de la biodiversidad y el equilibrio de los entornos forestales. El diseño del sitio web debía transmitir esta visión de renovación y conexión con el medio ambiente, manteniendo una coherencia con la identidad corporativa del proyecto.

Desde el inicio del proyecto, optamos por un enfoque visual que evocaba los ecosistemas forestales mediante el uso de un collage que simbolizaba la diversidad y complejidad de los bosques. Para materializar este concepto, seleccionamos cuidadosamente una combinación de fotografías, texturas y formas de color que representaban la riqueza de los paisajes naturales. Estos elementos gráficos se utilizaron de forma consistente en toda la web, creando una estética visual dinámica y coherente que reflejaba la esencia del proyecto.

Los colores corporativos de Wilcard Project sirvieron como base para el diseño, aunque tuvimos libertad creativa para desarrollar elementos gráficos adicionales. Esta libertad nos permitió explorar combinaciones atrevidas de texturas y colores, reforzando el carácter único del proyecto. de la naturaleza, junto con formas orgánicas y tonos terrosos, se integraron para dar vida al concepto de regeneración y crecimiento natural.

Uno de los recursos destacados del sitio web fue la integración de vídeos como fondos visuales, delimitados por trazos de color que actuaban como marcos. Esto aportó dinamismo a la experiencia del usuario, haciendo la página más inmersiva y resaltando los elementos visuales clave del proyecto. Los vídeos mostraban de forma viva el ecosistema en proceso de regeneración, alineándose perfectamente con la misión del Wilcard Project.

Wildcard Project pàgina inici
Wildcard Project pàgina interior
Wildcard Project pàgina interior

Otro aspecto distintivo del diseño fue el uso de collages e infografías, que permitieron comunicar visualmente los conceptos clave sobre la restauración de ecosistemas. Para garantizar la coherencia visual, unificamos los collages con colores consistentes, formas redondeadas y líneas suaves. Esta combinación ayudó a mantener una armonía visual a lo largo del sitio web, creando una experiencia gráfica atractiva y fluida para los usuarios.

El resultado final es una página web que combina creatividad, funcionalidad y una fuerte identidad visual, ofreciendo una plataforma que no sólo comunica la misión del Wilcard Project, sino que también inspira a los visitantes a comprender la importancia de la regeneración de ecosistemas dañados.

Verificat

Verificat

Diseño y programación de la web de Verificat, un diario online especializado en la verificación de noticias.

Cliente

Associació Verificat

Año de creación

Ámbitos del proyecto

Sitio web

verificat.cat

Verificat es un medio digital dedicado a la verificación de noticias, aspecto crucial en la era de la información, donde la proliferación de noticias falsas y la desinformación exigen un trabajo riguroso y especializado. El objetivo del proyecto era modernizar su plataforma online para mejorar su usabilidad, adaptabilidad y destacar más eficazmente su tarea en el ámbito de la verificación de la información.

El proyecto se desarrolló en dos fases diferenciadas:

En la primera fase, nos centramos en la migración completa del sitio web. Verificat contaba con una web creada con Expression Engine, y el principal reto fue transferir toda la información y estructura al sistema WordPress. Este proceso incluyó la exportación de todos los artículos, asegurándonos que cada uno mantuviera sus categorías originales para preservar la organización del contenido. Además, se crearon nuevas plantillas adaptadas para las distintas tipologías de páginas.

Una vez que la web fue importada a WordPress, pasamos a la segunda fase, que consistía en implementar el nuevo diseño. El objetivo era optimizar la estructura de navegación y reorganizar su contenido para mejorar la experiencia del usuario. Se creó un nuevo árbol de contenidos que permitía una navegación más fluida y destacaba claramente el trabajo de Verificat. La nueva estructura no sólo facilitaba la búsqueda de información, sino que también ponía énfasis en las áreas clave de Verificat.

Web Verificat pàgina inici
Web Verificat pàgina interior
Web Verificat pàgina de notícia
Web Verificat pàgina de l'equip

Por lo que respecta al diseño, respetamos la imagen corporativa básica existente, pero introdujimos mejoras significativas en términos de usabilidad y adaptación al formato digital. Una de las principales modificaciones fue el cambio de tipografía, escogiendo una más adecuada para el entorno web, lo que mejoró tanto la legibilidad como la estética general del sitio. El diseño siguió una línea simple y funcional, alineada con los valores de claridad y precisión que definen a Verificat. Se priorizó una estructura limpia, que permitiera una rápida identificación de las secciones de contenido y facilitara el acceso a los artículos verificados.

Para la maquetación, utilizamos Gutenberg, el editor visual nativo de WordPress, lo que permitió la creación de un sistema modular flexible. Desarrollamos varios módulos reutilizables para las distintas páginas, con el objetivo de facilitar al equipo de Verificat la creación de nuevas páginas y secciones en el futuro, sin necesidad de asistencia técnica externa. Este enfoque modular les proporciona una mayor autonomía para gestionar y actualizar el contenido a medida que su trabajo evoluciona.

El resultado final fue una página web moderna, intuitiva y fácil de gestionar, que no sólo mejoró la presentación de la información, sino que también reforzó la identidad y misión de Verificat como referente en la verificación de noticias.

Santacreu Design

Santacreu Design

Diseño y creación de la web para el estudio de interiorismo barcelonés Santacreu Design.

Cliente

Santacreu Design

Año de creación

Ámbitos del proyecto

Santacreu Design es un estudio de interiorismo con sede en Barcelona, ​​reconocido por su enfoque en la creación de espacios elegantes y funcionales para clínicas dentales, ópticas y oficinas. La primera versión de su página web la desarrollamos en 2015, y aunque en ese momento cumplía las expectativas, especialmente en términos de diseño y SEO, con el tiempo surgió la necesidad de una actualización para adaptarse a un formato más moderno y funcional. El objetivo del nuevo diseño era aprovechar las ventajas técnicas de WordPress, utilizando el editor Gutenberg, al tiempo que se alineaba la estética de la web con la nueva identidad corporativa del estudio.

Con el cambio de identidad de marca, el diseño de la web debía reflejar una imagen renovada, con un estilo más contemporáneo. Se eligió una nueva paleta de colores, inspirada en tonos pardos, para aportar una sensación cálida y sofisticada que se ajustaba al espíritu de los proyectos de Santacreu Design. En cuanto al estilo visual, optamos por un enfoque minimalista, con fotografías de los proyectos organizadas en estructuras de columnas, dando mayor protagonismo a las imágenes y permitiendo que los detalles del trabajo del estudio fueran los principales elementos visuales.

La actualización de la web también incluyó una nueva presentación de los proyectos del estudio. Se aumentó el tamaño de las imágenes, mejorando tanto su calidad como su impacto visual, lo que permitió a los visitantes apreciar mejor los detalles y acabados de los proyectos de interiorismo, reforzando la percepción de calidad y profesionalidad que caracteriza a Santacreu Design .

Web Santacreu Design pàgina inici
Web Santacreu Design pàgina interior
Web Santacreu Design pàgina interior

Otra mejora clave fue la optimización del sistema de búsqueda de proyectos. Se reestructuró la manera de organizar los proyectos, agrupándolos por categorías para realizar la navegación más intuitiva y accesible. que les interesaban, al tiempo que brindaba al cliente una herramienta eficaz para mostrar su cartera de manera clara y categorizada, mejorando la usabilidad general del sitio.

En conjunto, el nuevo diseño de la web de Santacreu Design no sólo logró una actualización visual coherente con la nueva identidad de la marca, sino que también mejoró significativamente la experiencia de usuario y la funcionalidad del sitio.

ICC Spain

ICC Spain

Diseño y desarrollo de la página web de la Cámara de Comercio Internacional ICC España.

Cliente

Comité Español Cámara de Comercio Internacional

Año de creación

Ámbitos del proyecto

Sitio web

iccspain.org

El proyecto para la Cámara de Comercio Internacional ICC España implicaba la creación de una plataforma web moderna y funcional, que reflejara la importancia y el prestigio de la institución. La Cámara de Comercio Internacional es una red global, y la versión española necesitaba una página que no sólo cumpliera con sus estándares corporativos internacionales, sino que también ofreciera funcionalidades específicas para sus usuarios, como sistemas de búsqueda avanzada, una tienda online y una zona privada.

En el proceso de diseño y creación de la nueva web, planteamos desde el principio tanto el diseño visual como la estructura de los contenidos, asegurando una navegación clara y organizada. El objetivo era que la página web sirviera como una herramienta de trabajo para los usuarios y miembros de la Cámara, facilitando el acceso a la información, la compra de recursos y la gestión del perfil de usuario.

Por el diseño de la web nos basamos en la imagen corporativa de ICC España, siguiendo las pautas de colores y formatos utilizados en otras webs internacionales de las Cámaras de Comercio. Sin embargo, no nos limitamos a replicar estos elementos, sino que los adaptamos y enriquecemos. Uno de los elementos distintivos fue el uso de las líneas en arco del logotipo de ICC España como base para desarrollar varios blogs de la web. Estas líneas se integraron de forma creativa en la composición de la página, aportando dinamismo y coherencia visual. Además, incorporamos imágenes combinadas con blogs de contenido, lo que ayudó a estructurar la información de forma clara y 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 las principales características de la web es el sistema de búsqueda avanzada, que permite a los usuarios realizar consultas sobre diversas temáticas relacionadas con el comercio internacional y los servicios que ofrece la Cámara. Este sistema facilita la navegación y el acceso a información relevante, mejorando. la experiencia de usuario.

Además, desarrollamos una tienda online integrada en la web, donde se pueden comprar libros y otros recursos relacionados con el comercio y la normativa internacional. La tienda dispone de un catálogo fácilmente navegable, lo que permite a los usuarios encontrar y adquirir los productos de forma rápida y sencilla.

La web también cuenta con una zona privada para usuarios, en la que los miembros pueden registrarse, gestionar su perfil y acceder a contenido exclusivo. Esta área privada se diseñó con un especial enfoque en la seguridad y facilidad de uso, garantizando que los usuarios pudieran navegar sin complicaciones y realizar gestiones de manera autónoma.

Por último, se incluye un apartado de eventos, donde los usuarios pueden consultar información sobre seminarios, conferencias y otras actividades organizadas por la Cámara de Comercio. Este apartado cuenta con un sistema de filtrado que permite buscar eventos según temáticas, fechas u otros criterios, mejorando así la accesibilidad y organización de la información.

En conjunto, el diseño y desarrollo de la web de la Cámara de Comercio Internacional ICC España proporcionó una plataforma moderna, funcional y alineada con los estándares internacionales, ofreciendo a la vez herramientas avanzadas para mejorar la experiencia de los usuarios y facilitar sus interacciones con la institución.

Flors Lloveras

Flors Lloveras

Creación de la web con tienda online para la floristería barcelonesa Flors Lloveras.

Cliente

Flors Lloveras

Año de creación

Sitio web

florslloveras.com

Flors Lloveras es una floristería con una larga tradición en Barcelona, ​​conocida por la atención al detalle y la calidad de sus composiciones florales. El objetivo del proyecto era crear una nueva página web que reflejara el estilo único de la floristería y, a la vez, integrar la tienda online ya existente, mejorando tanto su funcionalidad como su apariencia. experiencia de usuario intuitiva y eficiente.

Uno de los elementos clave del diseño fue la incorporación de una serie de dibujos a lápices de detalles florales, que actuaban como hilo conductor a lo largo de todas las páginas de la web. Estos dibujos, que evocaban la delicadeza y naturalidad de las flores, funcionaban como elementos decorativos y unificadores del diseño, aportando una identidad visual coherente y distintiva. Junto a estos dibujos, se crearon collages con fotos cuidadosamente seleccionadas, que capturaban la esencia del trabajo artesanal de Flores Lloveras. Estas imágenes no sólo mostraban sus productos, sino que también transmitían el ambiente y la dedicación de la floristería, conectando emocionalmente con los usuarios.

En cuanto a los colores, se adaptó la paleta corporativa de la floristería, manteniendo una coherencia visual que respetara su identidad de marca. Se combinaron tonos suaves y naturales para crear un diseño armónico y elegante, en sintonía con el estilo de Flors Lloveras.

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

El proyecto presentaba un reto particular: la floristería ya contaba con una tienda online que los propietarios querían mantener. Nuestra labor consistió en adaptar la tienda al nuevo diseño, garantizando que el cambio estético no afectara ni al funcionamiento ni a la experiencia del usuario. Además, realizamos una revisión global del funcionamiento del eCommerce para asegurar que estuviera actualizada y funcionando de forma óptima, tanto en términos de rendimiento técnico como de usabilidad.

El resultado fue una página web que combina un diseño elegante y emotivo con una tienda online completamente funcional. Esta solución permitió a Flors Lloveras mantener su presencia digital actualizada, ofreciendo a sus clientes una plataforma atractiva y fácil de usar para la compra de sus productos. La combinación de elementos gráficos, fotografías cuidadas y una estructura intuitiva de la tienda destacó el trabajo artesanal y la dedicación de esta floristería.

Bioregions

Bioregions

Diseño y desarrollo web de Bioregions: bioeconomía circular en los bosques europeos.

Cliente

European Forest Institute (EFI)

Año de creación

Ámbitos del proyecto

Sitio web

bioregions.efi.int

El proyecto Bioregions promueve la bioeconomía circular en los bosques europeos, con un enfoque innovador para la gestión sostenible de los recursos forestales. La web original del cliente ya estaba desarrollada con WordPress, pero presentaba problemas de organización del contenido y de presentación de la información según sus deseos. Por esta razón, se decidió rehacer completamente el sitio web, manteniendo WordPress como base, pero utilizando el editor Gutenberg, que permite una mayor autonomía en la gestión de contenidos por parte del cliente.

El nuevo diseño fue una oportunidad perfecta para crear una imagen fresca y mejor alineada con los valores del proyecto. Nos inspiramos en el logotipo de Bioregions, donde se representa una hoja con líneas y puntos redondeados en los vértices. Estas formas se convirtieron en el eje visual del nuevo diseño, con líneas finas que crecían y ramificaban, generando elementos decorativos como hojas y puntos. Estas figuras se integraron armónicamente a lo largo de las páginas, aportando dinamismo y creando una identidad visual coherente con la temática de la bioeconomía y sostenibilidad.

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

El diseño no se limitó sólo a la estética, sino que también mejoró la funcionalidad de la web. Los elementos gráficos se combinaron cuidadosamente con las imágenes y los textos, creando composiciones visuales que destacaban por su elegancia y la capacidad de transmitir los mensajes clave del proyecto. Cada página adquirió una identidad propia pero manteniendo una coherencia visual que reflejaba los objetivos y valores de Bioregions.

Este enfoque permitió crear un sitio web no sólo atractivo visualmente, sino también mucho más funcional y fácil de manejar para el cliente, mejorando significativamente la experiencia de usuario y la presentación de los contenidos.

MARQuitectura

MARQuitectura

Diseño y desarrollo de la nueva web del estudio barcelonés de arquitectura sostenible MARQuitectura.

Cliente

MARQuitectura

Año de creación

MARQuitectura es un estudio de arquitectura con sede en Barcelona, ​​especializado en proyectos de arquitectura sostenible, comprometido con la eficiencia energética y el uso responsable de los recursos. Pese a su sólida trayectoria en el sector, el estudio necesitaba renovar su página web, que había quedado obsoleta tanto en diseño como funcionalidad.

La antigua web no reflejaba adecuadamente la calidad y la visión de MARQuitectura. La navegación era confusa, puesto que los contenidos estaban separados entre la página principal y un blog externo, lo que complicaba la experiencia de usuario y no transmitía una identidad visual coherente.

El proyecto se centró en el diseño integral del sitio web, poniendo énfasis en destacar visualmente los proyectos del estudio con un enfoque limpio y moderno. Se apostó por dar protagonismo a imágenes de gran formato, aprovechando la galería fotográfica de alta calidad de los proyectos destacados de MARQuitectura. Estas imágenes se combinaron con elementos visuales sobrios, como cajas de colores neutros, que armonizaban con la paleta corporativa del estudio, respetando siempre su identidad visual.

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

Además del desarrollo web, el proyecto incluyó el rediseño del logotipo. Basándose en el concepto original, se hicieron ajustes para modernizarlo y darle un aspecto más suave y accesible. redondeadas y más amigables, mientras que la tipografía se actualizó para reflejar una imagen contemporánea y profesional.

Esta nueva web no sólo mejoró el aspecto visual de la marca, sino que también simplificó la navegación y reforzó la coherencia de la identidad de MARQuitectura.

Logo Marquitectura

Tuber Label

Tuber Label

Desarrollo y diseño de la página web de Tuber Label para la implementación de herramientas para el sector trufero.

Cliente

Jasten Fröjen

Año de creación

Ámbitos del proyecto

Sitio web

tuberlabel.es

El proyecto de Tuber Label tuvo como objetivo desarrollar una página web que representara la implementación de herramientas tecnológicas para el sector trufero en España. Ya contábamos con la imagen corporativa y el logotipo proporcionados por la agencia Jasten Fröjen. Este logo incluía una trama que simulaba las formas laberínticas de las trufas, y decidimos expandir esta idea en el diseño visual de la web. Inspirándonos en estas formas, creamos una serie de figuras relacionadas con el mundo de la trufa, que aportaron una identidad visual coherente y única al proyecto.

Para el diseño de la web, mantuvimos los colores corporativos establecidos con el negro como color de fondo principal. Este fondo oscuro permitió que la trama y las figuras destacaran de forma elegante y llamativa. El uso del negro no sólo aportó un toque de sofisticación, sino que también reforzó la conexión visual con las formas orgánicas de las trufas, creando una estética sólida y coherente con la marca.

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

Las figuras diseñadas, basadas en la trama del logotipo, se utilizaron de forma estratégica en las cabeceras de la web, integrándose de forma natural en el diseño general. Estas figuras, que incluían elementos como un perro trufero, una pala y referencias a la comida gourmet, reforzaron la conexión visual con el mundo de la trufa, asegurando que la web reflejara claramente la especialización del sector.

Este enfoque visual, combinado con una estructura funcional, logró transmitir la esencia del negocio de Tuber Label, así como su conexión con la naturaleza y el trabajo artesanal en torno a la trufa. La combinación de un diseño esmerado y el uso estratégico de elementos visuales hizo que la web fuera no sólo informativa y funcional, sino también altamente representativa de la identidad del proyecto.

Eufore

Eufore

Creación de la página web para The European Forest Research and Innovation Ecosystem.

Cliente

European Forest Institute (EFI)

Año de creación

Ámbitos del proyecto

Sitio web

eufore.eu

El proyecto Eufore (The European Forest Research and Innovation Ecosystem) tiene como objetivo crear un entorno sostenible, transnacional y cocreativo para definir, implementar y evaluar una hoja de ruta de investigación e innovación (I+i) centrada en las cadenas de valor forestal en Europa. El desafío era diseñar una página web que no sólo reflejara estos objetivos, sino que también transmitiera visualmente la conexión entre la investigación, la innovación y la sostenibilidad en el ámbito forestal europeo.

El diseño de la web partió del logo existente del proyecto, que presentaba un patrón de árboles repetidos con un degradado de colores que iba del naranja al azul, pasando por tonos de amarillo y verde. Estos colores y patrones se convirtieron en la base del desarrollo visual del sitio. Se utilizaron las figuras del logotipo de forma creativa, integrando imágenes de bosques como fondo, lo que reforzó la conexión visual con la temática forestal.

Además, creamos dibujos con líneas que representaban a personas y entornos, simbolizando la interacción entre los seres humanos y los ecosistemas. Estos dibujos pusieron de manifiesto el enfoque cocreativo y colaborativo del proyecto, añadiendo una capa de significado visual que complementaba la temática de sostenibilidad e innovación en los bosques europeos.

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

Los patrones con fotos y líneas se utilizaron de forma estratégica en las cabeceras de la web, dando a cada sección una identidad única pero cohesiva. También se incorporaron a las infografías y gráficos a lo largo del sitio, reforzando la identidad visual de Eufore y facilitando la presentación de información técnica de forma clara y atractiva.

Gracias a este diseño, la página web no sólo se convirtió en una plataforma informativa sobre los objetivos de investigación y desarrollo del proyecto, sino también en una herramienta visualmente atractiva que conectaba a los usuarios con la esencia de los ecosistemas forestales europeos y los esfuerzos por preservarlos e innovar en su gestión.