UX & Product Designer
LabReport.png

Weekly Newsletter Web App

 
 

Lab Report

 

Ah, the company newsletter—an institution at many workplaces, yet often the last thing on people’s minds. When I found out that Viget’s weekly newsletter, the Lab Report, had been largely untouched for the past 15 years, I knew that I wanted to give it some attention. 

This is the story of how I revamped the presentation and editing process of the Lab Report to better fit the flow and needs of modern-day Viget.

 

Challenge

Understand how the current Lab Report (compiled and shared as a Google Doc) fell short in catering to the needs of modern-day Viget, and improve the experience in terms of content, format, and editorial process. 

Solution

After much research, I redesigned the report so it better conveyed weekly happenings to staffers. Specifically, the redesign made the content more engaging, organized, and navigable; relied less on text; and allowed past content to be accessed and searched. 

Results

As an interactive web app, the new Lab Report design is easier to navigate and parse. Content is organized and curated. Finally, the design capitalizes on past reports by aggregating important happenings and drawing trends. 

Role

I researched and redesigned the Lab Report during my UX apprenticeship at Viget in 2015. I conducted all of the research, UX design, visual design, and user testing—building up to a final presentation where I presented my insights and recommendations to company stakeholders. 


 

Note: Due to the confidential information in the report, the content of some deliverables in this case study have been replaced. 

Process

Over the past 15 years, Viget’s weekly Lab Report has remained largely unchanged. At the time of my project, little research had been conducted on how the report was created or consumed. 

 

An excerpt of the Lab Report from 2000, when the team was six people.

An excerpt of the Lab Report from 2015, when the team was 67 people.

 

Understanding the Report Through Research

In order to identify problems and areas of improvement, I first needed to understand how Viget staffers engaged with the current report.

I surveyed 55 Viget staffers (an 82% response rate), conducted seven user interviews, and analyzed five years’ worth of reports. I came away with a broad understanding of how the Lab Report was used, and realized that the original product intent of the reports (to inform and orient the staff) was not being fulfilled.

 
 
 
 

Identifying the Problems

At this point, I grouped the problems into three main categories:

  • Content. Generally speaking, the Lab Report did not fulfill readers’ desires for timely, relevant, engaging information. There was a disconnect between the amount of time editors spent on certain sections, like project updates, and what was actually consumed by readers. 
  • Presentation. As a Google Doc, the report was very text-heavy and somewhat unpolished. Readers reported that reading it felt more like a chore than an enjoyable experience. 
  • Historical information. Past reports were archived and forgotten, but that content still had the potential to yield rich insights and trends that could be useful to the company.

Research-Based Personas

I determined that people played one of four primary roles when engaging with the report: readers, editors, curators, and leaders. People could, and usually did, play different roles at different times, but these four roles encompassed all of the main interactions with the report. I created personas based on these four roles to guide the rest of my project.

 
 

 

Defining Goals

I then outlined the four goals that I wanted to achieve with the redesign:

  • Make the Lab Report more engaging
  • Prioritize content unserved by other forms of communication
  • Present a more unified message and voice
  • Make past Lab Reports more useful

Brainstorming and Ideation

At this point, I began brainstorming design solutions. I mocked up elements that I believed addressed the problems that I had previously identified.

 
dream_total.png
 

Design, Test, Iterate

I created and tested four designs in total. During each iteration, I incorporated the testing insights from the prior iteration, so I was consistently building toward a better product.

Some of my early sketches of the report.

Design Studio

A design studio is a group brainstorming session where participants sketch, share, and iterate in order to explore various design directions and come up with new ideas. While it’s usually held at the start of a project, I held one in the middle to inject fresh perspectives and energy into my project. The design studio was held remotely with participants across Viget’s offices. It worked out so well, I wrote a guide on how to moderate remote design studios for Viget’s website

 

We explored five design challenges in our design studio.

 

Advanced Prototyping

I wanted to illustrate and test complex interactions that would reflect the end product as closely as possible, so I prototyped in code using Framer.

 
Grouped content moves as a unit.

Grouped content moves as a unit.

Content displayed as masonry-style cards.

Content displayed as masonry-style cards.

Content displayed in a grid.

Content displayed in a grid.

 

Usability Testing

I conducted thorough usability testing on each of the prototypes. I looked for patterns in each round of testing, and applied the findings to the next iteration.

 

Insights from my first round of research.

Insights from my second round of research.

 

The Redesign: What Works

Interactive elements and a clean presentation make the report easier to read.

The redesign strives to turn reading the weekly report into a more enjoyable experience. The entire report is shorter and more cohesive. Certain elements, like polls, are interactive, inviting the user to take part in the experience. My research showed that Viget staffers generally found that these aspects made the report more engaging, enjoyable, and easier to read.

 
 

Visual cues make it easier for readers to grasp the main points.

Delineated sections and tags help convey the most important information quickly. Content is curated, and text is paired with visuals when possible.

 
 
 
 

A fixed navigation bar tracks progress and allows for quick navigation.

The redesigned version is easily navigable and skimmable. All weekly content is presented in a single, skimmable view, and a fixed navigation bar makes it easy to skip to specific sections. Usability testing revealed that readers could effectively navigate the report.

A historical view aggregates and analyzes past reports. 

Finally, this design allows users to dive deeper into individual projects by viewing content from past weeks. Eight out of 10 people preferred this redesign to the current Lab Report, in large part due to this solution.

 
 
 
 

The Redesign: What Needs More Research

Equally as important as drawing trends from testing results is identifying where trends do not emerge. I determined that more research needed to be done around these topics:

Community Engagement

The discussion between staffers that takes place around and on the report is essential to the experience. The redesign supports commenting on individual cards, but not specific lines and phrases as in Google Docs. Testing results showed that users believed card-commenting was sufficient, but commenting is a tricky behavior to assess with a prototype. Will my findings hold up in actual practice? 

Continued Interest

Users said they felt more engaged viewing the redesigned version of the report, but will they continue to feel engaged week after week when they are not being interviewed?

 

Results

By the end of six weeks, I created a web app prototype and redesigned Google Doc version ready for implementation. I put together editorial and development plans for each design so I could leave my colleagues with a comprehensive product.

I presented my work and recommendations to company stakeholders, including the co-founders of Viget. My work was largely well received, and I am happy with the work I completed. While this project is far from finished, I was able to deliver actual products and plans for implementation. I look forward to seeing how my work will improve the future of the Lab Report.

You can explore the InVision web app prototype below or by navigating here. You can explore the interactive prototype created via Framer here