True Fact

A busy lab simplifies how they organize and present their research.


Yale Human Nature Lab


Tech, IA, UX, Development


down arrow

01 Overview

The Human Nature Lab at Yale University is a well-known lab doing research on social systems, AI, social media, etc. Their work is wide-ranging and their website wasn’t presenting the findings very well. It was poorly organized, felt dated, and did a disservice to the importance of their work.

There was also a separate website for the head of the lab which contained a lot of duplicate content from the main lab site. This is problematic because when Google indexes the sites, duplicates tend to be ‘downgraded’ so to speak. They can lose ranking because the AI may interpret them as spam.

Finally, we wanted to implement a way to organize the data in the website for more efficiency of management. The main inefficiency was relating research publications, researchers, and areas of research to one another. The old way required entering the same information into multiple sections of the website which leaves a lot of room for error and makes updating that information a long and complex process.

02 Research

Both of the websites were built with WordPress, which is a great option for some websites, but for this one it wasn’t able to efficiently do the job of creating relationships between the researchers, the publications, and the areas of study. We needed to use something they would be able to update and manage easily and would be foolproof for adding new content since it is mostly handled by busy grad students.

I recommended a different content management system called Craft CMS, which has a great engine for creating dynamic relationships built in and has an easy-to-use interface for updating and adding new content. Ultimately, updating the website should be a nice break from research, not a dreaded task bestowed on the lowliest in the lab.

The graphic designer for this project also wanted a highly custom design that would emanate the prestige of the lab. This meant a lot of custom design work, background videos, and other design elements that would be difficult to implement within the framework of WordPress. Craft gave us the freedom to build something completely custom from the ground up.

Moving from WordPress to Craft CMS.

03 Implementation

To create these dynamic relationships, we need to have three pieces of content in place—the researcher, the publication, and the area of study. Each of these pieces of content exists independently of each other. For instance, I can view an individual researcher’s bio page, read an individual publication, and read about the area of study. Additionally, when they publish a new article, they can dynamically add which researchers worked on the publication, pulling from the existing researchers listed on the website.

Now that the researcher is connected to the article, that article can be dynamically pulled into that researcher’s individual bio page since they are related. Similarly, when they add a publication or a researcher, they can select which area of study that item belongs to, and those will both dynamically pull into the description page for that area of study.

Relational Model

Relational Model

Relational model among researchers, publications, and research areas.

We also needed to combine two sites into one and reorganize the new site to clarify what was the priority of the content. We used Google Analytics to track which content was the highest priority, and we needed to keep most of the content online for reference purposes.

After analyzing the Google Analytics for both sites, we created full sitemaps of both the primary lab site and the head of the lab’s site and reorganized both into a single sitemap for the new site that would prioritize the most commonly viewed and searched-for content, and ultimately narrowed the sitemap down to four primary navigation links, giving a top level overview of the lab’s primary focuses while still keeping all of the priority content highly accessible.

Final Site Map

Final Site Map

Revamped site map of HNL integrating two sites into one.

We also decided to use longer, single scroll pages for each of the four primary sections to provide all of the context for that section in one location. It also generally helped with the flow of the content. This map demonstrates the proposed page flow and relationship between pieces of content.

Flow map demonstrating the single scrolling pages and their relationships to other sections

04 Results

Human Nature Lab website on desktop and mobile.

HNL Homepage

HNL People page

Schedule a Chat

Ready to get started? Schedule a time for a 30-minute chat! It's quick and painless, I swear!