Tenant Shield: Simplifying Access to Legal Aid
Tenant Shield is a UK-based non-profit organisation committed to making legal aid accessible to all, ensuring everyone can independently and proactively uphold their right to housing. I was responsible for using Framer to design and develop complex legal guides, making them easy to understand and intuitive to navigate.
Client
Tenant shield
DELIVERABLES
UX audit
Framer Development
Content integration
Year
2025
Redesigned inital user flow
The brief
Presenting complex legal information in a clear, digestible format
1
Refine and Develop the Existing User Flow
The client came with a loose structure that needed a clearer path for users with little to no legal knowledge to navigate easily to get the information they need.
2
Dynamic CMS Development
The site required a scalable structure to handle numerous repeating page types, each tailored to different legal grounds. Multiple CMS collections were required to support this and ensure the client could manage and update content independently in the future.
3
Visual Redesign
The existing design felt too dark and outdated. The client wanted to update the visual direction to be modern, high-tech, and approachable.
4
Content Integration
I was tasked with uploading and formatting detailed content, including step-by-step guides and supporting materials for all 33 legal grounds, ensuring consistency and clarity across the site.
The opportunity
Clarifying Structure for Better Usability
A UX audit of the existing design revealed several key areas for improvement. While the overall structure had potential, the experience was confusing for users. Many pages looked visually identical, making it hard to tell where they were or if they were viewing the correct information. There was little visual hierarchy, and key elements like step-by-step guides blended in with blocks of dense legal content, making the site feel overwhelming and hard to navigate.
The opportunity lay in creating clearer visual separation between content types, introducing more effective headings and labels, and simplifying the user journey by combining or removing unnecessary pages.
Tenant Shield's previous design with notes and recommendations from the audit I conducted
The Design
Checklist style user experience
The step-by-step guides are designed to function like interactive checklists, and completed steps collapse to reduce visual clutter and avoid overwhelming the user.
On sub-pages where users need to verify whether served documents meet specific criteria, checklist functionality allows them to track their progress, stay oriented, and avoid missing crucial details that could help them challenge their eviction.
CMS led development
Each page within the legal guides is powered by dynamic CMS collections, making the site scalable and easy to maintain. I designed and implemented 9 custom CMS collections and uploaded all content related to the legal grounds. Resulting in a cohesive, structured, and easily updatable system.
Approachable minimal & modern visual design
The updated design is clean, bright, and easy to navigate. To align with the integration of a legal aid AI chatbot, the client wanted a high-tech feel that still remained approachable. A primary blue palette was chosen to convey trust and credibility, while improved visual hierarchy and contrast enhance clarity and user focus throughout the site.