Network for Applied Technology (NAT) Account Pages

It’s been great to volunteer with NAT, not only to gain UX and product management-adjacent experience, but to be part of a not-for-profit who is working towards helping early innovators use emerging tech to solve complex problems. The volunteers I work with are largely undergraduate students or recent new grads, and it’s great to see what they’re learning to do already!

My UX Design role is on NAT’s Tech team, where I share design work with one other UX Designer who has since joined, and we are otherwise working with software developers. Currently, the other designer and I are working on a desktop and mobile redesign of NAT’s member portal, which is where event or program attendees, partners, and other stakeholders register and can take part in other aspects of NAT’s offerings.

Current natPortal.

As you can see, the current natPortal doesn’t have the best layout, with pages that have blank sections or an imbalance of text. It also doesn’t have all features that the future natPortal will be capable of.

natPortal home page
natPortal page with an empty section
natPortal page with imbalanced text

Sketches.

After checking out the current natPortal when I first started in March 2025, I brainstormed potential layout ideas with sketching. As I got feedback on sketches from my Tech team lead, I made adjustments, and was then given a go-ahead to start bringing these to life with Figma prototypes.

Homepage paper wireframe
Paper wireframes of multiple webpages
Paper wireframes of multiple webpages

Figma Screenshots.

After I started making medium fidelity prototypes, a second UX Designer joined our team, and conversations amongst folks from other teams led to some pages’ development being paused. We also had to navigate a rebrand, where I changed our sticker sheet, header fonts and the primary pink colour across all pages. Because my approach is flexible, I was able to overcome these challenges in stride.

Otherwise, we have gotten great feedback from our team lead and the Marketing lead throughout this redesign. This project has now entered its next phase, where our Tech team members are using the Figma mockups to start coding and bring this redesign to life.

Two medium fidelity desktop prototypes
Medium fidelity mobile prototype
Medium fidelity mobile prototype
Medium fidelity mobile and desktop prototypes
Medium fidelity desktop prototype
Medium fidelity mobile prototype
Medium fidelity desktop prototype
Previous
Previous

Bare Bones Solutions Website Updates