Asociación Catalana de Intérpretes de Música Clásica

admin el 15/01/2025

Cliente

Associació Catalana d’Intèrprets de Música Clàssica

Año de creación

2025

Ámbitos del proyecto

Diseño web a medida

Sitio web

acimc.cat

Partimos de un sitio web ya existente que presentaba diversos problemas, muchos derivados de su antigüedad, tanto en criterios de diseño, como de usabilidad y accesibilidad.

El resultado fue un sitio web mucho más usable, accesible y dinámico que permitía difundir las actividades principales de la Asociación: InformeACIMC, ImpulsACIMC, Reintèrprets, Formación y el nuevo pódcast Classificats. Además, la plataforma incorporó un perfil de socio mucho más completo, en el que, como novedad, se podían añadir vídeos, listas de Spotify y una galería de imágenes. También se diseñó una página de inicio bien estructurada, con las noticias más actuales y un acceso directo y rápido a las actividades organizadas, facilitando una navegación transversal a través de una cuidadosa relación de contenidos.

En términos estructurales, el diseño de las páginas se concibió previendo la variabilidad horizontal para adaptarse a cualquier dispositivo y pensando en el responsive, además de permitir una fácil edición de los contenidos por parte de ACIMC, ya que uno de los requisitos del proyecto era gestionar y editar con facilidad la constante producción de noticias y actividades.

Para garantizar una lectura cómoda, con un contraste claro entre encabezados y cuerpo de texto, y al mismo tiempo minimizar el scroll vertical, optamos por una escala tipográfica de 1.125 Major Second, trabajando con textos de 20 px para asegurar una lectura confortable y accesible.

En cuanto a la tipografía, aunque la identidad corporativa original utilizaba la fuente Avenir, optamos por Nunito Sans para el cuerpo del texto y por la tipografía display PP Fragment para los encabezados, consiguiendo así un equilibrio entre elegancia y funcionalidad.

En relación con el cromatismo, la paleta de colores se basó en los tonos del logotipo de ACIMC: decidimos usar el violeta como color principal para los enlaces y botones, aplicando los tonos naranja de manera puntual y complementándolos con tonalidades crudas para garantizar el contraste necesario para una buena accesibilidad.

Con este enfoque, el nuevo sitio web de ACIMC mejoró significativamente la experiencia del usuario y el posicionamiento SEO, convirtiéndose en una herramienta clave para difundir los servicios y proyectos de la asociación, y demostrando un firme compromiso con la innovación y la calidad en su comunicación digital.

Dmente

admin el 06/06/2024

Cliente

Dmente

Año de creación

2024

Ámbito del proyecto

Diseño web a medida Identidad corporativa Ilustración y dibujo

Sitio web

dmenteloc.com

Dmente es una empresa especializada en la búsqueda y gestión de localizaciones para rodajes en producciones de cine, series de televisión y publicidad. Con una amplia experiencia en el sector audiovisual, Dmente se propuso renovar su presencia online para proyectar una imagen más profesional y atractiva ante sus clientes actuales y potenciales.

La página web anterior, creada internamente por la empresa, presentaba importantes deficiencias tanto en el diseño como en la usabilidad, lo que no reflejaba adecuadamente la calidad de su trabajo ni su trayectoria.

El proyecto comenzó con la reestructuración completa del sitio web, diseñando una nueva arquitectura de contenidos que facilitara la navegación y destacara claramente los servicios que ofrece Dmente.

El enfoque principal fue organizar la información de forma que los visitantes pudieran explorar fácilmente los tipos de localizaciones y conocer los proyectos audiovisuales en los que la empresa había participado, como películas, series y campañas publicitarias. Para ello, se creó un árbol de contenidos que dividía los distintos servicios de forma clara y destacaba las imágenes de las localizaciones, acompañadas de información sobre los rodajes en los que habían colaborado.

En cuanto al diseño visual, se optó por un estilo minimalista y elegante, basado en una paleta monocromática en blanco y negro, que ofreciera un marcado contraste, permitiendo que las fotografías de las localizaciones, presentadas en gran formato, fueran las verdaderas protagonistas de la web. El uso de blogs visuales ordenados contribuyó a crear una sensación de orden y profesionalidad, reforzando a la vez el objetivo de presentar Dmente como un actor fiable y experimentado dentro del sector audiovisual.

