COSMIC, a NASA project

Role: Design, Development

Infographic about the COSMIC application suite. Lists features Engineering, Logistics, Documents, Activities, Event Planning.

COSMIC is a suite of web applications surrounding inventory management of the spacesuit. I work on these projects on an ongoing basis in my role as Frontend Engineer with MRI Technologies.

Spacesuits are complicated but they need to be reliable and safe. To that end, NASA and its contractors have procedures and processes in place to ensure that the suits are assembled properly and that parts are where they are supposed to be when they’re supposed to be there and in the state they need to be in.

I can’t offer too many screenshots as the applications are internal and contain some sensitive information but I can talk a little about their functions and their tech stacks.

But first, in the way of visuals, I had an opportunity to do a bit of design work and make a logo for COSMIC. Anyone who follows me knows I love both design and programming and although I’m better at the latter I like to partake in a bit of design when I get a chance.

I did a lot of exploration with type. The goal was to have something minimal but interesting. I landed on the possibly-overused-but-I-don’t-care-it’s-awesome typeface, Proxima Nova by Mark Simonson Studio. I couldn’t pass up the space reference. Proxima Nova also has a clean geometric look and feel that was well suited for this purpose. Its capital letter “O” is so round that I was able to sub it out for an actual circle stylized as a ringed planet (I’m trying to make the nickname “Cosmicon” catch on) and it looked right at home.

Here are some variations of the final logo.

Variations of the COSMIC logo. It’s uppercase sans-serif with the O character replaced with a line drawing of a ringed planet.

The COSMIC application

COSMIC is a data intensive application that revolves around the concept of hardware. Hardware can take the form of a high level specification like a drawing, or it could be a specific piece of inventory that has been assembled a certain way for certain purpose, or various stages in between.

Screenshot of Item Master manage page. Shows lots of metadata about the hardware such as drawing number, classification codes, and more.

“Hardware,” in general, can be thought of as the center of the wagon wheel of COSMIC and various other entities form the spokes around it. A piece of hardware can be part of an activity like an inspection. That inspection could produce a document like a discrepancy report. A piece of hardware could be used as part of an event like a spacewalk. An event can happen at a particular location. Information about many pieces of hardware could be aggregated into a report for management. Activities, Events, Documents, Locations, Reports—COSMIC manages these types of entities and more.

Its biggest feature is how it relates all the data together and shows you information that is relevant to you at the time, with lots of ways to see the data from other perspectives.

COSMIC also includes some smaller, separate-ish apps. In particular, the On Orbit Tracker, which manages data about hardware on the ISS and the related events, activities, and reporting that goes along with that.

The tech stack

Some of the smaller apps use different stacks but I will discuss the main COSMIC application here. And mostly the frontend since that’s what I understand best. It uses:

Some of this tech was new to me when I started in 2019 so it has been fun learning and getting better at it.[2] COSMIC is a large application and goes way beyond the obligatory todo list examples that you see in webdev tutorials. It has been interesting working with these technologies at an enterprise level and discovering some of the bottlenecks as we push some of these technologies to the limit (looking at you, webpack).

COSMIC Documents

COSMIC Documents is a sister application to the main COSMIC app. Space activity and everything that supports it requires a lot of paperwork. Paperwork exists for documenting processes, tracking broken parts and their repairs, and much more. COSMIC Documents is a system that tracks that paperwork as structured data. That means it’s searchable and presentable in different ways depending on the context.

COSMIC Documents provides a powerful feature called workflows, which is a way to define a collection of tasks that need to be completed with all the information that’s needed—what to do, how to do it, when it needs to be done, and who is responsible.

The documents are part of the COSMIC database, so they can relate back to hardware and other entities that COSMIC tracks.


  1. Something, something, Kubernetes. ↩︎

  2. I had been meaning to pick up TypeScript for the longest but never had a work reason to do it, until joining the COSMIC team. ↩︎