Jewel Toned Interiors

Bringing the online experience into line with the calibre of the work.

Jewel Toned Interiors had an established reputation and a broad range of expertise. Its website needed to communicate that depth, serve different audiences more effectively and help prospective clients understand when and how to engage the firm.

Challenge

Jewel Toned Interiors work had developed beyond the experience people encountered online.

The practice had completed more than 200 environments and designed over a million square feet of space. Its portfolio demonstrated its capability, but the website needed to explain more of the expertise and process behind the finished work.

Commercial clients and private homeowners also arrived with different questions. The experience needed to help each recognise the relevant part of the practice without fragmenting the brand.

The engagement focused on the website and its communication, bringing them into line with JTI’s calibre, breadth and ambitions.

Agreeing what the website needed to achieve

We worked with the team to establish the role of the new digital experience.

It needed to communicate the level at which JTI operated, introduce its multidisciplinary expertise and help prospective clients assess whether the firm was appropriate for their project.

It also needed to retain the warmth and confidence of Joy and the team.

These priorities informed the site structure, page content, visual direction and enquiry routes. They gave the project a shared basis for assessing the work as it developed.

The website had to support the firm's wider ambition. It needed to:

• Present JTI as a high-level, strategic design studio spanning interiors, architecture and branding.
• Balance residential, commercial, wellness and hospitality audiences.
• Make the business feel premium without becoming cold or generic.
• Show the depth of thinking behind the work, not just finished visuals.
• Help qualify better enquiries.
• Communicate that JTI works with serious clients and meaningful budgets.
• Create a stronger platform for SEO, ads, future content and ongoing optimisation.
• Preserve the personality, warmth and confidence of Joy and the team.

This was not just a visual refresh. The website had to become a business tool.

There was also a deeper strategic problem that surfaced during the work, where clients often engaged JTI too late in the project lifecycle, after decisions had been made that the design process should have shaped. The website needed to teach prospective clients when to engage, not just why.

This project had to answer questions such as:

• Who is JTI best suited for?
• What kinds of projects should the website actively attract, and which should it gently repel?
• How should the site communicate minimum project value without feeling blunt?
• How should commercial, residential, wellness and hospitality pathways be structured?
• How do you migrate seven years of blog content and 45 projects without losing search equity?
• How much copy is enough to build trust without making the site feel heavy?
• How could the website support launch, SEO and paid acquisition afterwards?
• How could 9 Designs work as a strategic partner rather than a one-off supplier?

The answer was to treat the website as the centre of a wider growth system.

Pre-Work

Discovery and alignment sessions confirmed goals, audiences and conversion paths, with the commercial versus residential split established as the central structural decision. When initial proposals exceeded the available budget, we restructured the scope through tiered options rather than diluting the work, protecting every critical deliverable.

We also confronted the migration risk early. The existing WordPress site held roughly 225 blog posts across 25 archive pages and 45 project pages, seven years of accumulated search equity that could not be lost. We crawled the full archive, mapped every URL, flagged legacy slug problems and duplicates, and built a complete 301 redirect programme before the new site existed.

‍

Key Focus

Focus 1 - Distinct audiences within one practice

The commercial and private-client split became a central organising decision.

A commercial client needed information suited to the assessment of a professional design partner. A private client needed a more personal introduction to the experience of creating a home.

These differences influenced language, evidence, page structure and the questions asked at enquiry.

The wider portfolio also needed to communicate six areas of experience.

• Workplace.
• Wellness.
• Luxury Properties.
• Luxury Private Homes.
• Branded Environments.
• Community Environments.

These categories gave visitors clearer routes into the work while preserving an understanding of the practice’s wider capability.

Focus 2 - Making expertise visible alongside the imagery

The website needed to explain what people were choosing when they engaged JTI.

We connected project imagery with service information, process explanations and the people behind the work.

Testimonials, awards, press and professional associations provided supporting evidence at relevant points in the journey.

The structure gave visitors more to assess than the finished appearance of a space. It helped explain the thinking, experience and coordination behind it.

JTI’s community work and editorial activity also became more visible, contributing to a fuller picture of the firm.

