Smartwork Mobile App
W.W. Norton Publishing Co.
Designed W.W. Norton’s largest digital product to be fully responsive for mobile and tablet, while additionally updating all elements with current Design System components and modernizing its interface.
Year 2023
Role UX Designer
Client W.W. Norton Publishing Co.
About Sequential Questions
Sequential Questions is a question type developed for Smartwork, W.W. Norton’s online learning assessment tool used by over one million college students and instructors.
Sequential Questions is a question type that was developed in direct response to a high-demand request from our chemistry team, along with college professors. They wanted a question type that would allow students to work through a problem in multiple, sequential steps.
Because this feature didn't exist in our competitors' platforms or in Smartwork at the time, we saw it as a major opportunity to strengthen our product and make it stand out. This new question type was built to provide instructors with a powerful way to guide students through complex, multi-step problems, ensuring they master foundational concepts that build from one another.
My Role
I was responsible for the end-to-end UX design for the new Sequential Questions question type. My work began with a proof-of-concept prototype and a review of research findings from a survey. The goal was to create a multi-step question that met the needs of three distinct user types: students, instructors who create and edit assignments, and the media editors who write the questions in the authoring management system.
My process began with an exploration phase where I drafted multiple design variations based on user stories. These designs went through several rounds of adjustments and updates with our Product Manager and Design Director, ensuring we were aligned on functionality, usability, and product needs. Once we finalized the designs, I created a high-fidelity prototype to present to the full Smartwork team and stakeholders for feedback. I then made further updates and applied the final visual design.
Once the prototype was complete, I passed the designs off to the developers. To facilitate this, I sent out a UI spec and uploaded visual designs to Zeplin. I also stayed on the project to help answer any questions and do a final Visual Quality Assurance (QA) check before the question type went live.
My Challenges
Challenge 1
Designing a Multi-Step Question into the Smartwork Framework
A major challenge for the Sequential Questions project was creating a new, intuitive student experience from scratch. Our goal was to build a multi-step question that seamlessly integrated with Smartwork’s existing functionality while also introducing new features and a unique navigation flow. The final product had to clearly communicate its new functionality and ensure students understood how to answer and navigate the question without being cognitively overloaded.
My Solution
To solve this, I focused on providing students with a visually clear design to distinguish a Sequential Question from other regular Smartwork questions. I began by designing a clear Start Page that explained the new question type and how to navigate it. I then added a prominent stepper at the top of the question and a question steps sidebar to communicate the total number of steps and the student's current progress. For step navigation, I introduced a new bottom bar with a clear border around the step content to make the multi-step nature of the question visually apparent.
Please note that the screens shown here represent a very small portion of the overall design work. I would be happy to walk you through the full prototype and provide a detailed walkthrough over a call.
Challenge 2
While the student experience required a new design, the challenge for instructors and media editors was integration. My goal was to create a straightforward process for them. Instructors needed to be able to seamlessly select, edit, and manage the new Sequential Question in their Assignment Settings. Similarly, media editors had to be able to efficiently write and build these complex, multi-step questions within the Authoring Management System. My designs ensured that the new Sequential Question was a natural and intuitive part of their existing workflow.
My Solution
To solve this, I focused on providing students with a visually clear design to distinguish a Sequential Question from other regular Smartwork questions. I began by designing a clear Start Page that explained the new question type and how to navigate it. I then added a prominent stepper at the top of the question and a question steps sidebar to communicate the total number of steps and the student's current progress. For step navigation, I introduced a new bottom bar with a clear border around the step content to make the multi-step nature of the question visually apparent.
Please note that the screens shown here represent a very small portion of the overall design work. I would be happy to walk you through the full prototype and provide a detailed walkthrough over a call.
Original Desktop Design
The current Smartwork desktop experience, relied upon by over 1million students and instructors, was the foundation of our responsive designs. Our goal was to preserve Smartworks’ core functionality and familiar workflows while allowing it to span across multiple devices.
New Responsive Design
The new mobile and tablet designs mirror the existing successful desktop experience, with the addition of thoughtful and research-backed improvements in accessibility and usability.
Throughout this project, I collaborated with engineers and product managers to ensure we had complete coverage of all product states, were aligned on business objectives, and had a successful handoff. For handoff, I wrote a UI Spec and designed hi-fi prototypes in Figma. These screens are currently in production and will be live for students and instructors to use by the end of the 2025 academic year.