SSOLoginPageMockup-ShortTerm_NewPattern.jpg

Content Search Page

Content Search Page

Responsibilities:

Mockups & interactive prototypes; conducting informal qualitative research and formal usability testing; working with developers on final styles; etc.

Timeline:

Early 2018 to late 2019

Other Contributors:

John McNaughton (original Courseware interface design); Karen Burkhart & Hugh O’Donovan (assisted facilitation of informal usability testing)


In early 2019, company leadership decided to update the teacher interface of Study Island, after years of encouragement from the UX team. The interface had gone through visual updates over the last few years, but no significant navigational changes. Powerful features continued to be added without reconsidering the hierarchy and layout of the interface, leading to a product that was often difficult for new users to adapt to.

ContentSearchLive3.png

As the UX lead on this project, I began with some competitive research. At the same time, we waited for results from a card sort and a tree test that I had created & sent out to educators. Since the issues were mostly navigational, the card sort was very helpful with the grouping of features. The primary goal of the tree test was to see where our users had the most trouble finding what they were looking for.

Based on the research results, I began working on the new information architecture. Once we had something we felt good about as a team, I began work on mockups. Shortly after starting, I was asked to try to model the interface after our newly updated Courseware product, which was designed by John McNaughton. You can see comparisons in the screenshots below. However, by the time we went live, we had moved away from this design.

Once the mockups were in a good place, we took printouts of the static screens to ISTE (an educator conference) for user feedback. We were also prepared with some lightly interactive prototype, but due to time constraints, were unable to use them.

I made changes based on what we learned at ISTE and continued by building out a more robust interactive prototype. I then wrote a script for formal usability testing, and facilitated it.

Based on the usability tests, we made changes and began the process of planning for development. The company decided to roll it out in a phased approach. The development team decided to use a framework that had less flexibility than they usually did, so I collaborated closely with them to ensure that the experience remained intuitive and the visuals remained appealing, even if it could not match my original mockups.  

Due to new leadership and priority changes, this project was put on hold indefinitely after only one page was developed. I am only able to show screenshots here of what has already been released.

A screenshot of the open card sort we conducted to help with the Information Architecture

The information architecture we decided on based on our research

A very early wireframe mockup with general ideas of what could go where; this was to facilitate conversations

The screenshot I referenced from our Courseware product, designed by John McNaughton

An early mockup based on our Courseware model; this is the one we took to ISTE for feedback.

The final protoype for the content search page (topic view)

The live version of the content search page (topic view; colors changed after feedback that it was too much blue)

The final protoype of the content search page (resource view)

The live version of the content search page (resource view)