FedFunl Website

The FedFunl project is a dynamic collection of news articles tailored for the government contracting audience serving as a centralized hub for government contractors, simplifying their search for lucrative government contracts.

FedFunl-Website-Featured-Image

PROJECT Overview

Goals

The first goal of this project was to investigate how individuals working in government contracting obtain award and contract information, what tools they utilize, and how they ingest this information in preparation for the contracting cycle.

The second goal was to create a website that showcases a dynamic aggregate of news articles that can easily be searched and filtered through an AI-generated data repository.

My Role

I co-led with shaping the project's overall design journey. This involved crafting a comprehensive research plan, conducting insightful stakeholder interviews, mapping out user flows, and meticulously creating a style guide that would underpin our design choices.

Additionally, I led the charge in creating the brand logo, fine-tuning UI components for a consistent web experience, and crafting detailed design mockups for both desktop and mobile platforms. Every step of the way, my focus was on delivering a cohesive and visually engaging user experience.

Project Duration

Six Months

Client

Skyward IT Solutions

Team

Loy Vang

Kenny Tran

Role

User Researcher, UX/UI Designer, Visual Designer

The Problem/Opportunity

With the contracting cycle, there are a set of tools and websites government contractors utilize to keep up-to-date on rewards, upcoming bids, etc. There is no single source of truth for all data from the collective government agencies that contractors can rely on for fast and efficient information gathering.

The Process

Understanding the process of government contracting and the information that users feel is missing allowed us to identify key opportunity areas for our product and inform our roadmap for discovery and team collaboration.

To begin, we aligned our design thinking process by alternating between the four phases: Define, Discover, Design, and Deploy.

Define Plan/Goal

Outlining The research plan and The Overall Scope of the project.

Our North Star

How can we make an impact on the business development team to ensure they are utilizing the best tools, resources and capabilities needed to effectively search for government contracting work?

The Plan

I constructed A research plan that included some of the following:

  • Overall Objective

    • Conduct and investigate SME personnel on what tools or websites they utilize to follow, analyze, and proceed with government contracting work.

  • Research Methodology

    • Stakeholder Interviews

  • Research Questions

    • What tools do government contractors use to understand contract awards, protest, and events?

    • What user needs exist from the current tools in the ecosystem?

    • What is the process of finding contracting information?

    • Which pieces of information would users benefit most from? Why?

    • What are ways government contractors communicating with one another or agencies when they can’t find the information that they need? How did these processes come about?

    • Have there been a shift in resources that have been successful or slowed down information gathering for contractors?

  • Participant Requirements

    • Personnel who has at least 5-10 years in the government industry

    • Their role is directly impacted or will be impacted by the core objective of this project

  • Number of Participants

    • 5-7 participants

  • Type of Interview

    • Semi-structured interviews

  • Duration of Interview

    • 1 hour

Discover Needs

Conducting interviews, Affinity mapping, And Key Insights.

Qualitative Approach

We conducted five in-depth interviews

Each with their own experiences and expertise, I led and conducted semi-structured interviews with five of our potential users: CIO, VP of Business Development, VP of Operations, Director of Proposal Management, and Proposal Technical Writer.

This allowed us to understand how each specialized area are conducting their search and what processes are they following on a daily basis to ensure which contracts are worth going after and how to proceed.

Stakeholder-Interview-1
Stakeholder-Interview-3
Stakeholder-Interview-2
Stakeholder-Interview-4
Stakeholder-Interview-5

After each interview, we placed the interviews into a third-party tool to begin implementing tags, notes, annotations, etc. for a deeper dive into our conversations and synthesize our findings.

Interview Highlights

Difficulty finding what you’re looking

“It takes a long time just to keep digging and digging and digging to get the information. I will get to a certain point where I can’t find anything and I’ll pass it over…“

Inaccurate or non-existent information

“It’s not guaranteed to be accurate.“

“And not all of the forecasts are viable. Sometimes this, they put a forecast out and stuff that gets contracted never appeared on the forecast.“

Confusing and out-dated information

“Each of the agencies has a website and a lot of times this stuff is old...“

