Interaction Design - COVID

2020-12-13

Studying computer science AND design can sometimes feel like the absolute worst position to be in. You're constantly aware of the typefaces in advertisements, whether an application is using Electron or not, and at times overwhelmed by all the things in that world that could be tweaked to be better (An absolutely objective opinion, ha).

Sometimes, a class assignment will actually line up with one of these moments of a need to improve something. In this particular case, I'd been 2 weeks in to Northeastern's COVID response. It is filled with ;lots of testing, wellness checking and results checking. But...They're. all. in. different. websites. It's painful. To make it even worse, as a user of Little Snitch, VPN user, and cookie/fingerprint blocking at the highest setting, I always have to login and do 2FA. And as a faithful user of 1Password, I have long non-memorable passwords.

Naturally, there's an extreme desire to design a single location for all things COVID related at Northeastern. While I was unable to implement it, the design is quite functional.

These 2 screens are the ones I'm most proud of. Simple yet information dense with gradual complication.

  • When we're tested at Northeastern, the two things we need are our ID numbers and QR code saying we're safe to come to campus (no symptoms).
  • The ID in the first screen is chunked in to no more than 4 numbers at a time, making it easier to remember.
  • The status of your last test is front and center with nice big, bold text letting you know the result you care about
  • Similarly, the lab results list is folded to just show date tested and result. But, it can be unfolded to reveal all of the data related to the prescription.

View Full Prototype