Notice To Quit
Designing warmth into a legal service people only use on their worst day.
Context
Notice to Quit is a legal service that helps landlords navigate the eviction process. The company is backed by lawyers with direct experience in the space, and their pitch is simple: eviction is legally complex, emotionally draining, and full of procedural traps — let us handle it.
Their users come to them on a hard day. A tenant has stopped paying. A commercial lease has gone sideways. Something has already gone wrong by the time someone types "how to evict a tenant" into a search engine. That emotional context shaped everything about how I approached the design.
At a glance
My role UX/UI Designer — owned flow design in engagement 1, brand and UI refinement in engagement 2
Team Solo designer, working directly with the founding team: Stakeholder and front-end developer
Timeline Engagement 2 weeks on the request flow. Engagement 2: 3 weeks on the landing page and brand warming
Client: Notice to Quit — a [US / UK]-based legal service helping commercial and residential landlords manage the eviction process
Status: Shipped.
——————
Outcome
What I delivered across the two engagements:
A 4-step request flow that replaced an open-ended form, making the first interaction feel structured and finite rather than bureaucratic
A warmer visual identity layered onto the existing brand without throwing it out — preserving continuity for returning clients while changing the emotional tone of the experience
A repeatable visual pattern (the shape motif used as a navigation cue) that solved a UI problem and a brand problem at the same time
The client returned for the second engagement a month after the first. That repeat engagement — and the shift from "just fix the flow, don't touch the UI" to "actually, please do touch the UI" — is the outcome I care about most. It meant the first delivery earned trust.
Engagement 1 : Flow Request.
Starting with the flow, not the screens
I opened the engagement by building out the full user flow with the client, before touching any UI. This is how I usually start, and in this case it was especially important: the client was still working out which features belonged in this phase and which would wait for a later dashboard build.
Mapping the flow did two things at once:
It gave the client a concrete artifact to make scope decisions against
It surfaced that a dashboard belonged in phase 3, not phase 2 — which the client had been leaning toward building prematurely
That scope clarity was arguably more valuable than the flow itself.
User flow for NTQ, defined process after landing onto the page.
NTQ Landing
Brand and assets at hand.
The 4-step rule
I set a constraint early: the request process would not exceed four steps. This was a deliberate design choice, not a client requirement.
The reasoning:
Perceived effort matters more than actual effort. A single long form and four short steps can contain the same fields and take the same time, but they feel radically different to someone who's already stressed.
A visible stepper turns an unknown into a finite thing. "You're 2 of 4 done" is quietly reassuring. "Keep scrolling, we'll tell you when you're done" is not.
Checkout forms were the right mental model. Users were already familiar with e-commerce checkouts, and the familiarity carried a useful implicit promise: this has a clear end.
Engagement 2: Warming the brand
The client came back a month later. They'd received feedback that the landing page read as too clinical for the emotional weight of what users were dealing with. They asked me to warm it up without breaking continuity with existing clients who already knew the brand.
Deciding what "warmth" actually meant here
Warmth in a legal service is not the same as warmth in a wellness app. If the design leans too soft, it undermines the core promise: that the users are in the hands of serious professionals. I defined warmth for this project specifically as:
Confidence, expressed gently. Same expertise, less armor.
Space and air rather than density — because density on this topic reads as legal-document-scary.
Human presence in the imagery, but not performative empathy.
Palette — evolution, not replacement
I kept the existing blue as the anchor and introduced a warmer secondary palette layered alongside it. The blues became more modern because they had new neighbors; the new tones never fully took over.
Adding warmth tones onto the blue hues helped to make it more modern as well. Adding little spaces with other colors gave me more flexibility for more contrast.
Shape motif — a pattern that worked two jobs
The existing brand had a recurring bold shape that was being used decoratively. I identified it as the most recognizable element of the brand and repurposed it: instead of a decorative accent, it became a subtle, repeated motif that led the eye down the page.
One pattern, two problems solved: it strengthened brand recognition, and it solved the UI problem of "where does the user look next" on a page that had previously felt flat.
Imagery
The existing site used stock icons and illustrations that didn't carry any emotional signal. I recommended replacing them with imagery that conveyed human presence — specifically, people in ordinary moments rather than business-portrait posing. The principle: reassurance works when users feel seen, not when they feel sold to.
Final design comparison
Initial impression of the landing page: Enhanced navigation with readily accessible, valuable content. Improved layout and text hierarchy for effortless communication.
Before: dense hero, blue-only palette, generic iconography. After: narrative hero with a clear single promise, warmth tones layered into the existing blue, imagery with human presence, and the brand's shape motif repurposed as a visual guide through the page.
Challenges and trade-offs
Inheriting half a brand. I had to evolve someone else's work without disrespecting it. The decision to layer rather than replace was the right call for this client, but it meant every choice had to be a negotiation with an existing system I hadn't authored.
Two emotional tones in one design. Competence and warmth pulling in opposite directions. I resolved this by letting structure carry the competence (the stepper, the hierarchy, the typography discipline) and letting color and imagery carry the warmth — so neither had to do both jobs.
No direct user research. On a service this emotionally loaded, I would have preferred interviews with actual landlords mid-process. I worked from stakeholder input and competitive positioning instead, and I was explicit with the client about that limit.
Thanks for reading!