The Oregon Theater Project
AREAS OF EXPERTISE
- Web Design
- User Interface Design
Tools
- Drupal 7-8
- Leaflet
- Adobe XD
GOALS
-
Generate a timeline map that would be easy to maneuver by students and research faculty.
-
Build out theater profile pages that included citations.
-
Allow researchers to maintain data integrity while using the website for student courses.
My Role
As the UX/UI Designer, I worked closely with developers to build out the map interactions, improve accessibility of the map timeline player, and integrate the maps into cities and theater detail pages.
TIMELINE DESIGN
The team worked with two professors to generate this digital humanities tool. While this tool would be used as a course teaching tool, they hoped to use this as a blueprint for future map-based archival research at other institutions.
The map and timeline were the biggest feature integrations. Previously, the theater website’s map was simply a Google maps that was not connected to the data. However, the newest iteration needed to be able to connect with the city it was from, and clearly show/hide map icons depending on the years of operation. Using Leaflet, we were able to build out a map and timeline that was dynamic across time. I tested this timeline, including reviewing across multiple browsers, and worked with the development team to ensure that theaters would cluster when zoomed out on the map, and that the timeline playback buttons worked as expected.
Content Type Design
Once we got to the theater profile page content-types, we had to build with flexibility in mind as there was an array of data that could be used for the owners/managers and known years of operation, due to the variance of data for each theater. The galleries were also an important feature, and were crucial since many of the theaters associated images were newspaper clippings, city planning maps, and archival data. We built interior maps to be able to keep the location persistent with the data, and parsed out theater details— such as managers and years of operation— in bite-sized sections alongside it.
Additionally, since multiple students could be working on one theater at a time, it was important for them to be able to see their own work history. I collabored with the development team to design the content-types, including adding the ability for students to see what content they’ve worked on within their profile, which was a new feature for the site that would help maintain the site’s scalability.
Outcomes
This project was initially going to be presented at Drupal 2020, but was cancelled due to the COVID-19 pandemic. However, the students from the first course using this tool presented their findings at the end of the term. All students spoke about the ease-of-use and intuitive nature of adding and editing theatres. In the future, the structure and main integrations of the website will be duplicated for other research faculty to be able to build their own map and timeline-based digital humanities sites.
More Projects
Hyland Solutions
Hyland Solutions was looking to enter the space for diversity consultation and conflict resolution. They needed a personalized website to promote their process, and a contact form that made it easy for clients to reach out and start their transformative work together.
UO’s Master’s in Psychology Program
The University of Oregon needed to implement a home for the new MS Psychology online degree program.
Requiring a recruiting tool for prospective e-students, they needed a build that would be scalable so that future online degree programs can be incorporated.
Psychology Duckling Database
The Duckling Database utilizes children, from prenatal to eighteen years of age, as subjects for psychological research. They sought to build a new database with coherent navigation, easy record-keeping and allocation, strong encryption and data security, and comprehensive administrative features.