UX for Data visualization and research professionals
UX of Data: designing for complexity, credibility, and community
Client
The Khalifa Ihler Institute
Role
Design Strategist
UX Designer
Expertise
UX Research
UI Prototyping
Data Visualisation
Timeline
4 months
Overview
We designed a website surrounding a complex data visualization
Our site serves 3 main purposes:
Educate general audiences about the data,
Give research tools for professionals to dig into the data,
And foster community and provide resources to those affected (people who are the data).
The problem
How do we build a single product for very different users?
We collaborated with Bjørn Ihler, a counter-terrorism and peace activist and co-founder of the Khalifa Ihler Institute. And together, we were tasked with enhancing Hatemap.io - the website which hosts their data visualization project “The Hate Map,” which tracks and visualizes hate crimes worldwide through interactive maps and dynamic data displays.
Bjørn wanted to build a space that educates casual users, provides necessary data to professionals, and enables collaboration among affected communities. But those requirements clash with each other.
"I want quick and simple data to know what's going on around the world"
- a casual user
"I want a lot of tools and details to dig around and find patterns in the data"
- a research professional
"I need resources to find help and community"
- a victim of a hate crime
Research
We looked to the competitors, stakeholders, and users to teach us the requirements.
Competitive analysis
We compared 11 online research tools to understand what works best in each, and what doesn't.
Even the best of the sites had a particular flow.
Affinity mapping
We distilled our research into six key themes that shaped the product direction - emphasizing data transparency, accessibility, and narrative clarity. This helped us prioritize what users actually need, not just what looks good.
User Interviews
We interviewed 4 research professionals to understand the various things they look for when diving into research.
Every researcher functions differently.
Strategize and design
We combined our knowledge and went into an iterative design process over 3 weeks.
Converting "skeleton" wireframes, adding and removing aspects, and create user flows.
Solution
The result is a multi-layered data visualization, and space for tools and resources
The goal of this project was to strike a balance between simplicity, exploration, and community:
Quick information -> Click -> Detailed information
The data visualization is designed with a gradual reveal of detailed information, so that those who are curious can explore, while the rest can leave with the information they need.
Data Exploration tools
Researchers want to dig around and play with data - make comparisons, connect dots. The Trend Finder tool helps them do just that.
Community & Resources
Articles that tell stories, and resources for those who need, and a discord server built by the founder provide help and companionship to anyone that needs it.
Next Steps
Optimisations and implementations down the lane.
While our timeframe was short, we thought farther into the future of Hatemap.io, in order to optimize it for users with different needs and circumstances, plans to make the implementation of this design more effective, and expanding on our product without roadblocks.
Mobile optimization for communities without desktop access
While computers are a key tol for many researchers, Hatemap also caters to those that are affected by the incidents it maps. And not everyone in these situations have access to a computer as they do to a smartphone.
The mobile optimization plan puts more of an emphasis on the community spaces and resources, so users can find help or connect with communities efficiently.
Map tutorial to guide lost users
A map tutorial would guide users into understanding the data, ensuring full transparency and control over the information.
Impact
Our design is the key towards funding
After our final presentation, the client was very pleased with the outcome.
He intends to use our prototype as a Proof of Concept to get funding from investors to fully implement the design.













