Sweet Sin Design

Assay Marketplace, which was part of ArcherDX that got acquired by Invitae Corporation. They send genetic tests to doctors, scientists, and medical personnels.

The goal of this project is to develop a new platform through which laboratories can review, customize, and order tests from Invitae. The platform was developed from scratch and fits under Invitae’s brand.

Team included a project manager, front-end director, one front-end developer, 2 back-end developers, and a subject matter expert. We worked in agile mode using JIRA and Confluence.

As the sole designer, I was brought on after the UX and user flow was already created. A conceptual design was already mocked up by a previous designer in Photoshop. I was tasked with bringing the design into Figma and also integrating Invitae’s brand guideline with Material UI.

Original brand color scheme updated for Material UI

With every project in Figma, I create a pattern library. This includes deciding grid, breakpoints, integrating Material UI components, creating new non-Material UI components, iconography not provided by client, buttons, alerts, and form UI. I also take this opportunity to create reusable components such as headers, footers, and popups.

Due to a fast turnaround time, planning a pattern library in advance hastens the project in the end when there are unexpected pages to be reworked or added.

As the site was designed and the client played with the mockup on Figma, new pages were designed outside the wireframe mockups. As an eCommerce designer, I introduced Customer Experience into the “ordering” of genetic tests. Not only did the site have to make sense to a professional medical personnel, it needed to be easy for sales personnel, who might not be as science-savvy.

Thus introducing a user journey much like a simple shopper, the site was made into simple steps: