- UI Design
- Web Application
- Angular
- Sensitive Data
2022-present
SBA-SBIR Data Reporting Portal
I helped make the SBIR-STTR grant management software easier for businesses and federal agencies to track their dollar amounts, solicit funding opprotunities, and visualize the success of their grants and awards.
In 2021, the total amount distributed was around $4 Billion from over 6,000 awards. This application manages the collection and display of award data to help businesses see their overall project funding and track commercialization. This same data is then reported to Congress to lobby for additional program funding.
Design Process
Discovery
Agencies and SBA wanted to preserve the current functionality of the SBA portal, but modernize the design and make it easier to track key data points.
We met with stakeholders to gather their wishlist of features, expectations for the modernization, and cohesion with other SBA products. Our team soon found out we had a unique situation - our client was a primary user of this system, in addition to small business owners and internal federal agency staff.
Findings
The legacy system didn’t follow consistent design patterns, have intuitive places to do financial reporting and solicit funding awards, or collect data consistently across multiple federal agency APIs.
The biggest value adds for the new product would be implementing a standard UI system, and providing better navigational landmarks so users didn’t feel lost. There was certainly frustration around the question of “where am I?”.
Ideation
We imagined a new system aligned with both the United States Web Design System (USWDS) framework and that had less ambiguous UI patterns. In addition, we crafted journey maps and worked with our business analysts to capture what the current system did, and how to best replicate it in the new one.
Constraints were evident in our resource allocation - engineers would be doing front-end development while building new APIs and search appliances for the refreshed main website (sbir.gov), so they were a big part of the conversations to inform our design choices and timeline.
Findings
Policy and agency language standards would be a big factor in our design decisions. The journey maps revealed solicitation development and getting data ready for reporting was a lengthy process. For adhering to the product development lifecyle, we had to be mindful of how much our design requests deviated from what USWDS could do out of the box for engineers.
Design
I spearheaded moving the project into Figma from another piece of software, and have been able to evanglize the concept of a design system to the product team. For future enhancements, we want to directly integrate our Figma components with our front-end build process and other AI enhancements for quicker prototyping. The researcher has also left the team, so I’ve taken over requirements gathering alongside our business analyst for future enhancements and design choices.
Findings
USWDS guided our initial decisions on the overall design, with customizations specific for SBA. I made it a habit to include engineers early on in the prototypes and before going to the client so there’s less ambiguity.
Still, shipping features quickly on a strict budget and timelines has been a challenge. This project taught me how to better negotiate features for priority, and calculate trade-offs in a fast-paced sprint cadence.
Development
In addition to my design duties I also write front-end component code alongside an engineer to increase efficiencies. This is in a CI environment with a well-documented Git process, and I’ve seamless integrated with the engineering workflow.
I was requested to take ownership of the HTML/SCSS sematics to ensure the interface is Section 508 compliant, has re-usable components, and matches the agreed upon mockups with QA testers.
Findings
The culture shift for engineers to get used to USWDS was a new challenge, requiring design diplomacy by way of working alongside them to write the code for each new feature set. Having a designer like me on staff who could code help saved us time, and got engineers thinking more about design systems and the importance they have on product launch successes.