Sistema de navegació i filtratge dinàmic

Projecte: Viatges Guitour

Disseny d´un sistema de navegació dinàmica que permet localitzar ràpidament allotjaments mitjançant filtres dependents i una arquitectura preparada per créixer sense modificar l´aplicació.

|> WordPress · JetEngine · JetSmartFilters · Query Builder · Ajax

Problema

La web havia de permetre localitzar fàcilment un allotjament entre un catàleg cada vegada més gran d’establiments, evitant llargs llistats i reduint el temps necessari per trobar la informació desitjada.

A més, el sistema havia de ser fàcilment ampliable, permetent incorporar nous serveis i informació sense modificar-ne el desenvolupament existent.

L’objectiu no era únicament mostrar resultats, sinó construir una navegació intuïtiva que facilités la cerca tant als visitants com als propis administradors del lloc.

Anàlisi

Un cercador tradicional era insuficient.

Calia dissenyar una estructura que permetés combinar diferents criteris de cerca mantenint una navegació senzilla i oferint resultats immediats.

L’arquitectura havia de contemplar tres aspectes fonamentals:

Organització lògica de la informació.
Filtratge dinàmic entre criteris relacionats.
Escalabilitat per incorporar nous serveis sense necessitat de fer modificacions tècniques.

També era important evitar que l’usuari trobés combinacions sense resultats, guiant la cerca de manera natural conforme anava seleccionant cada criteri.

Solució

Es va desenvolupar un sistema de navegació basat en JetEngine, JetSmartFilters, Query Builder i Listings, utilitzant càrrega dinàmica mitjançant AJAX per actualitzar els resultats sense recarregar la pàgina.

Els filtres es van dissenyar com a dependents, de manera que la selecció d’una província limita automàticament les poblacions disponibles i només mostra els allotjaments corresponents a aquesta selecció.

La navegació permet combinar diferents criteris com:

Província
Població
Categoria de l’allotjament
Serveis disponibles

Per a la gestió de serveis es va crear una Taxonomia personalitzada, permetent associar a cada servei una icona SVG de Font Awesome.

Gràcies a aquesta arquitectura, afegir un nou servei resulta tan senzill com crear un nou terme dins de la taxonomia, assignar-li la seva icona i relacionar-ho amb els allotjaments corresponents, sense necessitat de modificar plantilles ni codi, mantenint una experiència homogènia per a l’usuari.

Abans vs Després

Funcionament inicial del sistema

La cerca s'havia de fer recorrent llistats complets d'allotjaments, dificultant la localització d'un establiment concret quan augmentava el volum d'informació.

Sistema de filtratge dinàmic

Els resultats s'actualitzen dinàmicament conforme l'usuari selecciona cada criteri de cerca, mostrant únicament la informació rellevant. La incorporació de nous serveis es pot fer directament des del panell d'administració, reutilitzant automàticament la mateixa estructura visual i funcional a tota l'aplicació.

Gestió des de WordPress

Un dels objectius principals era evitar solucions específiques per a cada cas.

Per això, tant l’estructura de filtres com el model de taxonomies van ser dissenyats per poder-se reutilitzar en diferents tipus de contingut, mantenint una navegació consistent i simplificant el manteniment futur del projecte.

Aquest enfocament permet que noves categories, serveis o criteris de classificació es puguin incorporar sense alterar l’arquitectura existent.

Valor aportat

Tecnologies

Trobar la informació adequada també forma part del disseny.

També et pot interessar

Capçaleres visuals dinàmiques amb JetEngine

Com convertir una capçalera estàtica en un sistema visual dinàmic i administrable sense modificar les plantilles de la web.

Capçaleres visuals dinàmiques amb JetEngine

Com convertir una capçalera estàtica en un sistema visual dinàmic i administrable sense modificar les plantilles de la web.

Capçaleres visuals dinàmiques amb JetEngine

Com convertir una capçalera estàtica en un sistema visual dinàmic i administrable sense modificar les plantilles de la web.

638 75 58 24

638 75 58 24