Eleven Experience

Az Eleven Experience hagyományos értelemben véve nem egy szállodacsoport. Sokkal inkább távoli, mélyen immerzív szállások és expedíciók gyűjteménye – műlegyező horgászat Patagóniában, szörfözés az Azori-szigeteken, síelés a Dolomitokban, szafari Botswanában –, ahol mindegyik egy teljes körűen vezetett, teljes személyzettel ellátott élményt kínál a luxus kalandturizmus legvégső határain. Az ajánlat egyedülálló, a helyszínek rendkívüliek, és a mindennek a kommunikálásához szükséges fotómennyiség – finoman szólva is – kíméletlen. Az Eleven Experience weboldalának felépítése egy olyan probléma megoldását jelentette, amellyel a legtöbb vendéglátóipari fejlesztés nem találkozik ilyen léptékben: hogyan lehet létrehozni egy olyan platformot, amely elbírja egyetlen oldalon száz kép vizuális súlyát, átadja a négy kontinensen elterülő helyszínek szellemét és karakterét, és mégis elég gyorsan betöltődik ahhoz, hogy a 20 000 fontos utazást tervező látogató ne egy töltésjelzőt (progress spinner) bámuljon, amíg kialakul az első benyomása? A válasz egy olyan architektúra volt, amelyet az alapoktól kezdve ezen korlát köré építettünk – ahol a teljesítményt nem utólag optimalizáltuk, hanem az első technikai döntéstől kezdve a "performance-first" (teljesítményközpontú) elv vezérelt minket.

Közösen fejlesztve a Matter Of Formmal

Az Eleven Experience a Matter Of Formmal való partnerségünkön keresztül érkezett hozzánk, akik a kreatív és stratégiai irányt vezették. A felelősségi körök megosztása pontosan az, ami a legjobban működik ebben a partnerségben: a Matter Of Form hozta a luxus utazási piac mély ismeretét, a tervezési irányt, amely megragadta az Eleven márkáját meghatározó feszültséget a vad kaland és a kifinomult kényelem között, valamint a bizalomra épülő ügyfélkapcsolatot. Mi pedig a mérnöki architektúrát, a teljesítményt biztosító infrastruktúrát és a fejlesztési kivitelezést adtuk. Mire egy projekt a Matter Of Formtól eljut hozzánk, a kreatív döntések már megszülettek, a mi dolgunk pedig az, hogy ezeket kompromisszumok nélkül megvalósítsuk. Ez azt jelenti, hogy nincsenek "ezt technikailag nem tudjuk megcsinálni" típusú beszélgetések, amelyek a dizájn felhígulásához vezetnének. Azt jelenti, hogy megtaláljuk a technikai utat a tervezett élményhez – még akkor is, ha a tervezett élmény egy olyan oldalt jelent, amely arra kéri a böngészőt, hogy több képet kezeljen, mint amennyit a legtöbb weboldal a maga teljességében kiszolgál.

A technológiai stack: React, Umbraco 13, Cloudflare Workers

