Nueva web, mismo oficio: así he diseñado pattdesign.es

Hola, soy Patrick Uribe. Soy diseñador en Granada y llevo mi propio estudio, Patrick Uribe Studio. Nací en Bruselas, el francés es mi lengua materna y, antes de montar el estudio, trabajé en agencias de marketing, donde aprendí que un buen diseño solo sirve si tiene una dirección clara.

Hoy me dedico a tres cosas que, para mí, son una sola: diseño la identidad de una marca, construyo su web en WordPress y reviso su SEO para que Google la entienda y la muestre. También llevo la dirección creativa de Studio Tablas, un taller de mobiliario de madera maciza aquí en Granada.

Este es el primer artículo del blog, y me parecía justo empezar por casa: contarte quién soy y cómo he diseñado la web en la que estás leyendo esto.

↳Por qué una web nueva

La web anterior se había quedado pequeña. Mostraba proyectos, pero no explicaba bien qué ofrezco ni cómo trabajo, y el SEO, que es uno de mis servicios, ni siquiera tenía su propia página. En casa del herrero, cuchillo de palo.

Así que empecé por donde empiezo con cualquier cliente: por la estructura, antes que por el diseño.

↳Primero la arquitectura

Antes de dibujar una sola pantalla, definí qué tenía que hacer cada página. La idea es sencilla:

• Los servicios venden. Branding, diseño web y auditoría SEO tienen cada uno su página, pensada para aparecer en Google.
• Los proyectos demuestran. Cada caso de estudio cuenta el concepto, el boceto y el resultado, y enlaza con el servicio que lo hizo posible.
• La portada reparte. No intenta decirlo todo: presenta el estudio y te lleva a lo que buscas.

El menú pasó de ocho entradas a cuatro y un botón: Proyectos, Servicios, Sobre mí, Blog y «Auditoría gratis».

↳Un universo visual propio

Quería que la web se pareciera a mi forma de trabajar: sobria, precisa y con detalles que se descubren poco a poco. Estas son las decisiones que la sostienen:

• Blanco roto y negro. Sin colores de acento: el color lo ponen los proyectos de los clientes.
• Dos tipografías. Satoshi para leer y Gotham Light para el logotipo y el menú, en mayúsculas espaciadas.
• Diagramas de construcción. Círculos, ejes y puntos, como los que uso al bocetar un logotipo, aparecen en los servicios y en «Sobre mí».
• La flecha ↳. Marca cada sección, como una nota al margen en un cuaderno.
• Movimiento con intención. Una pantalla de carga con porcentaje, un titular que se escribe solo, un botón de cristal líquido y un carrusel 3D con los bocetos del logofolio.

↳Los proyectos, contados de verdad

Cada caso sigue el mismo orden: la portada, el cliente y el tipo de proyecto, el logo concept —el mapa de ideas del que sale la marca— y después el sistema: color, patrón, aplicaciones y, cuando lo hay, vídeo. Puedes verlo en Melipal, Patagonia Punto Sur, Kajob Architecture o Granada Basket.

Y en el logofolio están los bocetos tal cual: trazos, correcciones y construcciones antes de que las marcas fueran marcas.

↳Pensada para el móvil y para Google

Diseñar bonito no basta si la web tarda en cargar o no aparece en las búsquedas. Por eso, mientras la construía:

• El vídeo de la portada tiene una versión vertical para el móvil, y pasó de 16,7 MB a menos de 2,5 MB.
• El menú del móvil es una pantalla completa con todas las secciones, el contacto y las redes a un toque.
• Cada página tiene un título, una descripción y datos estructurados para que Google entienda qué es: un servicio, un caso de estudio o una pregunta frecuente.

Las herramientas

La web está hecha en WordPress con Elementor y bloques de código propios para las partes más especiales. Los bocetos, como siempre, a mano; el diseño, en Illustrator y Figma; y me he apoyado en herramientas de inteligencia artificial para programar algunas piezas, con el criterio y las decisiones de diseño siempre en mis manos.

↳Lo que viene

Este blog va a hablar de lo que hago cada día: cómo nace un logotipo, qué revisa una auditoría SEO, cómo elegir entre una web a medida o una plantilla, y casos reales contados sin filtros. Si tienes una duda sobre tu marca o tu web, escríbeme: puede que la respuesta acabe siendo el próximo artículo.

Gracias por leer hasta aquí. Y si estás pensando en renovar tu marca o tu web, empezamos con una auditoría gratis.