Soul of Athens

Soul of Athens

Explore 2018’s Soul of Athens

What is Soul of Athens?

Soul of Athens is an annual multimedia project, run by students in the School of Visual Communication at Ohio University. The project serves as a the semester-long capstone project for Interactive Design students, where the class divides up into teams and creates interactive long-form documentary stories. The finished project is the 2018 Soul of Athens, a collection of four stories created by four teams that encompass the Athens community.

Our team took picture day very seriously.

The Team

Working in an Agile work environment, students are placed into groups to create a long form interactive documentary story in 12 weeks. My role on this team is Lead Developer, focusing on the build, UX and interaction of the site.  Check out my talented team’s portfolios: Michael Johnson, Noelle Taylor, Daniel Linhart, Nick Oatley, and Nadeen Ali.

Tackling How to Tell DJ’s Story

Our team is focusing on DJ Fuller – a yoga instructor and mother to 8 adopted children (yes, you read that right). DJ’s goal of adopting these children was to remove them from their substance-abuse families and bring them to the Athens community to cultivate a new opportunity. Her story is broad, with multiple aspects of her children, her TRE yoga experience and why she moved to Athens all weighing the same in importance of the story. Because oft his, we decided to create our story into three succinct, stand-alone sections:

  • The Children – serves as an introduction to the family. Introduces the members of the Fuller family, including the eight children and her husband, Lyle.
  • The History – DJ’s past of living in a substance-abuse house and how her past motivates her to create a better life for her children. Explaining to readers DJ’s original living situation in Portland, Oregon, adopting these children in Oregon, and moving to Athens, Ohio.
  • The Future – how these children have interacted with the Athens community and where they will go from here. Now that many of these children are about to be 18, will they stay in the community? Will they move out and progress somewhere else? What will DJ do in the future once her children have moved on?

Our team is working in an Agile environment, where our team focuses on weekly sprints to generate content, adapt our style guide and build our site at the same time.

Preliminary sketches

Preliminary Content Flow Chart
Group Wireframe

User Testing Feedback

Our team had two major phases of user testing.

First User Testing Phase – Focus of UX/Structure of site, all FPO Content

  • People felt like the “Next” and “Previous” pages were different stories, all three pages didn’t feel unified.
  • Needed indicators to scroll down, people assumed the entire video was the only thing on the page.
  • People were not seeing both the breadcrumbs and menu at the top.

Moving forward from user testing results:

  • Larger emphasis on motion within site, such as fade ins and transition left to right between pages to feel like someone is still inside story.
  • Make style within pages more unified, to understand it’s a chapter or continuation of the story.
  • Make top navigation indicators larger


Second User Testing Phase – Content placed, focus on understanding of story and any other UX/Design holes

  • Users don’t understand topic of story until reading through “Children” section of story
  • Some users missing down arrow on full-screen videos, not scrolling down to see more content
  • Users don’t know what to do once they reach the third and final section

Moving forward from user testing results:

  • Create word indicator to “Scroll Down” and make more promiment
  • Make titles and menu more prominent
  • Add audio and small descriptor line at splash page so users have a background understanding of the site before entering
  • Link third and final section back to Soul of Athens homepage

Third User Testing Phase – Focus of Final Site, All Content Finalized

  • Users attempting to click on Scroll Down button when there’s no action added to the button
  • Users stated too many focal points on first section of inside pages – don’t know where to look at it. Too many entry points of where to go next.
  • Users don’t know what to click on footer – not enough spacing in footer, too many links

Moving forward from user testing results:

  • Take “Scroll Down” text and add down arrow button that is clickable and brings users to content
  • Take “Next” and “Prev” arrows and place them only at bottom of page, that way users scroll through to the end of page
  • Take some links of footer, add more spacing between groups of text, don’t have links underlined in text but just slightly bolded