Focus 3 - Explaining when to involve JTI

An important issue concerned the timing of client engagement.

Prospective clients could approach the practice after decisions had been made that its design process should have informed.

The website therefore needed to explain the value of involving JTI earlier and show how its work related to the client’s wider project lifecycle.

The JTI Way became a central part of that explanation.

We developed an interactive presentation of the firm’s five phases alongside the client’s own sequence of decisions. It identified appropriate points of engagement and showed what could be missed when stages were skipped or the design team was appointed late.

A comparison between the complete process and a piecemeal approach made those consequences easier to understand.

This gave the process content a clear purpose in the customer journey. It helped clients understand how to engage the practice effectively.

Strategic Approach

9 Designs approached the project by looking beyond pages and visuals, starting with the commercial role of the website: what it needed to say, which decisions it needed to support, and how it could help JTI grow with more intention.

The strategic direction focused on six ideas.

1. Positioning the studio at its true level

The site had to present JTI as a high-level, multidisciplinary design partner across interiors, architecture and branding, with design framed as a functional foundation rather than decoration. An editorial, luxury-calibre experience that shows the depth of thinking behind the work, not just finished visuals.

2. Editorial, premium and commercially clear

For a design studio, the temptation is to let imagery do everything. But imagery alone does not explain the value of the thinking, strategy and process behind the work. 9 Designs shaped the site to balance editorial presentation with clearer messaging, so visitors could understand not only what JTI creates, but why the studio is trusted to lead meaningful projects.

3. Clear audience pathways

JTI needed to speak to different client types without fragmenting the brand. The structure had to support commercial opportunities, private residential clients, wellness and community work and future hospitality ambitions, while still feeling like one coherent studio. Tone was tuned per audience down to the pronoun level: "your project" for commercial, "your home" for residential.

4. Proof at decision points

Case studies, project imagery, testimonials, press, awards, process content and service explanations all had to work together. The site was framed around trust-building moments: the points where a potential client is deciding whether JTI understands them, whether the studio is credible, and whether the next step is worth taking.

5. Intentional fit

Alongside attracting the right clients, the experience quietly communicates the level the studio works at, helping serious prospects recognise themselves and guiding every visitor towards the right conversation. Better-fit enquiries follow naturally from that clarity, without the site ever feeling like a gatekeeper.

6. A platform for ongoing growth

The relaunch was treated as the beginning of the next phase, not the end of the project. From the start, 9 Designs considered how the site would support ongoing marketing: website management, SEO articles, Google Ads, landing-page improvements, AI tool testing, tracking, conversion optimisation and strategic advisory.

‍

‍

Action Plan

The project progressed through discovery and wireframes, visual design, development and integrations, then review, launch and handover.

A living Project Master Document connected those stages.

It contained a prioritised page schedule, copy and media requirements, responsibilities for both teams and a record of questions and decisions.

Content could be prepared in build order, with practical guidance on image formats, landscape photography, detail shots and the information each page required.

A shared reference library helped establish the visual direction. Feedback was captured against the relevant material so questions could be resolved without being lost between calls.

This kept the strategic priorities close to the detailed work throughout delivery.

• A page-by-page copy and media schedule. Every page prioritised and sequenced, from Home at priority one through Expertise, all six project verticals, About, Contact and Press, so the client always knew exactly what to work on next and content arrived in build order rather than all at once.
• Copy and media guidelines. Practical rules that removed friction: write enough to fully explain and we will help cut and refine; hero images high-res and landscape; send detail shots too and we will find creative uses; minimum resolutions and formats specified so nothing arrived unusable.
• A shared task table. Every workstream split into "9 Designs to do" and "JTI to do", covering the review workflow, kickoff recap, priority plan, UX/UI phase, Webflow build, copy guidance, media collection and team photography, so ownership was never ambiguous.
• A curated design direction library. A reference set of interiors and architecture websites used to align visual taste early, so design decisions were made against shared examples rather than abstract descriptions.
• Structured wireframe feedback. Client questions and design feedback captured and resolved inline in the doc, question by question, so nothing was lost between calls.

Execution

We had 7 stage plan for the execution which followed:

