Public Performance Lab
People, Process, Praxis
How It Started:
The mission of the Public Performance Lab is to improve the performance of public, nonprofit, and community systems with data science and economic research. Dr. Jason Coupet is the Principal Investigator for the lab, leading a team of graduate and undergraduate students to conduct research that helps organizations serve communities.
Dr. Coupet wanted to create a website to house this research and inform communities and potential partners about their work and their team. Essentially, he wanted to create a public face for the lab.
As a data-informed and community-driven individual, I was interested in bringing this site to life and furthering the lab's mission.
Goals:
We established a few main purposes for the website,
To showcase the research students and to attract other students. In the future, embedding data, graphs, etc that will link to code and other info.
Creative ways to share researcher content (like a virtual portfolio).
Build a social media presence.
In time, another purpose would be established. Due to Dr. Coupet's eventual relocation, the creative team would not renew our year-long contract, so we would also
Build a framework for Dr. Coupet and other designers to contribute to/change the site in the future.
Notes from Sketchbook
From the Ground Up
As the head of media design and content, I was in charge of establishing branding guidelines and producing media assets for the site and social media. How do you build a brand? I started with a logo.
I was initially stuck on how to incorporate lettering instead of conceptualizing the mission of the lab. Mind mapping let me think outside the box.
Logo Ideation
How do you show the connection between community and data science? Through a lot of sketches and research, I found that centering people best established that concept. I wanted the logo to reflect the lab's goal of ultimately helping people in their communities. And I also wanted to reflect the ideas of connection, inclusion and diversity in the logo design.
The official logo has a colorful palette to symbolize that diversity. There are a few alternate versions also created for various graphic purposes, including a Wolfpack Red version for any NC State-affiliated research.
PPL Logo Red + Grey Edition
Branding: A Story In Color
Next came work on the site itself. I came up with a few options for a conducive color palette that the rest of the team decided on. I chose mostly cool tones with a focus on blue and grey to evoke feelings of serenity, intelligence, and trust in the audience. These colors also helped balance out the wide range of hues in the logo. Red accents would add pop and bring attention to certain elements.
The first batch of potential palettes
We narrowed down our options to this
acquiring Assets
One of the challenges was taking materials from many different people/sources of varying quality and getting it all to look cohesive.
Many of the site assets were attained and created during peak pandemic time, which meant everyone worked remotely. Throughout the process of building the site, I asked the lab's graduate and undergraduate students for any photos relevant to their research. There weren't many that could be found on hand. So, we worked with what we had!
Itsa Me!
Background ideation images
Everyone sent me their headshots to use for our Team page. Because they were all of differing quality, I edited them in Photoshop to look cleaner, more visually interesting, and coordinated. The filter was added to further disguise major gaps in resolution between photos and tie them all back to the site color scheme.
I came up with several different background templates for these photos, and we settled on the circle design as it represents unity.
Before
After
Site Mockup
Because there weren't a lot of photos to work with, I decided to create a mockup using one of Dr. Coupet's research articles to supplement some of the materials we wanted to include.
Photography
Another solution I devised to attain more images for the site was staging a photoshoot! At this point some of the Covid restrictions had loosened, so the graphic design team and Dr. Coupet got together to make it happen. I directed our photographer on which shots to take, and we determined the best ones to include on the site.
Fun Fact: This was our first time seeing each other in the flesh!
Being that the lab was based at NC State during this time, I also captured photos of NC State's campus. We used a photo of Talley, one of the biggest community hubs on campus, for our header, with an additional bank of images to use for future purposes.
There weren't many people on campus, but luckily I was still able to get some group shots at Talley!
Social Media
I established the Twitter and Instagram pages for the lab, both of which are under the name @PubPerformLab.
(It was actually a bit difficult to claim the same name for both sites...I went through quite a few different handles).
Building A Foundation
The graphics team knew that our time was limited. We wanted to create a framework for Dr. Coupet so that he could add to the site in the future. The site was constructed in Adobe Dreamweaver and we spent some time with him explaining its interface. We also walked through how to access the GitHub repositories, and the HTML and the CSS that compiles the site. The code includes comments to explain what's going on, as well.
We prioritized the site materials that Dr. Coupet wanted us to include first, and now he has the tools to build even further on what we all created!