Information overload and convoluted

“You used to be that you could be a lot more thoughtful when you were to be in this, but because there’s such a barrage and deluge of information, you almost have to be ADHD to keep up with the information flow.”

Unclear/Unrealistic expectations

“Sometimes the government will have just wonky names under task orders. Very wonky because they’ll just start with an explanation rather than giving it a full title.”

Affinity Mapping

With all our tags, notes, annotations, and labels neatly organized, we embarked on our affinity mapping adventure. We carefully sorted each note into its rightful place within the reoccurring themes that evolved from this activity. This not only made the process smoother but also streamlined our data intake, laying the foundation for some powerful insights to emerge.

Click on the image to enlarge

Primary Insights

We uncovered roughly 36 Insights that drove the design mockups.

Some of the key insights gathered were:

INSIGHT #2

Primary resources that the users utilize to source historical data for contracts they're interested in. Level of importance on the information is dependent on the information user is looking for at that point in time. Some resources are paid services while some are free to the public.

INSIGHT #5

Users have their trusted primary tool - they will deviate from the tool if they start noticing knowledge gaps within the information they're provided.

Sources include: social media, gov tools, websites, etc. But ultimately users are looking for reliable data/sources to ensure credibility before beginning / optimizing their search.

  • "Do I have enough information to continue?"

  • "Does it align with our capabilities or interests"

  • "Do I keep this in my back pocket or forgo it?"

INSIGHT #11

User compare information and updated information to come up with a strategic plans to go after a contract. This will help determine who to partner with/ work with and who their competitors are who are in the same field. User will utilize in-person resources (events ,etc) in order to gain insight, SME (Subject Matter Expert) of interest.

INSIGHT #14

Users use filters to find new opportunities, advanced searches for competitive analysis, company information/history, and most up-to-date piece of information at that point in time (i.e. RFI, company info, etc.)

INSIGHT #18

Users obtains information that are static and not up to date, leading to uncertainty and validity of the site especially when it’s a paid system.

INSIGHT #24

User understands the intricacies of government contracting work and its limitations to provide accurate, and timely information and will settle with storing and retaining information they found useful.

Users feel that tools and resources are only as good as the people who create them.

INSIGHT #28

User expresses their personal opinions on government search tools and preferences over which tool to use.

User has different usages and preferences around each research tool depending on:

  1. What you are searching for

  2. The level of information it provides

  3. Ease of use

Design Solutions

Brand Creative, Components, and Mockups

Explorations & Ideations

We brainstormed Potential Web features, LayoutS, & Themes to Help Align With User challenges.

During the exploration, I delved into various web features that could enhance the user experience base on our prior research. I pondered over where to place the search bar, considered different content layouts, fine-tuned filtering capabilities, accessibility compliance, and brainstormed ideas for an aesthetically pleasing and welcoming theme, all with the aim of creating a modern and user-friendly browsing experience.

Some of the recommendations given by the stakeholders were: modern with minimalistic approach, bright backgrounds & whitespace, subtle roundness on UI elements, big readable headings, real-life photography, thoughtful use of colors, focus on contrast, limited use of effects, and small details that are illustrated. While all were taken into consideration, we made our best judgement to align with what the research has shown to reflect the design composition and ease of use versus our own subjective biases.

Moodboard/Sandbox

Moodboard-Graphic-sm
FedFunl-Sandbox-Exploration-Collage-sm

Brand & Logo Design

Utilize the Double F’s As the Brand Identifier.

I went through quite a journey defining the logo – tweaking its composition, experimenting with angles and styles, and even playing with negative space. I showcased various logo options on a design board to help the team and stakeholders perceive them visually. After all these creative iterations, they finally arrived at a consensus. Together, we found a logo that not only looks aesthetically pleasing but also perfectly aligns with our brand identity.

First conglomerate of logos

Second iterations after selecting the logo

In this round of creative exploration, I crafted multiple compositions, played with various color arrangements, and experimented with typography styles. It was like putting together a palette of options, each with its unique charm. Once I had these variations ready, I assembled them on a design board. This allowed our stakeholders to take a hands-on approach, carefully selecting the options that resonated most with them.

