Website Platform Proposal

One Space.
Every Venue.

A proposal to migrate Sonnel Hospitality's 20 venues from WordPress to a single Storyblok implementation — built in phases, designed to go live before October's peak season.

Prepared for
Sonnel Hospitality
Prepared by
Grade
Date
June 2026
Status
Proposal
Confidential

Twenty venues.
One coherent platform behind them all.

What Sonnel needs is a digital platform that allows every venue to operate from the one system, delivering consistency and distinctiveness where it matters. Your Content team can actually self-serve, Analytics can show what's working across all venues at once, and the booking experience doesn't vary.

This isn't just a website upgrade - it's a platform project. The goal is to build one system that makes every venue you manage today — and every venue you open in the future — faster to launch and easier to run.

01

Our Understanding

What You've
Told Us

Sonnel has grown significantly — more venues, more complexity, more demand on digital. The current setup is no longer fit for purpose, this happens. What's needed is a platform that scales with the business, not limits opportunity for growth.

Reservations are the most important metric, and right now there appears no reliable way to attribute a booking to a website visit — let alone compare that performance across venues. Getting that measurement in place, consistently, is one of the most valuable things this project can deliver.

The October peak season is a fixed constraint with footy finals, Melbourne Cup, and more. The flagship sites need to be live before it arrives.

Challenge 01
Platform hasn't scaled with the business
Managing multiple sites without a shared content process or component library creates inconsistency and slows the team down.
Challenge 02
Time for a full platform and partner reset
This is an opportunity to choose a new platform and a new implementation partner together — getting both right at the same time.
Challenge 03
Booking performance is hard to measure
Separate analytics containers per venue make cross-venue reporting difficult and booking attribution unreliable.
Challenge 04
Image delivery adds unnecessary cost
High-res assets on high-traffic sites generate real expense. A proper image service resolves this systematically.
Challenge 05
Editors need more independence
Non-technical team members should be able to update content without needing a developer for routine changes.

We audited the websites of 12 of Sonnel's live venues to help inform this proposal. The findings have helped shape the architectural decisions in the pages that follow. Venue tier classifications below are based on that audit and direction from your team.

3 Flagship
Venues with the most complex requirements — accommodation, functions, live events, and multiple booking types. Each warrants a bespoke build. Includes Crossroads Hotel, Australian Hotel & Brewery, Firehouse Hotel.
Phase 1 priority. Everything established here — components, integrations, design system — flows into every venue that follows.
5 Mid-tier
Venues with a shared structure but venue-level theming and some unique content types. Includes Guildford Hotel, Greenfield Tavern, Hurstville Ritz Hotel, Eastwood Hotel, and Marrickville Tavern.
Phase 2. One template, configured per venue. Faster to launch because the platform is already built.
11 Simple
Venues with standard requirements — menu, events, contact. CSS and logo variation only. Includes Ermington Hotel, Ashfield Hotel, Ambulance Station Hotel, New Victoria Tavern, Royal Sheaf, Rosehill Hotel, Wiley Park Hotel, The Grand Hotel, Yennora on Oasis, Oasis on Beamish and Belmore Hotel.
Phase 3. A single simple template applied in batches. Candidate for partial self-serve handover to your developer.

Current Stack

WordPress Multisite Cloudways Cloudflare CDN 12× GTM NowBookIt PubPass Talk Box
Good news
NowBookIt is already consistent
Single account ID appears in place across all venues. Integration is one build, configured per venue — not 11 separate integrations.
Noted
Cloudways stays under your control
This proposal is not aimed at changing your hosting arrangement. You retain full infrastructure ownership throughout. Note: Grade recommends AWS hosting for this level of Storyblok implementation.
Out of scope
Esker Beer is a separate platform
This site sits as a different stack entirely — not WordPress, with a separate Shopify-style shop. A separate scoping conversation would be needed if it needs to be considered for this project.
02

The Recommended Approach

One Space.
Three Tiers.

All venues managed within a single Storyblok Space — structured by venue folder, governed by role-based access, and built on a shared component library. Two Spaces total: staging and production.

This is how you get consistency without losing the ability to express each venue differently. The component library is built once. Each venue then picks from it — configuring, not rebuilding. Adding a new venue in Year 2 means theming a template, not commissioning a new website.

A single shared Space is the right architecture for a group of this size.

Three Component Layers

Layer 01 — Global
Identical across all venues
Navigation pattern, footer, SEO fields, cookie consent, booking CTA button. Locked to admin — changes propagate everywhere.
Layer 02 — Configurable
Same structure, venue-level content
Hero block, menu section, events, promos, gallery, What's On. Editors configure per venue without touching the schema.
Layer 03 — Venue-specific
Only exists where it's needed
Function space gallery, accommodation booking, kids playland, bottleshop, brewery info. Applied only to venues that have them.

Five Templates

