Mason's Projects

Broadcom's CAP (Client Authentication Pages) will likely look familiar to you if you've paid with a credit card online. These screens are used by payment processors to validate that a card belongs to the user making the purchase.

Our team was tasked with creating a configuration utility that allowed Broadcom users to create customized CAP pages for their clients; a process that usually requires editing server generated HTML pages by hand with a risk of overwriting crucial embedded scripts or causing styles to become out of sync over navigation to subsequent pages.

With close collaboration from the Broadcom team, we built a Node/Express, React, Postgres, and GraphQL application which allowed users to:

• Define a consistent style for a CAP workflow, including font style and family selection, color palette definition, heading images, and iconography
• Defining and displaying internationalized strings for arbitrary numbers of languages
• Configuring which screens should be available within a given workflow
• Defining custom JavaScript which should be included within a workflow
• Live previews of configured pages
• After everything is configured, export the built HTML/CSS/JavaScript flows to .zip files for distribution

All while adhering to the EMVCo 3D Secure UX/UI guidelines regarding screen sections and sizes.

In this yearly engagement spanning over 8 years, I built infographic style microsites to highlight the CDC Foundation's yearly achievements.

In what were previously plain HTML/CSS/JavaScript builds, I led the adoption of a templatized Next.js build for these projects, which drastically reduced the time to completion of each year's report.

My responsibilities included:

• Developing a reusable Next.js template, reducing total project completion time from 120 hours to ~60 hours
• Translating design specs into reusable componentry
• Collaborating with the design team to ensure we were making the most of our templatized build without sacrificing creativity
• Implementing transitions and animations for site imagery and content

Microsites like this are always fun opportunities to play with element and layout transitions, making what could be a static experience something with a bit more character. Moreover, I always love the opportunity to be a part of sharing the accomplishments of the CDC Foundation throughout the years.

In this engagement, I was embedded in Cohort Explorer scrum team for over a year to help accelerate the build of an application that allows healthcare providers to gain increased insights into patient cohorts.

As part of their team, I:

• Managed application state and side effects using Redux and Redux Saga
• Consumed REST APIs to build complex nested components
• Worked with designers, product owners, subject matter experts, and the development team to plan and build workable solutions
• Administered both architectural and visual decisions for the product

These types of product engagements are often my favorites, as I am able to gain some deeper insight into a single system, really consuming myself in the collaborative problem solving aspects of development.

In this project, I led the architecture and development of an AI enabled marketing strategy platform. Backed by the client's industry expertise, my team designed and developed a full-stack application that enables marketing teams of all skill levels to generate actionable multi-faceted marketing plans, as well as accelerate what were previously tedious marketing tasks.

Some of my responsibilities in this project included:

• Working with project managers to build a backlog and prioritize development tasks
• Working with designers to ensure that the client's vision was being met and exceeded
• Working with the client to gather requirements and show progress
• Architecting a Node/Express backend and React frontend MVP
• Researching and consuming OpenAI APIs in a multistage approach that balances cost and performance

Making use of OpenAI's APIs, I planned a multistep solution for providing contextually aware generative content from disparate materials. Since the user-provided inputs could be in an array of different formats, the solution needed to standardize them, cache them, and provide steps for user intervention in each step of the process. This also included built in feedback loops to improve content over time, reducing the amount of human intervention needed to provide quality results.

I love researching and refining ways to tackle new challenges while programming. This project is a great example of some engaging learning opportunities. Designing an AI workflow, exporting different document types using Quarto, and brainstorming interesting ways to filter and suggest data were all enjoyable aspects of developing this app.

This was a greenfield build, kickstarting the development of a headless CMS driven car buying experience which was ultimately taken over by an in-house team for longer term development and maintenance. I was responsible for implementing some static designs into a functional site consuming a Sanity CMS, which included:

• Rendering large sets of data with searching, sorting, filtering, and pagination
• Interactive elements, such as the budget calculator found on the home page
• Dynamic routing to car detail pages
• Interactive elements for the logged out experience, such as "liking" cars

New builds are great opportunities to try out new technologies and challenge your existing web development patterns. I find that every time I build a new application I discover at least one new takeaway to add to my development toolkit.

Kroger Chef Junior and Lowes DIY are event creation and ticketing platforms used to coordinate concurrent events over many locations. I led the architecture and development of this app along with a team of 4 developers, initially researching and validating the need for a custom solution, then planning and implementing an application that would meet the client's needs.

In a codebase that was reused and tuned for both Kroger and Lowe's clients, I planned and implemented:

• Simultaneous deployment of event registration forms for over 1,000 locations in all 4 US timezones, resulting in > 100,000 registrants for events per event day
• Location and date based search APIs consumed by external applications to drive users to register
• A Rails service pattern architecture for encapsulating business logic, ensuring that long running tasks could be run asynchronously and tested in isolation
• Registration payments driven by the Stripe API for a seamless payment experience, and the ability to issue refunds to users for cancelled events or changes of plan

Projects like this, in which I can walk into a physical location and see the results of my work are incredibly rewarding. In a lot of development engagements, you don't get to see real world people benefitting from your work.

For this project, our team was asked to rebuild a legacy data driven application for the Global Tobacco Surveillance System. Previously an SPA written in AngularJS 1.x, the client requested that we make the site more lightweight for researchers in developing countries with lower internet speeds, which we were able to achieve by:

• Converting the site to server rendered pages with Twig, reducing the amount of JavaScript needed to render elements to the screen
• Using Preact to write interactive components, reducing the asset overhead
• Using Webpack to chunk javascript files, further reducing JavaScript asset sizes
• Directly storing data which was once queried for, and establishing workflows for updating this data on a regular basis through large scale data imports

These strategies helped reduce load times by over 50%, ensuring that all users would see performance improvements.

Later in the life of this project, the content management backend was replaced with a cached GraphQL API, further reducing page loads and improving the developer experience.

Audits and rebuilds are tasks that I have taken on many times in my career. I really enjoy the process of finding bottlenecks and brainstorming solutions to problems like this. Code review/optimization and pinpointing bugs aren't the flashiest things you can do in software development, but can be the most satisfying.