At Wellright, I was primarily responsible for designing the user interface for its web and mobile products (plus any associated elements, such as e-mail templates) and building HTML/CSS frameworks based on my designs. Eventually, I also became responsible for drafting specification documents for mobile projects.
Although most of my designs for Wellright are confidential, I will post what I can here and try to paint a clear vision of my process. As the only designer at Wellright, I had a strong influence on the direction of each product’s UI and UX.
Before I came aboard, the company implemented designs based on PowerPoint mockups. The results were acceptable for an MVP but in dire need of improvement if the company wanted to scale.
I began each assignment by researching similar designs amongst competitors or similar industries. I enjoyed using Pinterest and Dribbble to track my favorite (and least favorite) styles. I would use elements from various designs to inspire an end product that was very much my own.
Since Wellright operated in sprints, we would meet weekly to review my progress. Initial meetings usually involved demonstrating low/medium fidelity mockups or prototypes to the product manager and CEO. At the time, I preferred to design in Adobe Illustrator, so I would often use Invision or Flinto to share my work. If the duo approved, I would move on to designing high-fidelity designs. The next week, we would repeat the process until the design was considered “good enough” to implement.
If the designs were for a web product, I began building HTML/Sass frameworks, which I would ship to the core development team upon completion. The development team would incorporate my framework into their backend systems.
If the designs were native to mobile systems, I would draft a specification document and send it to the Android or iOS developers for implementation.
Redesigning our weekly e-mail was my most challenging project. Given the fractured nature of e-mail rendering engines, I had to spend weeks researching best practices and testing my designs on a multitude of e-mail clients. Microsoft Outlook, on its own, could render the same e-mail differently depending on whether it’s rendering engine ran on Word or Internet Explorer. Gmail displayed e-mails different between web and mobile (and even between different versions of Android). To say the least, it was a tedious process that I greatly enjoyed learning. The design was particularly challenging because we had to populate each e-mail with dynamic data. This meant that we couldn’t simply embed a JPEG into the e-mail (like some popular companies do, such as Fitbit and Apple).
An example of the final e-mail design can be found below.