Por último, se rediseña la icónica imagen de los monos con cámaras, una representación que el cliente ya utilizaba y con la que quería continuar. La nueva ilustración mantuvo la idea original pero con un enfoque más estilizado y adaptado a la estética general de la web. La nueva imagen, a modo de graffiti, para reflejar el dinamismo de Dmente a través de lo que podría ser una localización.

Detall disseny web pàgina interior Dmente

Además del diseño web se abordó la creación del logotipo, puesto que la empresa no contaba con una identidad visual definida.

Siguiendo la estética global del sitio web, desarrollamos una propuesta de logotipo que combinara simplicidad y carácter.

Jugamos con la «D» del nombre, colocándola al principio como único símbolo, eliminando el espacio vacío y resaltando su forma exterior. También ajustamos el espacio entre las letras «D» y «mente» para crear una sensación de equilibrio visual manteniendo una separación uniforme entre todas las letras. Esto dio al logo un aspecto sólido y minimalista.

El diseño del logo no complementaba únicamente el estilo de la web, sino que también reforzaba la identidad visual de la marca.

Transformit

admin el 05/05/2024

Cliente

European Forest Institute (EFI)

Año de creación

2024

Ámbito del proyecto

Diseño web a medida

Sitio web

transformforests.eu

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 bloques 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.

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

admin el 04/04/2024

Cliente

European Forest Institute (EFI)

Año de creación

2024

Ámbitos del proyecto

Diseño web a medida Ilustración y dibujo

Sitio web

wildcard-project.eu

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.

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.

Clínica Dental Oriol Cantó

admin el 12/03/2024

Cliente

Clínica Dental Oriol Cantó

Año de creación

2024

Ámbitos del proyecto

Diseño web a medida

Sitio web

clinicaoriolcanto.com

El proyecto del nuevo sitio web de la Clínica Dental Oriol Cantó se desarrolló partiendo de su identidad corporativa, respetando los elementos gráficos esenciales y adaptándolos a un entorno digital moderno y accesible. El objetivo principal fue crear una experiencia de usuario clara y fluida, con un diseño que transmitiera profesionalidad y cercanía, a la vez que optimizara la legibilidad y la navegabilidad del sitio web.

La estructura del sitio se definió siguiendo los prototipos iniciales, pero durante el proceso de diseño se introdujeron mejoras para optimizar la experiencia de usuario. Se trabajó con una composición ordenada y limpia, donde las formas rectangulares del símbolo del logotipo se trasladaron a varios elementos gráficos, como los botones y las fotografías, reforzando así la coherencia visual y la identidad de la clínica.

Uno de los aspectos clave del proyecto fue la selección tipográfica. La tipografía del logotipo de la clínica es Klavika Basic, una fuente con un carácter fuerte y moderno que se mantuvo para los encabezados. Sin embargo, debido a su menor legibilidad en cuerpos de texto pequeños, se optó por Aktiv Grotesk como tipografía secundaria para los textos del sitio web. Esta elección permitió mejorar la lectura y garantizar una experiencia óptima para todos los usuarios.

Además, se trabajó con un cuerpo de texto central de 24 píxeles, un tamaño superior al estándar, pensado para favorecer la legibilidad y garantizar una accesibilidad óptima. Este detalle fue especialmente relevante, teniendo en cuenta el compromiso de la clínica con la atención a personas con necesidades especiales. Esto permitió asegurar que el sitio web cumpliera con los requisitos de accesibilidad AA.

El cromatismo del sitio web se basó en los colores corporativos de la clínica, manteniendo el azul y el gris oscuro como tonos principales. No obstante, para evitar que el diseño resultara demasiado aséptico o frío, se incorporó una gama de tonalidades más cálidas. Esta combinación no solo añadió variedad y equilibrio al diseño, sino que también reforzó la sensación de cercanía y confort, valores esenciales en el ámbito de la atención sanitaria.

El resultado final fue un sitio web moderno, dinámico y visualmente atractivo, alineado con los valores y la identidad de la Clínica Dental Oriol Cantó. El uso de una estructura clara, una tipografía optimizada y una paleta cromática equilibrada permitió mejorar significativamente la experiencia de usuario y garantizar un acceso fácil e intuitivo a toda la información.

Este proyecto supuso una actualización importante en la presencia digital de la clínica, dotándola de un sitio web funcional y alineado con sus necesidades actuales, manteniendo su esencia y reforzando su imagen de profesionalidad y cercanía.

Verificat

admin el 19/02/2024

Cliente

Associació Verificat

Año de creación

2024

Ámbitos del proyecto

Diseño web a medida Estrategia web Marketing digital y SEO

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.

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

