CLUW Consulting är konsultverksamheten för Caroline Uthawong, med specialisering inom bröllopsplanering, eventkoordinering och restaurangutveckling. Verksamheten bygger på lång branscherfarenhet, personligt engagemang och en tydlig ambition att hjälpa kunder från idé till genomförande – oavsett om det handlar om en bröllopsfest, ett företagsevent eller en restaurang i förändring.
Trots en etablerad verksamhet saknade CLUW en digital närvaro som speglade den professionalism och omsorg som präglar Carolines arbete. Uppdraget var att bygga en komplett webbplats från grunden – visuellt, tekniskt och innehållsmässigt – som fungerar både som ett förtroendeingivande skyltfönster och ett praktiskt verktyg för att ta emot förfrågningar.
Visuell identitet och formspråk
Designarbetet utgick från att skapa ett uttryck som känns personligt men professionellt, med en varm och avskalad estetik. Färgpaletten byggdes kring djupa gröna toner – en mörkgrön grundfärg (#2d5746), en ljusare accentnyans och en separat footerton – definierade som CSS custom properties för konsekvent användning genom hela temat. Bakgrunden hölls ljus och neutral för att ge innehållet utrymme att andas.
Typografin bär en central roll i uttrycket. Clash Grotesk, ett variabelt sans-serif-snitt, används genomgående för brödtext, rubriker och navigering. Den ger en modern, ren känsla med kontrollerad viktvariation. För Carolines efternamn i herosektionen används Holland, ett handskrivet seriff-typsnitt som tillför personlighet och elegans – ett medvetet kontrasterande val som knyter an till bröllops- och eventvärldens känsla.
Layouten är generös med stora bilder, tydliga hierarkier och ett avskalat formspråk som prioriterar innehållet framför dekoration.
Interaktivitet och rörelse
Sidan präglas av genomtänkt rörelse som förstärker upplevelsen utan att distrahera. Herosektionen möter besökaren med en animerad inzoomning av porträttbilden och en mjuk uppåtglidning av texten, skapade med CSS-keyframes och fördröjda animationer.
Navigeringen har dubbla beteenden: vid sidans topp visas den som en fullbredd meny med hover-aktiverade förhandsbilder av respektive tjänst, och vid scroll övergår den till en kompakt sticky-header. Tjänstesektionerna animeras in med GSAP och ScrollTrigger i takt med att besökaren scrollar, och bilderna har en subtil parallaxeffekt driven av requestAnimationFrame och CSS custom properties.
På bröllopssidan presenteras tidigare uppdrag i ett horisontellt oändligt scrollande galleri byggt med GSAPs horizontalLoop-teknik, komplett med drag-stöd och automatisk rörelse. Ett expanderbart accordion-system beskriver tjänsternas olika delar. En custom-byggd lightbox med tangentbordsnavigering och svepstöd hanterar bildvisning genom hela sajten.
Ett roterande Instagram-element med scroll-styrd CSS-rotation följer besökaren och skapar en lekfull detalj i en annars stram design.
Mobilanpassning
Den responsiva implementeringen hanterar tre distinkta breakpoints med anpassade layouter, typografistorlekar och interaktionsmönster. Mobilmenyn är en fullskärmsöverläggning med touch-optimerade ytor (minst 44x44px) och dynamisk färganpassning beroende på scroll-position – vit text mot mörk bild, grön mot ljus bakgrund. Headern döljs vid nedåtscroll och visas vid uppåtscroll, implementerat med scroll-riktningsdetektering och CSS-transitions. Alla rörelser respekterar prefers-reduced-motion.
Kontaktformulär och infrastruktur
Kontaktformulären integrerades via Contact Form 7 med anpassad CSS-styling för att smälta in sömlöst i temat. Formulären finns på samtliga fyra huvudsidor. E-postleveransen konfigurerades med WP Mail SMTP via one.com:s SMTP-server för tillförlitlig leverans från den delade hostingmiljön.
WordPress-temat byggdes som ett custom theme med egna sidmallar för varje tjänsteområde, custom post types för bröllop, event och restauranger med tillhörande metadata, samt en dedikerad gallerisida.
Resultat
Projektet resulterade i en webbplats som visuellt och tekniskt speglar den kvalitet och omsorg som CLUW Consulting levererar till sina kunder. Designen är personlig men professionell, interaktiviteten förstärker budskapet utan att ta över, och den tekniska grunden är stabil och underhållbar. Från en verksamhet utan webbnärvaro finns nu en komplett plattform som bygger förtroende och tar emot nya kunder.