Michael Harper

UX and Product Designer

DIVA Collections Rebuild


After redesigning the DIVA Collections area in 2013, the platform began to gain more popularity and visibility in the academic sphere. Several items in DIVA Collections began to draw traffic from social media sites and it soon became apparent that the DIVA backend needed to be rebuilt to meet the needs of the modern web. We realized that this also gave as an opportunity to substantially improve the service for users and collection owners alike. With this in mind, we began the process of rebuilding DIVA from the ground up.

Working directly with the developer team, I provided user experience design, user research, and guidance on responsive front-end web design. Requirements were approved by a stakeholder group including university IT directors, users who hosted DIVA collections, archivists, and museum professionals.

Initial Planning

It was important for me to consider the core requirements of current DIVA Collections while also letting my imagination see where we could expand our offerings. I began research by engaging with collection owners and seeing where DIVA wasn’t meeting their current needs. I sketched out how they envisioned their current workflow and what they desired from their workflow in OmniGraffle. Following these meetings, I paired with our digitization technician to interview users and potential users, such as university librarians, and faculty who could incorporate DIVA items into their curriculum. Working with DIVA’s lead developer, we began to re-imagine DIVA as a three application suite covering the three basic cores of DIVA: collections management, curation of digital assets, and public display.

Workflow with boxes describing each step in the proposed process. This early pass began to place portions of collection owner's workflows within our larger understanding of the 2016 DIVA suite. Subsequent workflows would begin to reveal the complexity of application we were tackling.

Ingesting and Describing Items

We established desired functionality and began creating wireframes to experiment and test where that functionality would live. We focused on these wireframes in workshops resulting in fast iterative designs in Balsamiq, Adobe XD, and Adobe Comp. These wireframes were quickly built into prototypes in Balsamiq or HTML to begin testing with stakeholders and the wider DIVA team, where our ideas were challenged and stretched further.

It became clear that the process of digitizing an item, uploading it to DIVA, and describing it would be the core functionality loop most users would be visiting. When you upload a video or a photo to most sites, you provide a name and basic metadata in the same step. But how does that workflow scale to hundreds of items? Working through our prototypes with archivists and museum professionals, it became apparent that more flexibility was needed in when these tasks happen.

Digitization of physical objects often happens in large batches over days. This lead us to determine uploading should be a step on its own, allowing a large collection to ingest a large quantity of items at once. Then DIVA could offer tools to enter metadata as a secondary step. This also meant that the person digitizing an object didn't need to be the person describing that object; a volunteer could digitize multiple items and a subject matter expert could come in later to add accurate descriptions.

New Functionality

One desire we heard from all our DIVA Collections users was the desire to better curate their own collection. Early planning began on an exhibition tool, where collections could feature media responsively and to be easily shared on their own websites and social media pages. We also began to investigate an plan to provide messaging tools like newsletters for collections to engage with visitors.


Ultimately this would be my last project at San Francisco State University, as I would move to southern California for family reasons. Despite this, I remain confident that I provided a strong user experience foundation for future designers to build on top of. SF State recently released the finalized DIVA collection redesign. Though I no longer have access to the backend where the majority of my user experience would have made an impact, I can see the effects of my decisions on the public interface as well.