Floasiksen verkkosivujen toteutus Webflow'lla

Floasis – kelluntakeitaan ensimmäinen verkkosivusto

Floasis on oululainen kelluntakeidas, jossa rentoutuskellunta tapahtuu viidessä modernissa kelluntahuoneessa. Erittäin suolapitoinen vesi kannattelee kehoa, ja tunnin ajan asiakkaan ei tarvitse tehdä mitään. Kellunnan jälkeen on vielä Post-Float Lounge, jossa kokemuksen voi antaa laskeutua rauhassa. Floasiksen lupaus on lyhyt: a place to simply be.

Lähtötilanne

Floasis oli uusi yritys, eikä sillä ollut verkkosivuja lainkaan. Koko ensimmäinen kohtaaminen asiakkaan kanssa oli siis vielä rakentamatta: ei paikkaa, josta löytäisi palvelut, hinnat ja ajanvarauksen, eikä alustaa, jolla yritys voisi itse kertoa itsestään. Kellunta on monelle tuntematon palvelu, joten sivuston piti samalla myös selittää, mistä on kyse — ja tehdä se rauhallisesti, ilman myyntipuheen tuntua.

Lahjakortit, jotka ovat hyvinvointialalla merkittävä tulonlähde, myytiin tuolloin käsin. Jokainen tilaus vei henkilökunnalta useita työvaiheita.

Ratkaisu

Suunnittelimme ja toteutimme Floasikselle verkkosivuston Webflow'lla avaimet käteen. Lähdimme liikkeelle siitä, mitä asiakas tulee sivustolta hakemaan: mikä kellunta on, kenelle se sopii, mitä se maksaa ja miten ajan varaa. Sivuston rakenne jäsennettiin näiden kysymysten ympärille, ja vasta sen päälle suunniteltiin ulkoasu.

• Visuaalinen ilme ja designjärjestelmä — värit, typografia ja komponentit, joista sivut koostuvat.
• Sisältöarkkitehtuuri, jossa jokaiselle palvelulle on oma sivunsa: yksilökellunta, parikellunta, kelluntakuuri, kanta-asiakkuus ja yksityistilaisuudet yrityksille.
• Komponenttikirjasto brändin mukaisista elementeistä, jotta sivusto laajenee ja sisältö päivittyy ilman uutta suunnittelukierrosta.
• Ajanvarauspolku, joka kulkee sivuston jokaisesta näkymästä Floasiksen varausjärjestelmään asti.
• CMS-sisältötyypit artikkeleille ja tapahtumille, jotta Floasis julkaisee ne itse.
• Hakukonenäkyvyys, lomakkeet, evästehallinta ja analytiikka osaksi samaa kokonaisuutta.
• Käyttökoulutus, jonka jälkeen Floasiksen tiimi hallitsee sivuston itse.

Designjärjestelmä

Ilme rakennettiin kolmen sävyn varaan: kulta kantaa toiminnot, beige ja vaalea beige antavat sivuille lämpimän pohjan, ja tumma harmaa hoitaa tekstin. Otsikot ladotaan Pratalla, leipäteksti ja käyttöliittymä Poppinsilla — ero serifin ja groteskin välillä tekee sivuista rauhallisen lukea. Värit elävät CSS-muuttujina, joten teema on yhdessä paikassa eikä hajallaan sääntöjen seassa, ja sivut rakentuvat samoista komponenteista.

Sisältö, joka kasvaa itsestään

Sivusto ei jäänyt siihen mihin se julkaistiin. Floasis on sen jälkeen tuottanut itse yli sata artikkelia kellunnasta, stressistä, unesta ja palautumisesta sekä omat sivunsa tapahtumille ja kausikampanjoille — isänpäivälahjoista synttäripaketteihin. Jokainen niistä syntyy samoista komponenteista, joten uusi sivu on julkaisupäätös eikä projekti.

Jatkokehitys: automatisoitu lahjakorttikauppa

Kun sivusto oli ollut käytössä jonkin aikaa, palasimme lahjakortteihin. Rakensimme Floasikselle lahjakorttikaupan, jossa Webflow hoitaa ulkoasun ja Shopify kaupan — headless-integraationa, jolloin kauppa näyttää täsmälleen Floasikselta eikä verkkokauppa-alustalta. Asiakas valitsee paketin, kirjoittaa vastaanottajalle viestin ja määrittää toimituspäivän suoraan ostovaiheessa, ja Shopify hoitaa toimituksen automaattisesti. Lahjapaketointi on lisättävissä samalla.

Floasikselle muutos näkyy siinä, mitä ei enää tarvitse tehdä: manuaaliset työvaiheet poistuivat, tilaukset hallitaan Shopify-adminissa ja tuotteiden järjestystä muutetaan raahaamalla. Kerromme toteutuksesta tarkemmin omassa artikkelissaan.

Tulokset

Floasis sai uutena yrityksenä verkkosivuston, joka kertoo rauhallisesti mistä kellunnassa on kyse ja vie asiakkaan muutamalla klikkauksella varaukseen asti. Lahjakorttien myynti hoituu ilman käsityötä. Sisällöntuotanto, kampanjasivut ja tapahtumat ovat Floasiksen omissa käsissä, ja sivusto on kasvanut muutamasta sivusta sadaksi ilman että ilme olisi hajonnut matkalla.

Tekninen kunto kestää mittauksen myös vuosia julkaisun jälkeen: Googlen Lighthouse antaa Floasiksen etusivulle saavutettavuudesta 95, hakukoneoptimoinnista 100 ja teknisistä parhaista käytännöistä 100 pistettä sadasta (mitattu lokakuussa 2026).