Template B
Mid-Tier
5 venues — Phase 2
One template, configured per venue. Theming via design tokens — logo, colour, fonts. Some unique content types (GAGE Dining, Jean's Chilli Chicken, Bottler).
Template C
Simple
11 venues — Phase 3
Menu, events, contact. CSS and logo variation only. Launched in batches — candidate for partial self-serve handover to your developer.

Every integration is an iframe or widget embed — which means each one is a Storyblok component built once, then configured with venue-specific parameters. No bespoke API work, no per-venue development time.

Booking
Now Book It
Configurable component: accountId, venueId, theme, and colours as fields. Parameters already extracted from the live sites. Build once, configure per venue.
Loyalty
PubPass / Jensen Cloud
iframe embed. Venue-specific parameters (venue=, formId=) set in the component. Same build pattern as Now Book It.
CRM
Talk Box / Impact Data
Email capture form (name + email). Posts to Talk Box embed. Pending Talk Box confirming their embed method — if API-only, scoping to be adjusted.
Live sport
sportsyear.com.au
Generic "embed code" component — any iframe code dropped in as a field. No custom work needed. Shared with any other embed requirements.

Analytics Rationalisation

Consolidating to a single GTM container with venue-level data layer variables is one of the highest-value things we can do in Phase 1 — it makes cross-venue performance comparison and booking attribution possible for the first time.

GTM / GA4
Single container, 20 venues
One GTM container with venue-specific data layer variables, plus GA4 sub-properties per venue. Cross-venue reporting finally becomes possible.

Image Costs

Storyblok Image Service
Automatic optimisation at upload
WebP/AVIF conversion, responsive srcset, focal point management. Replaces your current Cloudflare image layer — editors upload once, the platform handles the rest.
03

Phased Delivery

Built in
Order.

Phase 1
Crossroads · Australian Hotel & Brewery · Firehouse
Mid-June → Late September 2026

Phase 1 doesn't just build three websites — it builds the system every subsequent venue runs on. The component library, design language, integration patterns, and content model are all established here. Phases 2 and 3 are more efficient because of the work done in Phase 1.

Discovery
IA, user journeys, content modelling
Three venue briefs. Information architecture. Component schema defined before any design or build begins — this is the necessary work that makes everything else possible.
UX
Wireframes + Figma oversight
Mobile-first wireframes for all three flagships and shared patterns. Grade provides the wireframes as a starting point; your team refines in Figma. We review for dev-readiness before build begins.
Build
Design system → three flagship builds
Component library first. Then three bespoke front-end builds — Crossroads (most complex), Australian Hotel, Firehouse. All integrations wired in parallel.
Launch
QA, UAT, redirects, cutover
Cross-device QA. UAT with your team. Redirect mapping and DNS cutover coordinated with your developer. Staggered go-live per flagship if needed.

Phase 1 Outputs

Storyblok Space setup Component library 3 × flagship sites live Now Book It integration PubPass integration Talk Box form Unified GTM / GA4 Redirect map Editor documentation

Design work begins in August once your team is available. We use the preceding weeks for discovery, architecture, and wireframes — so nothing is lost waiting for design to start.

Phase 2
Mid-Tier Template · 5 Venues
October 2026

One mid-tier template, applied across five venues. The template defines what carries forward from Phase 1 and what's new — then each venue gets its own theming (logo, colour tokens, typography) and content configuration. Unique content types like GAGE Dining & Co and Jean's Chilli Chicken are modelled as sub-brand variations within the template, not separate builds.

Mid-tier template 5 × venue theming Sub-brand content types Content entry support QA & UAT
Phase 3
Simple Template · ~11 Venues
November – December 2026

One simple template — menu, events, contact. CSS and logo variation only. Launched in batches of three to four venues per wave. Phase 3 is a strong candidate for partial self-serve handover to your internal developer under Grade oversight — it reduces cost and builds your team's capability on the platform.

Simple template 11 × CSS theming Batch QA Developer handover guide
Now → July
Discovery & Architecture
Weeks 1–6
August
Design & Build
Weeks 7–10
September
Flagship Launch
Weeks 11–15
October
Mid-Tier
Phase 2 · 5 venues
Nov – Dec
Simple Batch
Phase 3 · 11 venues
Mid-End-June
Contracts signed · kick-off
Discovery begins immediately. Grade and your team align on scope, priorities, and working model.
June – July
Discovery, IA, wireframes, Storyblok architecture
Component planning and content modelling. Grade works productively ahead of the design phase.
Early Aug
Design phase begins
Grade provides wireframes as input for your team to refine in Figma. Parallel: component library build starts.
Mid-Late Aug
Design sign-off (staggered) · flagship builds
Flagship 1 → 2 → 3. Integrations wired in. Content entry underway.
Late Sep
Flagship QA, UAT, cutover
Staggered go-live. All three flagships live before October peak season.

October brings three finals, Melbourne Cup, and peak season. Late September is the target — and the plan is built around it.

The August design phase is the critical path dependency. Grade's discovery and architecture work in June–July means the moment design begins, build can follow without delay.

04

The Investment

The
Numbers.

Phase / Item Scope Investment (ex GST)
Phase 1 — Flagships + Foundations
Discovery · IA · UX wireframes · Figma oversight · design system · 3 × flagship builds · all integrations · GTM/GA4 · QA · cutover · PM
3 venues live. Full platform established. ~$144,500
Phase 2 — Mid-Tier Template
Template definition · Figma extension · mid-tier build · per-venue theming × 5 · content entry support · QA
5 more venues live. ~$45,900
Phase 3 — Simple Template
Simple template build · CSS theming × 11 · batch QA · PM
Remaining 11 venues live. ~$32,300
Total — all phases (Grade fees, ex GST - includes 15% EOFY Discount) ~$222,700

Grade offers optional post-launch Support & Maintenance and Hosting Management services. These are not included within this proposal but can be discussed at any stage should they become relevant.

What Affects the Range

Variable
Content entry responsibility
If content population falls to Grade rather than your team, Phase 1 and Phase 2 estimates increase materially. To be confirmed before contracts are signed.
Variable
Impact of Sonnel developer
Current estimates have not accounted for contribution from Sonnel developer. Skillset and division of work to be discussed.
Note
All figures in AUD, ex GST
Storyblok platform licensing is quoted separately by Storyblok directly and is not included here. Esker Beer is out of scope — a separate estimate is available on request.

You can approve Phase 1 now and confirm Phases 2 and 3 after the flagships are live. Phase 1 has standalone value. 15% EOFY discount available until 30 June 2026.

Assumptions

Your team (or an internal developer) is responsible for all content population into Storyblok. Grade provides structure, templates, entry guides, and support — not data entry at scale.
A client-side developer is available from kick-off for Cloudways, DNS, and Storyblok configuration tasks under Grade direction.
Mobile first Figma design files are provided or created by your creative manager. Grade provides wireframes as input and reviews files for dev-readiness before build begins.
The creative manager returns by end of July 2026, as indicated. Any later delays to this date affect the Phase 1 timeline.
Now Book It, PubPass, and Talk Box integrations remain iframe or widget embed patterns. Any request for deeper API integration is out of scope and requires separate scoping.
Storyblok platform pricing is confirmed directly with Dawn Henry at Storyblok. They do not form part of this proposal.
The 8 unaudited venues fall within the simple template tier. If any require mid-tier or flagship treatment, estimates adjust accordingly.
Hosting infrastructure for deployment and post launch will be managed by the Sonnel team.

Exclusions

Content migration from WordPress. All content is client-supplied and entered by your team.
Photography, videography, or original graphic design beyond Figma oversight and dev-readiness review.
Copywriting for any venue.
Esker Beer website — separate platform, separate scoping required.
CDP or data platform implementation.
POS system integration.
Online ordering or e-commerce functionality.
Multi-language or localisation support.
Third-party event ticketing platform integration.
Any booking engine other than Now Book It.
Accommodation booking engine integration beyond linking to existing systems.
Post launch website support & maintenance not included in project fee. A separate proposal and costs can be supplied on request.
Sydney APAC data centre for Storyblok — available and recommended; priced separately by Storyblok directly.
05

Why Grade

The Risk-
Managed
Choice.

Grade brings team depth, Storyblok experience, and a delivery model built for a project of this scale and timeline. The combination of those three things is what makes the September target achievable.

1
Parallel Workstreams
Hitting late September requires discovery, architecture, design, and build running simultaneously — not sequentially. Grade has the team to do that: project management, UX lead, tech director, and front-end developers working in parallel across workstreams. It's the only way the timeline works.
2
Storyblok Expertise
Grade has been on the Storyblok platform since its startup days, including multi-site architectures at scale. The AVJennings project — a master brand with sub-brands across multiple states — is the closest analogue to what Sonnel needs: one Space, many expressions, shared component library. We've already understood the architecture problems this project presents.
3
Hospitality Experience
Prior work with Seagrass Hospitality Group. We understand how hospitality businesses run — the primacy of the booking flow, the complexity of multi-venue brand management, the needs of editors who aren't developers.

October is a fixed deadline with real revenue on the line. The right partner for this project is one with the team and experience to protect it.

The Team

Project Lead
Justine Marino — Project Management
End-to-end project management, stakeholder coordination, timeline ownership. The project's primary point of contact throughout.
Design
Dan Pacey — Interaction Design Director
IA, user journey mapping, wireframes, Figma oversight. Collaborative by nature — works with Justin's UX instincts rather than against them.
Technology
Adam Robertson — Tech Director
Storyblok architecture, content modelling, Space setup, component schema design. Has handled this level of Storyblok pattern before.
Build
Front-end Developers
Developers deployed as needed for scale. Phase 1 requires concurrent builds — single-developer shops create a bottleneck that this project cannot afford.
Our Work
Visit the Grade website for our story, learn about our team and see more of our work.

Let's get started

Ready to Begin
When You Are.
Key Contact

Reach out directly with questions, next steps, or sign off discussions.

Justine Marino
General Manager & Project Lead, Grade