Home > UX Design > CIB Mango Tree

CIB Mango Tree

CIB Mango Tree is an open-source software tool built by Civic Tech DC to combat Coordinated Inauthentic Behavior (CIB) online. CIB is the organized use of fake or misleading accounts, content, or activity to manipulate public opinion, disrupt online discourse, or spread disinformation. The CIB Mango Tree tool is designed for journalists, researchers, and others who want to analyze datasets from social media websites to identify likely disinformation.

Background

Problem

The project had a website where users could download the tool, which also explained how the tool works and how user should prepare their data. The website was not responsive, and not usable on mobile devices. After consulting with the development team, we decided the website also needed a slightly more sophisticated look, the addition of a News section, and a better way to graphically explain to users about understand their dataset, among other changes.

  • UX/UI Designer

My Role

Original Website:

Solution

A website re-design and a mobile landing page directing mobile users to the website. Users would mostly access the site and download the tool on a desktop computer, but we wanted a mobile-friendly landing page in case someone came across the site on a mobile device, which would direct them to the desktop site to download the tool.

Tools

  • Figma 

Timeline

  • 1 month

Final Desktop Prototype

Click here to click through the final desktop prototype.

Sample Iterations

Before

After

Mobile Landing Page

CIB Mango Tree is meant to be accessed from a desktop computer. However, we knew some users would come across it on mobile, and the original site was not responsive at all. We wanted a landing page explaining CIB Mango Tree that was compatible with mobile devices, which would have a note directing users to access the site on a desktop computer.

Before

After

Final Product

Final Desktop Prototype

Click here to click through the final desktop prototype.

Final website, before and after

Before

After

View more case studies

Capital One Budgeting Feature

Responsive Website Re-design

MedSync Health Data Aggregator