Stage 1 - Discovery, UX strategy and structure

The engagement opened with discovery and alignment sessions to confirm goals, audiences and conversion paths, with the commercial versus residential split confirmed as the central structural decision.

9 Designs delivered:

• Implemented sitemap and information architecture built around audience journeys rather than internal structure.
• UX strategy covering CTA placement, form friction reduction and mobile-first behaviour.
• Desktop and mobile wireframes for Home, About, Expertise, Projects listing and detail templates, Press, Contact, and Blog listing and post templates.
• Audience pathway planning across the six environment verticals: Workplace, Wellness, Luxury Properties, Luxury Private Homes, Branded Environments and Community Environments.
• Qualification thinking baked into the journey before a form is ever reached.

Stage 2 - UI design and the design system

The website needed to feel spacious, assured and recognisably JTI.

An initial darker direction was developed and reviewed with the team. That process clarified the need for a lighter presentation better suited to the firm’s next stage.

The final system used gallery-like layouts, modern typography and generous spacing, allowing the project photography to provide much of the colour.

Commercial pages had a more structured presentation, while private-client journeys allowed greater fluidity and subtle connections with JTI’s Color of the Year editorial material.

The design system covered typography, grids, navigation, buttons, forms and interaction states, giving the website a consistent foundation.

9 Designs delivered:

• A complete visual direction and design system covering typography, buttons, forms, grids, hover states, navigation and footer.
• Light, gallery-like layouts that let JTI's jewel-toned project photography provide the colour, framed by clean modern typography and generous spacing.
• Deliberate styling differentiation between audiences: commercial pages clean, structured and minimal; residential pages more fluid, with subtle "Color of the Year" accents connecting to JTI's own COY editorial publication.
• High-fidelity desktop and mobile UI for every core page, plus global navigation, footer and reusable CTA modules.
• A more distinctive navigation experience WITH varied image sizing, spacing, asymmetric layouts, simple language and calm pacing.

Stage 3 - Bespoke components shaped around the content

We developed a substantial library of custom interactive components, reviewed and refined with the JTI team.

Each had a role within the wider experience.

• Sector cards introduced the six environments through a navigable set of image-led cards.
• Horizontal expertise panels explained Interior Design, Architecture and Branding.
• Rotating gem elements and supporting information panels connected the interaction design with the Jewel Toned name.
• The JTI Way phase slider provided an accessible introduction to the five project phases.
• The detailed process timeline related those phases to the client’s project lifecycle and explained the consequences of late involvement.
• Project sliders and portfolio filters helped visitors explore relevant work.
• Testimonials and association marquees brought supporting evidence into the presentation.
• Editorial article templates supported both contained-image and more cinematic treatments.
• A blog strip connected the main experience with the practice’s writing.
• Monochrome-to-colour project interactions introduced the jewel-toned imagery through movement.
• The press and accolades presentation connected visitors with articles, awards, podcasts and other external coverage.

Supporting launch pages, including the 404 experience and updated policy content, were also considered as part of the complete site.

The components were developed as reusable parts of the website, with the design rules documented for implementation.

‍

Stage 4 - Carrying seven years of content into the new site

The previous WordPress website contained approximately 225 blog posts and 45 project pages.

The migration needed to carry that body of work into the new experience while maintaining useful routes from existing links and search results.

We reviewed the archive and mapped titles, URLs and publication information.

Legacy issues included inconsistent paths, date-prefixed slugs and duplicate content requiring attention. The new structure brought articles into a consistent blog hierarchy.

A redirect workbook connected old URLs with their new destinations. It included a practical import sheet for implementation and notes on the issues requiring particular care.

Content was prepared for the Webflow CMS with article bodies, summaries, authors, dates and imagery.

The migration plan also covered category and archive routes, sitemaps and post-launch monitoring.

This work preserved the usefulness of the existing content within a clearer structure. It did not rely on rebuilding the visible pages alone.

9 Designs delivered a complete migration programme:

