Case Study
Bringing improved excitement to the college news publication
— Background & Overview —
The Daily Emerald, the University of Oregon’s independent student-run news publication, needed an updated creative direction and marquee changes to its website, to increase engagement and respectability within campus and Eugene, OR.
As the Digital Editor/Web Developer for the 2021-2022 school year, I redesigned and revamped the Daily Emerald’s website and oversaw the digital team.
My Role
Digital Editor / Web Developer
Practices
Web design, UI design, User research, Front-end dev (HTML, CSS), Analytics, SEO, Site mapping, Testing, Hiring and leading a team of 3
Duration
July 2021 - June 2022
Team
3 - Digital Editor (myself), Junior web developer, 2 website content curators
Rikiya's passion to improve the Daily Emerald's online and digital presence was outstanding. As the Emerald's digital editor and web developer, he learned an entirely new CMS system and dove into the backend to improve everything from the navigability to increased engagement. He gives 100% effort, is an excellent leader and would be a great asset for any company or team.
Bill Kunerth, Emerald Media Group President and Publisher
Digital initiatives with constant turnover rate
The fight for independent news to keep its place in the community is increasingly evident nowadays, as major news publications have essentially formed an oligopoly.
The Daily Emerald is known by almost every student—and alumni—from the University of Oregon. Over 60% of the Daily Emerald's website traffic unsurprisingly comes from mobile devices, but traffic was decreasing due to an inconvenient and ugly mobile experience.
The people who were previously in charge of the Daily Emerald's website had little to no web design or UX experience, so the website was a mess in many ways.
Severely outdated CMS
The website is run through a severely outdated CMS called BLOX CMS by TownNews. The Emerald Media Group (overseeing the Daily Emerald)'s budgets were tight however, and the platform is rigid but meant to be "easy" to use for college newsrooms, so they stick with it.
But the CMS's issues consisted of...
What do students at UO want?
Because the Daily Emerald's only particular rival was The Register Guard, another Eugene-based news publication, I decided that another optimal approach is to research other college news publications that use BLOX CMS.
The University of Washington’s student-run news publication, The Daily UW, the quality of their site compared to the Daily Emerald’s site were about the same. There were some features that they did better including sections/widgets for their student housing listings as well as weather; but a lot of their content on their homepage was disorganized and lacked clear hierarchy.
I got a lot of visual design inspiration from indirect competitor news companies such as Associated Press, Vulture, E! News, Mashable and Complex, to try and cater our site to younger audiences.
After and during continuous research, and seeing how much we can do with what BLOX CMS gives us, I figured that these should be the biggest goals with fixing up the Daily Emerald’s website:
1. Reorganizing ad appearance on mobile view
To make the website’s mobile view more cohesive, I reorganized the ad blocks by evening them out. Ads appearing consecutively made the mobile view previously look cluttered, as it decreased SEO performance and made people not want to scroll down more. Fixing this was a massive priority and accomplishment.
2. Homepage design consistency for desktop view
The biggest thing to clean up and edit on desktop view were article sections on the homepage. I decided to replace the top stories carousel with a static 5-article Top Stories block—1 large top story and 4 stories under—that not only looks better given BLOX CMS’s design settings, but improves the initial view of the homepage. The four general article sections—news, sports, arts & culture and opinion—were previously laid out inconsistently on the homepage, so I gave each of them the same, consistent horizontal layout. I even decided to add a mega menu for the top navigation bar, so people can easily access all recent articles regardless of what page they are currently on.
3. Consistent content curation
When I hired my two website content curators early during winter term, their primary roles were to organize and manage articles for the four general article sections. Articles on the homepage were updated twice a day every weekday (one person per AM or PM), based on article relevance and engagement. Giving the website’s content curation more consistency was key to generate more engagement based on when someone first opens the homepage.
4. Interactive hover icons
To add a cool feature, I designed and implemented interactive hover icons for the homepage with coding help from my team’s web developer; these were inspired by the ones displayed all over Vulture’s website. Hover icons are usually easy to implement for more modern website platforms, but knowing how rigid of a platform we were using, implementing these took many trials and errors but thankfully came through at the end; these icons add a younger aesthetic to the website, which is exactly what I was going for.
5. Unique Special Sections Stories layout
The editor-in-chief for the Daily Emerald emphasized how she wanted weekly special section articles to be designed uniquely from regular articles, so I decided to take another step and redesign special section articles by going into the back end using CSS. These special section articles are different via typefaces, font colors, background color and unique photo layouts throughout each; this is to make the reader even more engaged with the special section articles compared to regular articles that get published much more frequently.
.jpg)
6. "Read More Like This" CTA feature
Arguably the most important feature I added is the “Read More Like This” feature that displays after the end of each article, automatically curated based on an article’s specific section. This helps cut bounce rate significantly by making sure people can easily continue to read more articles once they’re done reading one.
Overall, I believe I did a great job of revamping the Daily Emerald’s website throughout my time at the EMG, and this showed as I won the Ryan M. Frank Innovation Award for the 2021-2022 school year at the EMG awards ceremony.
The awkward white space problem turned out to be because ads abruptly change in height depending on the size of the ads themselves; the white space problem was unfortunately unfixable for desktop view, but thankfully this did not appear or bother people when scrolling through the mobile website.
This year-long project was what really immersed me into the world of UX, as I finally found what industry I wanted to go into for my career. This jump started my skill set and desire to design digital products to help others.
Rikiya's passion to improve the Daily Emerald's online and digital presence was outstanding. As the Emerald's digital editor and web developer, he learned an entirely new CMS system and dove into the backend to improve everything from the navigability to increased engagement. He gives 100% effort, is an excellent leader and would be a great asset for any company or team.
Bill Kunerth, Emerald Media Group President and Publisher
Giving trips to the gym a more simple, modern and welcoming feel
(case study coming soon!)