Final Selection of the FedFunl Logo

FedFunl-primary-logo-horizontal-color
FedFunl-primary-logo-stacked-color

Design Guidelines

Creating A Brand Style Guide and Utilizing A Components Library HelpS Build consistency & Time efficiency with team Members.

With a tight deadline looming—less than two weeks to whip up wireframes and map out user flows—we leaned on Amplify’s UI Components library to give us a head start in the design journey. By utilizing these pre-built building blocks, we were able to hit the ground running and craft customized components tailored to the unique needs of FedFunl. It allowed us to maintain a seamless and harmonious UI, in perfect harmony with the pre-existing elements.

Mockups

Modern, Clean, And Aesthetically Pleasing.

A key element that was requested through our findings was having a clean, intuitive, accessible and easy to use platform that will generate a one-stop shop news aggregator for all government contracting information.

FedFunl-Design-Mockups-Collage-Image

Search & Content RetriEvAl at the forefront

A key feature of FedFunl harnesses AI-generated posts to swiftly provide real-time results, saving users from the hassle of sifting through irrelevant articles and perplexing headlines. This seamless process significantly enhances the user experience.

Click on the image to enlarge

Following Your Agency

Users can effortlessly follow an agency to stay informed with notifications and updates whenever a new article is posted. This ensures that users never miss out on important information.

Click on the image to enlarge

Easily View The latest Awards, Protests & Events

Articles are categorized by latest release and placed on top of the page, making it readily available for users to get up to speed.

Click on the image to enlarge

Sharing Is Caring

The sharing feature allows for the user to share directly to a colleague, team member, social media, or a friend by copying the URL link or by entering an email address.

Click on the image to enlarge

AI Generated Results

Through our admin dashboard, the backend AI facilitates swift and seamless data scraping and retrieval, letting users access to the most accurate and up-to-date news with minimal human-intervention. This eliminates any potential latency or long waiting periods, providing a smoother user experience.

Click on the image to enlarge

Mobile designs

While the intended use of the product was on desktop, I also designed the mockups for mobile devices and shared them with the development team for their consideration.

Deploy For Results

Design Handoff With Collaboration

Team Collaboration

We maintained constant communication between Design and Development through an iterative approach.

In our handoff sessions, we were in the final stages of making revisions while also handing off specific design sections to our developers for implementation. We took a detailed walkthrough of each page, explaining the interactions and functionality. Additionally, we ensured that all design notes and annotations were included, and stayed in constant communication to address any new stakeholder feedback and make necessary iterations.

Regrettably, due to changes in upper management priorities and a round of layoffs, development has been temporarily suspended prior to its’ release until we receive further notice.

Key Takeaways

Understand the industry and users in depth

The challenge of not conducting a thorough research is that it limits our ability to fully uncover the core drivers behind government contract work. Given my relatively new perspective in this industry, my understanding is still evolving, and there might be hidden factors contributing to user challenges that I haven't fully explored yet. I did however, continued my research in other competitors and was able to get a better grasp of how we can better align our users journey based on our previous discoveries.

A full design workflow establishment

Due to the time constraints, we hadn't fully developed our wireframes and some user flows in advance. This led to multiple meetings with the internal team and, unfortunately, some delays in setting clear deadlines. Fortunately, as we progressed, I was able to create a few additional user flows and mockup inspirations to help provide a clearer picture of the interactions that greatly aided the project's momentum.

Next Steps

If I were to complete this journey, I would be most excited about the prospect of making ongoing improvements to our existing features to enhance the overall user experience. My goals would include refining the onboarding experience, optimizing the profile settings page, and introducing small yet valuable additions like bookmarking. These enhancements will enable users to tailor their experience, staying effortlessly up-to-date with the latest contract news.

Special Thanks TO:

Skyward Interviewees

Kenny Tran | Head of UX Design

Daniel Kim | Lead Software Engineer

Previous
Previous

FOIAKit Web App

Next
Next

VES-Artex Website Redesign