• A full crawl of the WordPress blog archive, extracting every post title, URL and publish date.
• A standardised new URL structure, moving mixed root-level and category paths into a clean /blog/ prefix.
• Cleanup of legacy URL problems found during the crawl: date-prefixed slugs, slugs that did not match their post titles, and duplicate posts flagged for consolidation.
• A three-tab redirect workbook: migration summary and gotchas, a full post-by-post redirect map, and a clean two-column old-path to new-path sheet formatted for direct import into Webflow's 301 panel.
• 301 redirect implementation for all posts plus category and tag archive pages, planned within Webflow's 500-redirect limit.
• Webflow CMS import files for blog content with full HTML post bodies, summaries, authors, dates and imagery, covering the team's multiple contributing authors.
• Pre-migration benchmarking guidance so rankings and traffic could be compared after launch, and a post-launch plan covering sitemap resubmission and crawl-error monitoring in Search Console.
• HTML and XML sitemaps for the new site.

‍

Stage 5 - Development and content management

he site was developed in Webflow with reusable components and CMS collections.

The JTI team could manage projects, articles, press items and team information through defined content structures.

The main areas included the homepage, expertise, project listings and detail pages, About, Press, Contact and the blog.

Team biographies, community information, associations and Color of the Year publications contributed to the About experience.

Project pages provided room for photography, renderings, work in progress, location and project information, alongside relevant recognition.

Training and documentation supported the team in maintaining these areas after launch.

The build covered:

• Responsive development across all breakpoints.
• CMS collections enabling the JTI team to add and update projects, press items, blog posts and team bios themselves.
• Home: hero carousel with full-width photography, the WOMEN OWNED mark, Areas of Expertise block, horizontal scrolling vertical blocks for the six environments, and the monochrome-to-colour hover project grid.
• About: full team photo, individual headshots with click-to-expand bios, Community Impact section, association logos, and COY issue volumes linking out to Issuu.
• Expertise: separate commercial and residential sections, competence areas, The JTI Way phases, blog entry points across ten content categories, and testimonials.
• Projects: a vertical dropdown filter across all six environments, a template layout per vertical, and image-heavy detail pages with project name, type, location, tight two-to-three sentence descriptions, renderings and in-progress photos, and an awards module.
• Contact: a two-path system splitting Commercial and Luxury Private Homes, with dynamic form fields and qualifying questions per selection, so qualification happens inside the form itself.
• Lead infrastructure: multiple CTA types (consult requests, downloads, portfolio access, quote requests) integrated with monday.com.
• Footer with newsletter subscription integration.

Stage 6 -Connecting the enquiry with the visitor’s circumstances

The contact experience separated commercial projects from luxury private homes.

Different routes and dynamic questions helped visitors supply information relevant to their enquiry. The structure also gave the JTI team greater context for the conversation that followed.

Consultation requests and other relevant actions were considered within the wider journey, with enquiry information connected to the supporting lead workflow.

Newsletter subscription provided a further way for visitors to remain connected.

The purpose was to help people arrive at a conversation with a clearer understanding of the practice, the engagement and the information they needed to provide.

‍

Stage 7 - Search, accessibility and technical review

The technical work was considered alongside the design and migration.

It included metadata, clean URLs, canonical information, relevant structured data and on-page search work for agreed priority pages.

A pre-launch audit identified practical improvements across images, scripts, accessibility, fonts and measurement.

The image work addressed sizing and format across a photography-heavy website. The audit set priorities for reducing heavy pages, with appropriate loading behaviour for hero and below-the-fold imagery.

Script review identified duplicate libraries and opportunities to defer non-essential code.

Accessibility work addressed missing image descriptions and labels on interactive elements. The audit identified 61 images requiring alt text, alongside improvements to the way controls were communicated.

Font loading, heading structure and production-domain settings were also reviewed.

The work included replacing inactive legacy analytics with a verified GA4 setup and configuring Search Console and sitemap submission.

These measures established a more useful basis for discovering, using and monitoring the new website

