In collaboration with writers, photographers, artists, and other designers, I designed and implemented a full scale news website to inform the UC Berkeley and Bay Area community about local environmental news. I helped lead initial research all the way to launch.
In 2023, Teresa Luo reached out to me about an exciting new project. She was part of a new student organization called the Environmentalist, founded by 2 seniors - Jeana and Jemma.
UC Berkeley had many news websites - Daily Cal being the main one. No newsites, however, focused on local environmental news despite the growing need for environmental awareness. From here, Jeana and Jemma had a new vision: A news website, similar to The Atlantic or the New Yorker, entirely dedicated to environmental news stories and multimedia.
As the colead designer, I led and drove all stages of research, design, and development, directly ideating and prototyping the designs being used today.
.gif)
A majority of the students we spoke to understood the gravity of environmental issues -- the issue wasn’t that. With all the immediate pressures in a student’s life: finances, mounting schoolwork, life pressure, there just isn’t enough time in the day to address climate change - a phenomena that was real, but often still felt like a distant looming cloud.
Not to mention, there’s only so much a single individual can do to address climate change, and where would one even start?
Like a reciprocal relationship, students need to feel like the content they read belongs to them. Content should be authentic, credible, and feel a sense of community.
In our observation activity of SF Chronicle, students were more likely to click on stories involving cities, communities, and weather events they had personal experiences with.
Students overwhelmingly reported that reading about positive community events contributed to their interest
.svg)
In line with our design goal of tangibility, I initially proposed a sidebar with environmental actions. However, upon talking with the other stakeholders of the magazine, the sidebar feature detracted attention and space from the purpose of the website -- sharing news stories.
Our current design features action items only visible upon clicking on a popup. Not only does this allow users to have more autonomy, but it also allows users to find curated, interest-driven environmental action ideas.
.svg)
We knew from our research that students valued authenticity from news organizations. We initially thought creating a section showing our personal environmental contributions would be inspiring and community-building. However, feedback indicated that this may come off as virtue signaling or bragging.
Our current design features descriptions of the team that explain the motivations behind creating The Environmentalist. Individual descriptions allow readers to know the team holistically.
Upon designing our first prototype, we organized articles in uniform horizontal rows and by category, such as in the New Yorker. However, this neglected the users we researched: students who need to be quickly engaged and won’t necessarily be regulars. The New Yorker’s user base is affluent, sophisticated, and regular readers. Because we wanted our new site to easily attract engagement for even non-readers, we knew we needed a change.
The final layout follows standard design layout of other news sites, playing with different hierarchies and layouts to attract attention. There is no longer a horizontal scroll, as we do not expect readers to put in that work.
Articles contain location-trackers and speaker spotlights to build that personal sense of connection so important for engagement!
Be given tailored, specific information on organizations, donation opportunities, and events to help the environment based on your own terms and interests.
We’re local! A majority of our viewership is coming Bay Area cities.
The average engagement time on our website is 83 seconds, compared to the median engagement time of 48 found by Hubspot.
I led tasks, educational workshops, and meeting launch deadlines. It challenged me to exit my comfort zone, finding ways to delegate tasks, teach complex web software (Webflow), and communicate with other branches and stakeholders in the organization.
Some of the slides I made to guide meetings.
The Design team was expected to take the content from 20+ photographers, artists, and writers and upload high-fidelity and well-edited screens on to the site within 1 week.
The Design Lead and I made the decision to ask for a 1 week extension for both issues published. Ultimately, it allowed us the right amount of time to properly design, prepare, and develop the article pages.
There were also many design goals that needed to be pushed back, such as optimizing typography for readability, creating category-based browsing, and more advanced CMS. But alas, that is all design!
While I am now graduated, I know Teresa will lead the design and development of the Webflow well, improving typography, layout, and other web development-related factors such as SEO. I had so much fun leading a project of this size.
