On projekteja, jotka ovat pelkkiä teknisiä suorituksia, ja sitten on projekteja, joissa on sielua. Kun saimme Tuonetilla toimeksiannon toteuttaa Meyer Haminan uudet kotisivut, tiesimme heti, että nyt käsissämme on jotain erityistä.
Kuvittele mielessäsi Hamina, tuo ympyräkaupunki täynnä tarinoita. Kuvittele siellä sijaitseva historiallinen kivirakennus, entinen Seurahuone vuodelta 1890. Seinät huokuvat arvokkuutta, mutta sisällä sykkii jotain aivan uutta: Meyer Hamina on trendikäs, nykyaikainen viihde- ja majoituskohde, joka ei pelkää yhdistää rosoista historiaa raikkaaseen nykykulttuuriin.
Haasteemme oli selkeä mutta vaativa: Miten siirtää tämä ainutlaatuinen tunnelma – kiviseinien havina ja moderni syke – digitaaliseen muotoon? Miten rakentaa verkkosivusto, joka on visuaalisesti yhtä pysäyttävä kuin itse rakennus, mutta teknisesti niin ketterä, että se palvelee kiireistä ravintola- ja tapahtumatoimintaa saumattomasti?
Tässä asiakastarinassa avaamme konepellin ja kerromme, kuinka Tuonetti rakensi Meyer Haminan verkkopresenssin alusta loppuun, miksi valitsimme työkaluksi juuri Oxygen Builderin ja kuinka teimme ruokalistojen päivittämisestä asiakkaalle lastenleikkiä.
Lähtökohta: Enemmän kuin pelkkä verkkosivu
Kun asiakas toimii tiloissa, joilla on yli sadan vuoden historia, verkkosivut eivät voi olla "tusinatavaraa". Meyer Hamina edustaa rohkeaa fuusiota vanhan ja uuden välillä. Sivuston piti viestiä tätä samaa: sen tuli olla arvokas, mutta ei pölyttynyt; moderni, mutta ei hengetön.
Meille oli selvää, että valmiit WordPress-teemat joutaisivat tässä projektissa romukoppaan. Tarvitsimme täydellisen vapauden toteuttaa ulkopuolisen graafikon luoma, upea brändiohjeistus pikselintarkasti. Sivuston piti olla uniikki ja komea kokonaisuus, josta sekä asiakas että me tekijöinä voisimme olla aidosti ylpeitä.
Tavoitteet projektille olivat:
- Visuaalinen elämys: Sivuston tuli vastata fyysisen paikan tunnelmaa.
- Helppokäyttöisyys: Henkilökunnan piti pystyä päivittämään sisältöä ilman koodaustaitoja.
- Suorituskyky: Sivuston tuli latautua nopeasti ja toimia moitteettomasti kaikilla laitteilla.
- Skaalautuvuus: Rakenteen tuli mahdollistaa toiminnan laajeneminen tulevaisuudessa.
Tekninen toteutus: Miksi valitsimme Oxygen Builderin?
Monet verkkosivuprojektit kaatuvat kompromisseihin. Käytetään valmista teemaa, joka "melkein" näyttää siltä mitä haluttiin, mutta koodi on raskasta ja muokkaaminen kankeaa. Meyer Haminan kohdalla emme halunneet tehdä kompromisseja.
Sivuston perustaksi valittiin luonnollisesti WordPress, maailman suosituin julkaisujärjestelmä, sen joustavuuden vuoksi. Mutta pelkkä WordPress ei riitä. Jotta saimme ulkoasusta täysin uniikin ja muista erottuvan, Tuonetti valitsi päätyökaluksi Oxygen Builderin.
Miksi Oxygen Builder?
Oxygen ei ole perinteinen "sivunrakentaja" (page builder), joka vain kasaa elementtejä teeman päälle. Se korvaa perinteisen teemajärjestelmän kokonaan, mikä antaa meille kehittäjille täydellisen hallinnan jokaiseen pikseliin ja koodiriviin.
- Visuaalinen vapaus: Oxygenin avulla pystyimme toteuttamaan graafikon visiot ilman rajoitteita.
- Koodin puhtaus: Toisin kuin monet muut rakentajat, Oxygen tuottaa erittäin puhdasta koodia. Tämä näkyy suoraan sivuston latausnopeudessa ja Google-näkyvyydessä.
- Responsiivisuus: Pystyimme hienosäätämään sivuston käyttökokemusta erikseen mobiilille, tabletille ja työpöydälle, varmistaen, että Meyer Haminan tunnelma välittyy laitteesta riippumatta.
Lopputulos on sivusto, joka ei näytä "WordPress-sivulta", vaan räätälöidyltä digitaaliselta kokemukselta.
Ruokalistat ja ACF – Loputonta skaalautuvuutta
Yksi ravintolasivustojen yleisimmistä ongelmista on ruokalistojen päivitys. Usein näemme ratkaisuja, joissa ravintoloitsija joutuu lataamaan sivuille PDF-tiedostoja, joita on vaikea lukea puhelimella, tai muokkaamaan monimutkaisia tekstieditoreja, jolloin ulkoasu hajoaa helposti.
Halusimme Meyer Haminalle jotain parempaa. Ratkaisumme ydin oli ACF (Advanced Custom Fields).
Miten se toimii?
Rakensimme sivuston taustalle räätälöidyn logiikan ruokalistoille (kuten À la carte, Baari Menu ja Lounas). Sen sijaan, että asiakkaan pitäisi huolehtia fonteista, väreistä tai asettelusta, he syöttävät vain datan.
WordPressin hallintapaneelissa on selkeä, Tuonetin luoma valikko. Kun henkilökunta haluaa lisätä uuden annoksen, he vain:
- Kirjoittavat annoksen nimen.
- Lisäävät kuvauksen ja hinnan.
- Valitsevat mahdolliset allergeenit.
- Painavat "Päivitä".
Sivusto hoitaa loput. Se asettelee tekstin automaattisesti oikeaan kohtaan, oikealla fontilla ja tyylillä. Tämä tekee ruokalistoista loputtomasti skaalautuvia. Olipa listalla kolme tai kolmekymmentä tuotetta, sivu näyttää aina ammattimaiselta ja ehjältä. Tämä on valtava etu asiakkaan arjessa – aikaa ei kulu tekniseen säätämiseen, vaan se voidaan käyttää asiakaspalveluun.
Automatiikka lounaslistoille
Helposti päivitettävien ruokalistojen lisäksi loimme täysin räätälöidyn automaation järjestelmän, joka hakee päivittäin uusimman lounaslistan ruokapaikka.fi -sivustolta. Ravintolan päällikkö ei tarvitse kuin päivittää ruokapaikka ja muutokset siirtyvät automaattisesti Meyerin omille sivuille. Ei ylimääräistä hommaa!
Älykäs yhteydenotto Fluent Formsilla
Meyer Hamina on monipuolinen talo: siellä on ravintolaa, majoitusta, tapahtumia ja keikkoja. Tämä tarkoittaa, että yhteydenottoja tulee monista eri aiheista. Jos kaikki viestit menisivät yhteen sähköpostilaatikoon, kaaos olisi valmis.
Ratkaisimme tämän käyttämällä Fluent Formsia, johon ohjelmoimme automatiikkaa viestien välittämiseen.
Kun asiakas täyttää lomakkeen, järjestelmä päättelee valintojen perusteella, kenelle viesti kuuluu.
- Haluatko varata pöydän? Viesti menee ravintolapäällikölle.
- Kysytkö majoituksesta? Viesti ohjautuu hotellivastaavalle.
- Onko kyseessä bändin keikkamyynti? Oikea yhteyshenkilö saa ilmoituksen heti.
Tämä taustalla tapahtuva automaatio tehostaa organisaation toimintaa ja varmistaa, että asiakas saa vastauksen nopeammin oikealta henkilöltä.
Sujuva hotellivarausjärjestelmä MotoPressillä
Koska Meyer Hamina on myös suosittu majoituskohde, verkkosivuston tuli toimia tehokkaana ja luotettavana myyntikanavana huonevarauksille. Emme halunneet ohjata asiakasta heti pois sivustolta, joten toteutimme sivustolle oman varausjärjestelmän hyödyntäen MotoPress Hotel Booking -lisäosaa.
Järjestelmän kriittisin ominaisuus on sen kyky "keskustella" ulkopuolisten palveluiden kanssa. Rakensimme integraation, joka synkronoi varaustilanteen automaattisesti Booking.comin kanssa. Tämä kaksisuuntainen iCal-synkronointi varmistaa, että kun huone varataan jommassakummassa kanavassa, kalenteri päivittyy välittömästi molempiin päihin. Näin vältetään päällekkäiset varaukset ja hotellihenkilökunta voi luottaa siihen, että huonetilanne on aina ajan tasalla ilman manuaalista säätämistä.
Nopeus on valttia – Managed WP Hosting
Hienokaan sivusto ei palvele tarkoitustaan, jos sen lataaminen kestää. Hitaus karkottaa asiakkaat ja laskee hakukonenäkyvyyttä. Siksi Meyer Haminan sivusto ei pyöri missä tahansa webhotellissa, vaan se on ylläpidettynä Tuonetin Managed WP Hosting -alustalla.
Tämä tarkoittaa, että palvelinympäristö on optimoitu nimenomaan WordPressille.
- Välimuistitus: Sivut latautuvat salamannopeasti.
- Tietoturva: Tuonetti huolehtii päivityksistä ja suojauksesta proaktiivisesti.
- Varmuuskopiointi: Tieto on aina turvassa.
Yhdistämällä Oxygen Builderin kevyen koodin ja Tuonetin huippunopean palvelimen, olemme luoneet sivuston, joka on ilo silmälle ja nopea käyttää myös heikommilla mobiiliverkkoyhteyksillä.
Yhteenveto: Viisi syytä onnistumiseen
Meyer Haminan projekti on erinomainen esimerkki siitä, mitä saavutetaan, kun tekninen osaaminen kohtaa vahvan visuaalisen vision. Tässä vielä tiivistettynä viisi tärkeintä faktaa projektista:
- Täydellinen brändin mukautus: Tuonetti toteutti sivut, jotka yhdistävät saumattomasti Meyer Haminan trendikkään nykykulttuurin ja historiallisen arvokkuuden.
- Uniikki ulkoasu: Käytimme päätyökaluna Oxygen Builderia, jotta emme olleet sidottuja valmiiden teemojen rajoituksiin, vaan saimme luotua aidosti erottuvan kokonaisuuden.
- Helpot ruokalistat (ACF): Sivuston ruokalistat on rakennettu Advanced Custom Fields -teknologialla, mikä tekee niistä helposti päivitettäviä ja visuaalisesti ehyitä ilman koodausosaamista.
- Älykäs viestintä: Fluent Forms -integraatio automatisoi viestiliikenteen, ohjaten kyselyt suoraan oikeille vastuuhenkilöille organisaatiossa.
- Huippuluokan suorituskyky: Sivusto on nopea ja turvallinen, kiitos Tuonetin oman Managed WP Hosting -alustan.
Lopuksi
Meyer Haminan verkkosivut ovat nyt valmiit palvelemaan asiakkaita vuosiksi eteenpäin. Ne ovat digitaalinen jatke sille upealle kokemukselle, jonka vierailija kohtaa astuessaan sisään vanhaan Seurahuoneeseen. Meille Tuonetilla tämä projekti oli osoitus siitä, että verkkosivujen ei tarvitse olla vain informaatiokanava – ne voivat olla elämys.
Onko sinun yritykselläsi tarve verkkosivuille, jotka vaativat enemmän kuin valmiin teeman tarjoamaa perusratkaisua? Kaipaatko kumppania, joka ymmärtää sekä koodin päälle että liiketoimintasi tarpeet?
Haluaisitko, että kartoitamme yhdessä, millainen räätälöity verkkosivuratkaisu palvelisi parhaiten juuri sinun liiketoimintaasi? Ota yhteyttä Tuonettiin, niin laitetaan digitaalinen kivijalkasi kuntoon.