• Technical SEO implementation: metadata, clean URLs, schema markup where applicable, and page performance tuning against Core Web Vitals.
• Keyword research and on-page optimisation for agreed priority pages, targeting high-intent terms such as "interior design Fort Lauderdale" across the Workplace, Luxury Properties and Wellness pages.
• A complete SEO and Open Graph metadata suite written for every page: titles, meta descriptions, OG titles, OG descriptions and social share imagery, all carrying the brand's "Design is..." narrative language.
• Analytics setup with goal and conversion tracking.
• A blog strategy positioning content as a commercial channel: project stories, design insights and industry thought leadership, with approved templates protecting the editorial aesthetic.

A full pre-launch performance and technical audit, combining PageSpeed diagnostics with a manual code review, produced a prioritised, owner-assigned fix list across seven areas:

• Images. AVIF conversion and proper resizing across the portfolio-heavy build, cutting page weight from roughly 25MB towards 3 to 5MB and moving largest-contentful-paint into the good range, with lazy loading below the fold and preloading for hero imagery.
• Scripts. Removal of duplicate GSAP and Finsweet loads and deferral of all non-critical scripts, ten of twelve of which had been render-blocking.
• SEO foundations. Correct H1 structure, canonical tag to the production domain, robots directives, schema URL fixes and LocalBusiness schema for local search visibility, with staging set to noindex before go-live.
• Accessibility. Descriptive alt text across 61 images that were missing it and ARIA labels on every interactive element, moving the site towards WCAG 2.1 AA.
• Fonts. Font-display swap to eliminate invisible text during load.
• Analytics rescue. The audit discovered the old site's Universal Analytics tag had been dead since Google retired the platform in July 2023, meaning the client had unknowingly been without visitor data for nearly three years. The new site launched with GA4 verified and firing, Google Search Console configured and the XML sitemap submitted.
• Pre-launch checklist. Re-tested PageSpeed targets, real-device testing on iOS and Android hardware, form submission and routing checks, and old-site redirection immediately at go-live to avoid duplicate content.

‍

Stage 8 - Review, launch and handover

The project developed through more than 15 team calls and over 300 recorded feedback items.

Those reviews connected broad decisions about the brand experience with details of imagery, typography, navigation and interaction.

Testing covered browsers, devices, forms and enquiry routing. Launch coordination connected the new site with the existing domain and redirect plan.

The JTI team received the CMS guidance and documentation needed to continue working with the site.

Post-launch priorities provided a basis for future content, search and website improvement without presenting those future activities as completed results.

What the work enabled

JTI gained a digital experience more closely aligned with the calibre and breadth of its practice.

Commercial and private clients could follow more relevant journeys, find appropriate evidence and understand the expertise and process behind the portfolio.

The JTI Way gave the firm a clearer way to explain when its involvement was most valuable. The enquiry structure supported more informed conversations.

The project also carried years of existing content into a manageable new website, supported by bespoke components, search foundations and working measurement.

The result connected JTI’s reputation with a fuller explanation of its value and a practical platform the team could continue developing.

Final outcomes included:

• A more premium and intentional digital presence.
• Clearer positioning for a high-value design audience across six environment verticals.
• Stronger qualification of potential clients, built into the journey and the forms themselves.
• The JTI Way system that teaches clients when to engage, addressing the firm's most costly sales problem.
• Around 225 blog posts and 45 projects migrated with search equity protected through a complete 301 redirect programme.
• A bespoke interactive component library no template site could replicate.
• Better balance between visual inspiration and commercial clarity.
• Connected lead infrastructure flowing enquiries into monday.com and Mailchimp with segmentation.
• A technical SEO and metadata foundation targeting the searches that matter commercially.
• A live website the JTI team can update themselves, with training and documentation.
• A clearer post-launch roadmap for growth, and a stronger partnership model between JTI and 9 Designs.

The relaunch moved JTI from having a website that presented the business to having a website that actively supports it.

The Live Site

jeweltoned.com open live ↗

click anywhere to open the live site ↗

‍

Posi+ive Impact

The project strengthens a women-owned firm at the moment it is scaling, and gives its community work a permanent digital home. JTI's Community Impact section, association memberships and community environments portfolio, spaces designed for the public good, now sit visibly within the brand rather than at its edges. The migration preserved seven years of the team's design writing and knowledge-sharing, and The JTI Way educates clients openly about how good design processes protect project outcomes, raising the standard of the conversation for the whole category.