Westlaw Edge UK redesign
Westlaw Edge UK is Thomson Reuters’ legal research platform: case law, legislation, journals, commentary and EU materials, searchable in one place. Lawyers and barristers rely on it every day.
I led the redesign across TR Westlaw, TR Practical Law and TR Books, built the design library behind it, and redesigned the legal document comparison tool, which shows every change between two versions of a law.
Year
2019–2020
Timeline
~1 year
Tools
Sketch,Abstract,Figma,InVision,Miro
My role
Redesign Lead,UX/UI Designer,Design Library
Creator & Owner,AccessibilityTeam
UX/UI Designers (5),Accessibility Expert
Westlaw Edge UK home — before VS after
Problem statement
Challenges
- Three products in scope: TR Westlaw, TR Practical Law and TR Books
- No design library and no component-based development
- The US product’s components couldn’t simply be reused — the UK product has its own specifics
- 30+ page types, each unique in some way, so no single template fit
- Strict TR brand guidelines and an established visual style to design within
Business
problems
- Outdated UI that fell behind industry standards
- UX issues, including usability heuristic violations and non-optimal layouts, confirmed by support and research feedback
- An inconsistent experience across three products: TR Westlaw, TR Practical Law and TR Books
- Accessibility issues across the platform
Design
goals
One consistent experience across all three products, in every region
Fix what users struggled with, and cut support requests
A design library and the processes around it, ready for component-based development
Raise accessibility to AAA standards
Process & solution
Process
The work wasn’t linear — most of these ran at the same time, across the whole project.
Iterative design & prototyping
- Redesigned each page in its own context
- Balanced business and user requirements
Design library & documentation
- Built new components and patterns, easy to use
- Set up the processes around the library
- Documented pages and components
- Worked with the US design team to keep both products consistent
Learn & test
- Wrote hypotheses and interview and testing scripts
- Observed testing and interview sessions with users
- Analysed the results, and what support already knew
Workshops & ideation
- Ran brainstorming sessions with stakeholders and other design teams
Design QA
- Set up the design QA process
Research & workshops
Deep dive: docs comparison tool
The
problem
The comparison tool finds and highlights every change between two versions of a legal document, so lawyers keep their clients compliant. It was hard to read and hard to use.
- Outdated UI with insufficient visual treatment
- Information essential for completing a task wasn’t visible
- Cramped controls and poor grouping
- Accessibility issues
- Strikethrough text that was hard to read
- Lack of system feedback and error prevention
What
I did
- Brought the UI and UX in line with the new TR brand guidelines
- Added new ways to compare, including UK against EU law
- Consolidated the toolbar for better usability and focus
- Improved system feedback and error prevention
- Improved typography and text highlighting for readability, on screen and in black-and-white print
- Optimised the layout for printing documents
- Improved accessibility, working with an accessibility expert
Designs
Docs comparison tool — before VS after
Final designs
Designs
Achievements
Key results
One consistent UI and UX across all three products and regions, on the new TR brand.
A design library and the processes around it, built from scratch.
Component-based development under way across the products.
Clearer typography and highlights, readable on screen and in black-and-white print.
A consolidated toolbar, clearer system feedback and better error prevention in the comparison tool.
Accessibility improved across the platform.
