showcase_

Lawfty D2C

tools used

next.js, typescript, sanity.io, graphql, tailwind, redis, new relic

year

2026

front-end, back-end, ui/ux

View Project

available for freelance work

social_

twitter / instagram / facebook

Lawfty D2C Sanity Studio pages

Lawfty.com is the direct-to-consumer side of the business. Someone searching for a lawyer lands here, not on a campaign page for a partner firm. It runs on the same Sanity and Next.js setup as the firm sites, with its own dataset and its own design language.

Pages in the Studio

Content lives in a Pages collection. An editor writes a title, stacks the modules they need, and the slug is generated per locale. Everything goes through a draft and published state, so a page can be worked on and previewed without touching what's live.

The site is bilingual. English and Spanish live in the same document, each with its own slug, so the Español switch in the navigation is a language toggle on one page and not a second site to keep in sync.

Beyond free-form pages, the site is modelled around what the business actually publishes: attorneys, practice areas, locations and their landing pages, blog posts, FAQs and legal pages. Each has its own route. Adding an attorney means filling in a document, and the profile page appears. Redirects and vanity URLs are managed in the CMS too, plus an SEO fallback so a page missing its own metadata still ships with something sensible.

Blocks that repeat across pages are handled by a shared content type. An editor writes one once and reuses it everywhere, and the Studio offers a preset per module type, so you start from a real module and not an empty object.

Type scale

Typography is a set of tokens, so H1 through H6, subtitle, body, disclaimer and caption all come off one scale. An editor picks a level and it looks the same wherever that module ends up. This is the test page I used to check the whole scale in one view.

Lawfty D2C type scale

Navigation

Navigation is driven from the CMS too, including the Practice Areas dropdown. Adding a practice area is a content change, not a deploy.

Lawfty D2C practice areas dropdown

Legal pages

The legal pages are long and change often, so the table of contents builds itself from the headings in the document instead of being maintained by hand. The last updated date comes from the CMS as well.

Lawfty D2C privacy policy

Forms and delivery

The contact and attorney enquiry forms post to route handlers on our side, so Zod validates the same shape on the client and the server, and every submission is logged before it leaves the app.

D2C shares a monorepo with the firm sites. The Apollo client, the Redis cache layer, middleware, logging and env handling all come from one shared workspace, so a fix in either app benefits both. Sanity responses are cached in Redis and cleared through an authenticated refresh endpoint when content is published, with New Relic on the browser and server side.

More to come.


View website | View Lawfty CMS case study | Contact Me

work

Case study incoming

Flatmately project image, click to view more details.

Flatmately

js, html, tailwind, figma

Flatmately is a flatmate finder app, built for New Zealand and Australian market. I was tasked to design and develop their website, and also helped with branding and marketing.

Case study incoming

NxtStep project image, click to view more details.

NxtStep

js, html, bootstrap, sketch, ai, psd

NxtStep is a job board for students and graduates. I was tasked to design and develop their website, and also helped with branding and marketing.

Case study incoming

Yoga With Kassandra project image, click to view more details.

Yoga With Kassandra

js, html, sass, wordpress, ai, psd

Yoga With Kassandra is a yoga teacher and content creator. I was tasked to design and develop her website and courses platform while I was working at VidApp.

Case study incoming

Tourism New Zealand project image, click to view more details.

Tourism New Zealand

js, html5, css3, sass, bootstrap, sketch

Tourism New Zealand is a website I've built to showcase my skills utilising JavaScript, HTML5, CSS3, SASS, Bootstrap, Sketch. I was tasked to design and develop their website.

Case study incoming

Renkon project image, click to view more details.

Renkon

js, html5, css3, sass, bootstrap, handlebars, sketch

Renkon is a Japanese restaurant, I've pitched the new website and design for the ordering app. I used JavaScript, HTML5, CSS3, SASS, Handlebars and Bootstrap to build the website.

Case study incoming

DotaPopQuiz project image, click to view more details.

DotaPopQuiz

js, html5, css3, sass, php, bootstrap, sketch

DotaPopQuiz is a quiz app built with JavaScript, HTML5, SASS, PHP. It was built as a fun project to make a game to increase brand awareness and to learn more about JavaScript and PHP.

Case study incoming

VidApp project image, click to view more details.

VidApp

wordpress, js, html, sass, ai, psd

VidApp is a video streaming platform. I was tasked to design and develop their website and the platform where users would publish their customised app for iOS and Android.