Az Eleven Experience technológiai döntéseit a fejlesztés specifikus követelményei határozták meg, nem pedig a megszokás vagy a kényelem. Az Umbraco 13 mint CMS – egy érett, rugalmas .NET-alapú platform, amelynek tartalommodellezési képességei lehetővé tették számunkra egy olyan modulkönyvtár felépítését, amelyet az Eleven Experience csapata intuitívan tud kezelni anélkül, hogy minden tartalomfrissítéshez fejlesztői beavatkozásra lenne szükség. A frontenden a React biztosítja azt a dinamikus, komponensvezérelt élményt, amelyet a dizájn megkövetelt, anélkül a teljesítménycsökkenés nélkül, amit egy kevésbé strukturált megközelítés okozott volna. A képinfrastruktúra az az elem, ami az egészet működésbe hozza. A Cloudflare Workers az edge-en (a hálózat peremén) végzi a képfeldolgozást – átméretezést, formátumkonverziót AVIF és WebP formátumokra, minőségoptimalizálást és a felhasználóhoz legközelebbi CDN csomópontból történő kézbesítést. Egy kép, amely a CMS-ben a profi fotós által feltöltött teljes felbontású fájlként létezik, minden felhasználó számára pontosan a készülékének és a képernyőjének megfelelő felbontásban, a böngészője által támogatott leghatékonyabb formátumban, egy hozzá földrajzilag közel lévő szerverről töltődik be. A hálózati válaszidő (round-trip) minimális. A fájlméret az eredetinek csak a töredéke. A vizuális minőség pedig megkülönböztethetetlen a forrástól. Ez a folyamat (pipeline) több mint 100 képet tartalmazó oldalakat kezel anélkül a betöltésiidő-romlás nélkül, ami egy ilyen oldalt üzletileg fenntarthatatlanná tenne. A fotográfia maga a termék – ez kommunikálja a szállásokat, a tájat, az élményt –, az infrastruktúra pedig azért van, hogy ezt a munkát elvégezze anélkül, hogy a felhasználót várakozásra kényszerítené.

Egy rugalmas, időtálló modulkönyvtár

Az Eleven Experience egy élő weboldal. Új szállások kerülnek fel. Az évszakok megváltoztatják a fotókat és az elérhetőséget. Expedíciókat adnak hozzá, módosítanak vagy vezetnek ki. A tartalomkezelő csapatnak képesnek kell lennie mindezt egy fejlesztői hibajegy (ticket) nélkül menedzselni – a modulkönyvtárnak pedig elég rugalmasnak kell lennie ahhoz, hogy olyan új tartalomkonfigurációkat is kiszolgáljon, amelyekkel az oldal építésekor még nem számoltunk. Az Umbraco 13-ban épített modulkönyvtárat pontosan ezen követelmény köré terveztük. Minden modul egy önálló, konfigurálható egység: meghatározott bemenetekkel, ésszerű alapértelmezésekkel és elegendő rugalmassággal a tervezési korlátain belül ahhoz, hogy kezelni tudja azt a tartalomtartományt, amelyet reálisan ki kell szolgálnia. A tartalomért felelős csapat a CMS modulkönyvtárából építhet oldalakat anélkül, hogy megtörné a dizájnrendszert – a korlátok a modulokba vannak beépítve, nem pedig egy minden szerkesztést felülvizsgáló fejlesztő kényszeríti ki őket. A "kiválóan karbantartható" itt nem csak egy marketingkifejezés. Azt jelenti, hogy egy oldal, amelyet két évvel az indulás után épít egy olyan tartalomszerkesztő, aki nem vett részt az eredeti fejlesztésben, olyan modulokat használva, amelyek végig élesben futottak, pont olyan jól fog kinézni és teljesíteni, mint az indulás napján épített oldalak.

Navigáció, amely rászolgál az egyértelműségre

Az Eleven Experience portfóliója több kontinensre, több tevékenységi kategóriára, több évszakra és az intim szállodai tartózkodástól a többhetes, teljes körűen vezetett expedíciókig terjedő élménytípusokra terjed ki. Ekkora kínálatban navigálni anélkül, hogy túlterhelnénk a laikus látogatót – aki talán csak annyit tud, hogy valami rendkívülire vágyik –, olyan navigációs architektúrát igényelt, amely gondosan átgondolja, hogyan is működik valójában a felfedezés (discovery) ennél a célközönségnél. A navigációt úgy terveztük, hogy inkább tájékozódási pontokat adjon, semmint felsoroljon. Felszínre hozza az elsődleges belépési pontokat – úti cél, tevékenység, élménytípus szerint –, anélkül, hogy a látogatót a katalógus teljes komplexitásával szembesítené, mielőtt még megvetette volna a lábát. Az információs architektúra azt tükrözi, ahogyan egy hozzáértő utazási tanácsadó irányítana egy beszélgetést: először a tágabb kontextus, majd fokozatosan specifikusabbá válik, ahogy a látogató érdeklődése élesedik.

