Melas
A site that speaks to two audiences at once, the hotels hiring and the talents looking for work, and that the client’s team can run on its own.
- Client
- Melas
- Collaboration
- Bolk Studio
- Type
- Website
- Role
- Webflow development
- Year
- 2026
- Live site
- melasksa.com ↗
Two audiences, one site.
Melas places hospitality staff across Saudi Arabia. Its site has to win over hotels and restaurants looking for teams, and reach the people who want those jobs.
Bolk Studio designed the site in Figma and asked me to build it in Webflow on their starter kit, for an English-speaking client who would edit everything themselves.
Components first, pages second.
I started with the design tokens: colours, type and spacing derived from the mockup and stored as Webflow variables, so a theme or a breakpoint is changed in one place.
Then the component library, and only then the pages: each page is an assembly of configurable sections, never a one-off tree of divs.
“[A short quote from Bolk Studio or Melas about the result.]”
Everything editable, nothing hard-coded.
Home, For Clients, For Talents, Case Studies, Insights and Contact. Services, values, case studies, articles and job openings all live in the CMS, with templates bound to it.
Animations run from a small JavaScript layer that reads attributes set in Webflow, so the client can move or reuse an animated block without touching code. Tap targets were checked against a 48 px minimum.
What changed.
[How the numbers were measured, and over what period.]
What I’d keep, what I’d change.
[An honest note on trade-offs. This is where the case study earns trust.]