Dark Web Ad Analyzer
Problem Statement
Human trafficking is a global scourge, and there is a critical need for innovative tools that aid LE in identifying criminal networks based on their digital footprints and syndicated ads. Addressing this challenge through AI/ML is paramount in the fight against human trafficking.
TEAM COMPOSITION
2 Product Owners/Executives
1 Product Designer
4+ Software Engineers
My Impact
Created custom dashboards to view trails and ads
Leveraged unique subject matter expertise
Provided tools to help LE stop trafficking
CSS Leads to a Collaborative Project
Cross-functional Initiatives
I often work directly with various teams, including Engineering, to ensure proper handoff and implementation. Using my front-end skill set, I was able to work with a team to deliver high-value styles that became a basis for more work.
A chance encounter at a co-working space gave me the chance to dive into software design services for LE. It began shortly after I had picked up some web development experience, building websites for small businesses. Typically, I would support our clients’ web work via HTML and (S)CSS, occasionally touching vanilla JS; later, this experience was instrumental in picking up React and building web and mobile apps.
An artificial intelligence company, that specializes in Python-based AI/ML, in the space was looking to improve their web interface for an LE product; I happened to be the person that was able to get them what they needed, and shortly after, we had a contract in place to support their endeavors. What started as a casual conversation about CSS soon flourished into a working relationship that would play a role in the fight against human trafficking.
Understanding the Complex Domain
Stakeholder Collaboration
I defined the requirements of the client by working closely with the PO to understand the nuances of what LE needed in a tool to succeed and incorporating features that were highly requested in working with the AI/ML tool.
My introduction to the project allowed me to better understand this critical domain. The web application in question leveraged a database of ads from the dark web, collating this information into a powerful dashboard for LE. It offered the opportunity to dissect syndicated networks, and pinpoint the sources of human trafficking ads—working towards reducing this global threat. Supporting its design led to an improved user experience, the ability to use the application across different viewports, and even new feature development.
I immersed myself in the nuances of new feature development, parsing an understanding of how my UI/UX expertise could provide valuable support. Understanding the user personas, workflows, and unique challenges faced by LE was paramount. We engaged in deep dives to comprehend the intricacies of the web application and its database, ensuring that my designed solutions would seamlessly integrate into the existing infrastructure while significantly improving usability and efficiency.
Creating a Design System and Dark Mode
Design Systems & Standards
The design system of this project was created from scratch. I implemented modern components via Atomic design to build a framework for UI elements and helped with handoff to Engineering.
I was tasked to redesign the detail pages of search results, the primary dashboard with graphics and a consolidated layout, and new features such as a geo-based visualization of places where ads were distributed from. This work included the creation of UI components, the establishment of a robust design system, and the crafting of responsive screen layouts that were both on-brand and user-friendly.
Typography, color palettes, and data visualization objects played a pivotal role in our design strategy. I aimed to provide law enforcement officers with a modern dashboard that allowed for the seamless sorting and filtering of data, enabling them to find and bookmark ads related to human trafficking with precision. Additionally, recognizing the importance of user preferences, we introduced a dark mode to ensure optimal usability in various working environments.
Enabling Development via Transition
Lesson Learned
Adobe recognized how popular Figma was and bought it, so my complaints about using Adobe XD for handoff are moot. I prefer a system like Figma where developers can more easily work with specifications and comments.
A crucial aspect of my role in this project was to ensure a seamless transition from design to development. I knew that the development team's efficiency hinged on the clarity and completeness of the assets provided. Therefore, I meticulously created design assets, specifications, and interactive prototypes, allowing developers to focus on bringing the vision to life while also having a direct line to our design team for any questions or clarifications.
This collaborative approach facilitated a productive working relationship between myself and the development team, ensuring that the final product aligned with the design intentions. The handoff process was a continuation of our shared commitment to creating a tool that could make a real impact on the fight against human trafficking.
Making a Difference for LE
Advocacy & Representation
I was able to advocate for design's role as a means to creating highly extensible and modern interfaces that could help LE and provide them with the tools they needed to succeed in combatting human trafficking.
The redesigned web application provided a powerful tool for identifying and tracking ads that led to instances of human trafficking. It was a reminder of the positive change that technology, coupled with thoughtful design, can bring to the world.
The success of this project opened doors to more opportunities in the LE and community wellness spaces. It reinforced my belief in the transformative power of design and its ability to support critical initiatives.
Outcomes and Results
I helped lead efforts to evolve critical software that empowers LE to analyze and combat human trafficking through the systemization of data from syndicated ad networks. My collaborative efforts with the AI client resulted in the successful implementation of a sophisticated web interface and dashboards.
Disclaimer: Work shown was created while employed at Nearby Creative and displayed with permission. Header image from Unsplash.