A szállások bemutatása: Fotográfia, mozgás és a hely szelleme

Minden Eleven Experience ingatlannak teljesen egyedi karaktere van. A dolomitoki és a patagóniai szállás tulajdonosa és filozófiája azonos, de szinte semmi más nem: mások a tájak, mások a fények, más a vadvilág, más a túravezetői kultúra, és mások az okok az utazásra. A weboldalnak ezt az egyediséget kell kommunikálnia minden egyes ingatlannál, ahelyett, hogy a portfóliót egy általános luxus kalandtermékké homogenizálná. A fotókat a maximális hatás érdekében mutatjuk be, gyakran teljes kifutóval (full-bleed) és széltől szélig (edge-to-edge) érő elrendezéssel, amelyek ingatlanonként változnak, hogy tükrözzék annak specifikus karakterét. A mozgás nyelve (motion language) – ahogyan az oldal megérkezik, ahogyan a képek felfedik magukat a görgetés során – úgy van kalibrálva, hogy felidézze az egyes helyszínek tempóját és atmoszféráját. Minden animáció GPU-kompozitált, valós mobileszközökön tesztelt képkockasebességgel (frame-rate) fut, és teljes mértékben tiszteletben tartja a csökkentett mozgást (prefers-reduced-motion) preferáló beállításokat. A kaland szelleme ezen az oldalon nem egy szlogen – jelen van a mérnöki döntésekben. Egy oldal, amely 2,5 másodperc alatt betöltődik annak ellenére, hogy száz kép vizuális súlyát hordozza, egyértelmű jelzést küld: ez egy olyan gépezet, amely minden részletet komolyan vesz. Ez teljesen összhangban van azzal, amit az Eleven Experience ígér a vendégeinek – a logisztika láthatatlanul megoldva, így csak maga az élmény marad.

Teljesítmény nagy léptékben

A több mint 100 képet tartalmazó oldalak a Largest Contentful Paint (LCP) értéket 2,5 másodperc alatt hozzák a közepes sebességű mobilkapcsolatokon. A Cumulative Layout Shift (CLS) gyakorlatilag nulla – a képek mérete már az elrendezésben (layout) meg van határozva a betöltésük előtt, így az oldal nem ugrik meg (reflow) a tartalmak beérkezésekor. Az Interaction to Next Paint (INP) mutató végig reszponzív, még a galériaoldalakon is, ahol a feltáruló (reveal) animációk az eszközök betöltésével párhuzamosan futnak. A Cloudflare Worker képfeldolgozó pipeline az elsődleges oka annak, hogy ezek a számok elérhetőek egy ilyen fotómennyiséggel rendelkező oldalon. Enélkül ugyanez a tartalom egészen más élményt nyújtana. Az infrastruktúrába fektetett energia a látogató számára láthatatlan, mégis alapvető fontosságú a végeredmény szempontjából.

Egy platform, ami az Elevennel együtt növekszik

Az új szállások oldalait a tartalomkezelő csapat a CMS-en keresztül adja hozzá a meglévő modulkönyvtár használatával, és automatikusan öröklik a teljes teljesítmény-infrastruktúrát – a képfeldolgozó folyamatot, a CDN-kézbesítést, a React komponenskönyvtárat. Egy olyan weboldal, amely megadja a tartalomkezelő csapatnak a szabadságot a kezeléshez és a bővítéshez, miközben fenntartja azokat a szabványokat, amelyek az eredeti indulást kivételessé tették, egy olyan eszköz, amelynek értéke idővel egyre csak nő. Az Eleven Experience weboldala pontosan ez. Ezt építettük fel a Matter Of Formmal közösen, és ez az a színvonal, amit minden egyes luxus vendéglátóipari és utazási projektben képviselünk.