admin el 02/02/2024

Cliente

Santacreu Design

Año de creación

2024

Ámbitos del proyecto

Diseño web a medida

Sitio web

santacreudesign.com

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 .

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.

Hachazuela

admin el 10/12/2023

Cliente

Hachazuela

Año de creación

2023

Ámbitos del proyecto

Diseño web a medida eCommerce Identidad corporativa

Sitio web

hachazuela.com

El proyecto para Hachazuela supuso una renovación integral de su identidad digital, comenzando con un restyling del logotipo y continuando con el diseño de un nuevo ecommerce pensado para mejorar la experiencia del usuario y facilitar el proceso de compra. El objetivo principal fue lograr un equilibrio entre originalidad y funcionalidad, destacando la personalidad del taller sin comprometer la usabilidad del sitio web.

El diseño del sitio web se desarrolló a partir de una paleta de colores cálida y neutra, creando un entorno visual atractivo pero sin distracciones innecesarias. Se priorizó un enfoque claro y limpio, donde la navegación intuitiva y la facilidad de uso fueran elementos clave para mejorar la experiencia de compra.

Para la tipografía del sitio, se seleccionaron dos fuentes que aportan personalidad y legibilidad. Para los encabezados y textos destacados se utilizó Queens Condensed Light, una tipografía display elegante y con gran presencia visual, cuyo formato condensado se adapta perfectamente a la versión móvil. Como complemento para el cuerpo del texto, se eligió Brown Pro, una tipografía de palo seco ligeramente condensada que garantiza una lectura cómoda y fluida tanto en mayúsculas como en minúsculas. El equilibrio entre estas dos fuentes permitió conseguir una jerarquía tipográfica clara y efectiva.

La arquitectura del sitio web se diseñó con una página de inicio de gran impacto visual, que captara la atención del usuario y transmitiera los valores del taller. En el resto del sitio, se priorizó la limpieza, la importancia de los espacios en blanco y una navegación eficiente, garantizando que los productos se encontraran fácilmente y que el proceso de compra se realizara de manera rápida y sin fricciones.

Para el logotipo, se trabajó a partir de la tipografía display Arsenica Variable, adaptando algunas de sus características para lograr una identidad más singular. Las ondulaciones en las barras horizontales, que recuerdan sutilmente las vetas de la madera, sirvieron como punto de partida para reforzar el vínculo con la artesanía de Hachazuela, diferenciándolo claramente del que se mostraba previamente en la web.

El resultado final fue un ecommerce atractivo, con una fuerte personalidad gráfica y una experiencia de usuario optimizada, convirtiendo el nuevo sitio web de Hachazuela en una plataforma funcional, intuitiva y alineada con la calidad y la artesanía de sus productos.

Fundación iSocial

admin el 26/11/2023

Cliente

Fundación iSocial

Año de creación

2023

Ámbitos del proyecto

Diseño web a medida eCommerce

Sitio web

isocial.cat

El nuevo sitio web de la Fundación iSocial es la culminación de una relación que comenzó en 2018 con el diseño y desarrollo de su primer sitio web, una colaboración que ha ido creciendo y evolucionando para adaptarse a las necesidades cambiantes de la entidad.

Este proceso de actualización ha estado marcado por la expansión de su actividad y la creación de su campus de formación, un espacio pensado para los profesionales y organizaciones de servicios sociales que quieren afrontar de manera creativa e innovadora los retos de transformación del sector. El nuevo sitio web integra este campus con un ecommerce que facilita la inscripción a los cursos de forma ágil y completamente virtual.

Más allá de la actualización visual, el proyecto supuso una mejora significativa en la navegación, el contraste tipográfico y la presentación de la información, con el objetivo de simplificar la interacción del usuario y asegurar un acceso rápido e intuitivo a los recursos y contenidos de la Fundación.

El resultado final es un sitio web moderno y accesible con un ecommerce integrado, alineado con la identidad corporativa de la Fundación iSocial. Un diseño tipográfico claro, una paleta cromática equilibrada y una estructura simplificada permiten una experiencia de usuario óptima y una presentación clara de los servicios formativos, mejorando significativamente la presencia digital de la Fundación y facilitando el acceso a los cursos y recursos de manera rápida y eficiente.

ICC Spain

admin el 23/11/2023

Cliente

Comité Español Cámara de Comercio Internacional

Año de creación

2023

Ámbitos del proyecto

Diseño web a medida eCommerce

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.

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.