Scott Ledbetter
Mockup of Marqeta Docs website A page of Marqeta docs describing a digital wallet provisioning process

Marqeta docs

Marqeta offers a flexible API that businesses and innvoators can use to issue payment cards. With a robust API comes the need for easy to consume information and documentation. For this project, my team and I redesigned the Marqeta documentation site – prioritizing consumption of knowledge for developers leveraging the platform.

Role Design lead When November – March, 2019 Company Marqeta Explore the docs
Process wireframes for Marqeta Docs project Low-fidelity wireframes were used to iterate quickly with stakeholders

We stuck to low-fidelty artifacts in the early stages of the project – to go over ideas quickly and to keep our options from being limited. It was essential to include the breadth of people who would be consuming the end-product in the design process – technical writers, onboarding specialists, and payments developers.

Code snippets in both dark and light mode

We entered high-fidelity design with clear alignment on what it is the team would be building. Early exporations inspired us to make the content fun and engaging, with features like light/dark togglable code blocks and animated lightboxes for technical diagrams and imagery.

Technical illustration from Marqeta Docs

We worked with our technical writing staff to revamp the site's documentation diagrams in paralell with the product redesign effort. The emphasis was on clarity and consistency, which was accomplished with a minimal brand palette and stripped down visuals.

I paired heavily with the front-end developers on my team to ensure our desired product design quality was met. This also allowed us to collaboratively solve those smaller, unexpected problems that often occur during implementation.

I designed this experience to be fluid across screen sizes. We leveraged native device behavior for functionality like select menus to create an integrated, familiar experience as various browsers continue to evolve. The site collapses into a simple one-column view on the phone to make the consumption of guides and documentation foremost.

Three iPhone mockups of Marqeta Docs on mobile The mobile documentation experience

Back to recent work