Xometry: RFQ Process
Translating Figma designs to update the interface, streamlining the Request-For-Quote process, refactoring the codebase to React.
Role
Frontend Development Intern
Timeline
12 Weeks
Skills
User Flow
Design Translations
​
​
Tools
Javascript
ReactJS
Node.js
Figma
Team
Robert Sprung, Jack Ni

Internship

Project Focus
Xometry uses an AI platform to develop an online marketplace that connects clients with partners to source manufactured parts and assemblies.
Our work focused on streamlining the RFQ process which consists of the Manual Quotes workflow. Through this, Xometry staff sends quote requests to manufacturing partners on behalf of clients/buyers which can optimize the order and production.
​
As a frontend software developer, I worked along with other software development interns, a senior software engineer, product design interns, and a product manager. We communicated directly with product designers to work on design translations and design logistics. We also refactored the frontend repository in order to unify code and designs.
How can we simplify the staff user experience for efficient quoting?

The RFQ Process
Since the tool was mainly used by Xometry staff, but was created as customer-facing, there were several features that needed to be updated and re-evaluated. The RFQ form, Overview Page, and Partner Page was outdated and needed to be optimized for staff users. ​
​
​
Old RFQ Form

Old RFQ Overview Page

Translating Designs
We used Figma designs as a template to make the design changes and communicated back and forth with our product designers to confirm and discuss feasibility of designs.​
​

RFQ Form
The RFQ Form is more condensed and allows for staff to manually upload files. ​
​​​​
​
The form is now one page in contrast to the original three pages.
​​​​
​​​
We worked on the 'upload files' portion of the form to connect the frontend uploading to the backend file processing.


Overview Page
We worked on making the RFQ Overview page more organized with information on the left side and actionable items on the right side.
We also integrated information about the RFQ recipients from the backend repository to display on the overview page for users to be able to access directly.

Partner Tables
We worked on adding color coding as well as feedback flags for statuses when new information was submitted.
Refactoring the Interface

Throughout this process, we converted the initial interface rendering which was in Javascript to React. Our goal was to make each component more intuitive and organized within the quoting repository and backend repository.
​
We communicated across teams to edit and refine the codebase as well as modifying designs based on feasibility of connecting the previous codebase with the updated version.