the homepage for the law foundation dashboard

The homepage for the law foundation dashboard

My responsibilities
UI design - crafted design system and hi-fi mockups
User research - interviewed users, created personas & feature maps
The challenge
Design a web software to simplify the data submission process for the community legal advocates and help the law foundation BC analyze the data.
In 9 weeks of the project time, I presented a user research report to our client, crafted a design system with a visual design guide, and created a set of hi-fi mockups with animation.
Extracy design system

Extracy design system

Design goals

Key design objectives
key objective 1: View & submit data on a centralized platform
Key objective 2: Visualize existing & new data to identify hidden patterns
key objective 3: Simplify & automate all data processes of the Law Foundation
How did we come to these 3 key objectives?
I interviewed 5 participants from law backgrounds and summarize 4 main user insights:
  • Community advocates need to navigate people in trouble through the bureaucracy or professional services;

  • The limited amount of social workers and community advocates causes higher working pressure and longer working time;

  • The legal resources around the remote areas and indigenous communities are not as easy to access as in major cities;

  • There are no suitable tools for advocates to analyze the data.

After I finished the persona and user journey maps, I was able to analyze the core user needs for the law foundation and community advocates:

🗨️ the law foundation

  • View and export the data easily

  • Automatically process the data to reduce management processes

  • Analyze the data and see data trends through visualizations

  • Safety & Confidentiality

  • Simple Data Showcase

  • Easy Data Management

🗨️ community advocates

  • Fill out and Send Forms Easily

  • Reduce the time they spend sending documents to the Law Foundation

  • In the future: automatically transform the data they submit into charts


Inspired by nature, the logo design adapts the image of a new bud, which means life & hope.

It aligns with the aspiration of the law foundation BC and what community advocates are doing - helping vulnerable groups and creating better communities.

Dark theme design

Interaction design: expanding of the navigation bar

Final takeaways

Use different strategies when working with different kinds of clients. The key is to understand what matters to them and what does not. Our clients are from the legal industry and they are pretty detail-driven. So I paid extra attention to the copywriting and kept consulting with the client regarding the language use.