process

  1. Overview/Background
  2. My Role
  3. UX Research
  4. Research Findings
  5. Ideation
  6. Hi-Fidelity Mockups
  7. Takeaways

Digital Workbooks

đź’» Product Design, UX Research, UX Design, UI Design

🛠️ Figma, Sketching

đź’Ľ UI and UX design of a brand new product concept for a customer

🗓️ 2.5 weeks

Overview/Background

In late 2020, amidst the ongoing uncertainties of the COVID-19 pandemic and its impact on primary education, our team was approached by a long-standing sales representative to collaborate with BJU Press, a key customer in the EdTech sector. The objective was to conceptualize a digital workbook that closely mirrored the seamless experience of a traditional physical workbook. The project generated significant interest due to the growing demand for adaptable educational solutions during this transformative period.

This project has been white-labeled to ensure compliance with NDA requirements. Certain aspects of the research have been omitted for confidentiality. For further information, please feel free to contact me.

My Role

Collaborating with one designer colleague, I actively contributed to every stage of the design process. This included conducting research, developing personas, creating use cases, gathering design inspiration, and producing mockups. Despite a tight timeline of just 2.5 weeks and balancing other ongoing design responsibilities, we delivered a solid design concept with room to grow.

UX Research

Since direct interviews with BJU Press representatives were not possible, we developed a set of targeted questions for our sales representative to relay, allowing us to gather insights into how their educational resources were utilized.

We also drew inspiration from ongoing UX work aimed at enhancing the flagship ActiveTextbook reader, which provided a strong foundation for our design approach. Additionally, BJU Press supplied us with sample elementary-level math, English, and history textbooks, enabling us to closely examine the materials used by teachers and students.

screenshot of physical page for elementary school level math

Example homework questions from the textbook resources that we were provided.

Research Findings

  • Teachers and students both need an optimized tablet and desktop experience.

  • It’s preferred to have SSO functionality with other publishers like McGraw-Hill.

  • Annotation features are limited if books from external sources instead of books that we have rights to.

  • For younger students, the goal is to preserve the tactile nature of handwriting and maintain the spirit of engaging, hands-on exercises. For older students and teachers, the focus shifts to streamlining the learning experience with customizable, accessible features that cater to individual needs. Teachers should have a clear view of student progress, enabling them to identify and support those who are excelling or need additional help.

  • Workbooks would also need a functionality where they can be shared between teachers, as we realized that sometimes two teachers will teach a blended class of different grades (i.e., grade 6 and 7).

  • Students would likely be working on school-assigned iPads, while teachers could work from an iPad, laptop, or desktop computer.

💡 How might we create a hybrid “phygital” textbook experience that balances the tactile benefits of handwriting with the efficiency and accessibility of digital tools?

Ideation

Because of our limited time, we shifted our focus on creating a MVP of a workbook builder and how the student experience would look like, as close as possible.

  • Demonstrate automatic grading exists (specifically, it saves time).

  • Offer manual grading when needed.

  • A way for teachers to see student progress.

  • Digitized workbook that keeps the spirit of learning objectives.

  • Communicate that unique digital opportunities exist for the future.

Subjects that the workbook would support:

  • Language learning workbooks

  • Math/Chemistry/Physics

  • History

Teacher Personas

Teacher Job Stories

  • New Student Inclusion: When a new student joins my class, I want to include them in an ongoing assignment and set an extended due date, so that they have a fair chance to complete the work without being penalized for starting late.

  • Returning Student Management: When a student returns to class after a long absence, I want to include them in an ongoing assignment, set an extended due date, and manually override missed assignments grades with an “exempt” status so that their progress is accurately reflected and they can focus on current work without undue stress.

  • Student Withdrawal Tracking: When a student leaves my class or school during an ongoing assignment, I want a way to track their departure, so that my records remain accurate and I can manage assignments effectively.

  • Group Assignment Adjustments: When changes occur to a predetermined group during a group assignment, such as a student changing groups, joining a group, or leaving due to withdrawal, I want to reallocate grading as needed, so that the group’s performance is assessed fairly and reflects the updated dynamics.

Student Persona

Student Job Stories

  • Balance Between Physical and Digital Experience: When I am completing assignments in a digital workbook, I want the questions to maintain the clarity and intent of those in a physical workbook, so that I can focus on understanding the material while benefiting from a streamlined and engaging digital experience.

  • Instant Feedback on Knowledge: When I complete a practice worksheet in the digital workbook, I want to receive instant feedback on my answers, so that I can immediately understand my strengths and identify areas where I need improvement.

  • Enhanced Learning Through Digital Features: When I am working through a digital workbook, I want to engage with question types that paper workbooks cannot support, such as interactive listening exercises, so that I can deepen my understanding through varied and dynamic learning methods.

  • Preserving Learning Objectives: When I use a digital workbook, I want it to align closely with the learning objectives of the physical workbook, so that my educational experience is consistent and effective without unnecessary adjustments.

  • Disputing Grades: When I believe my grade on an assignment is incorrect, I want a way to dispute the grade and provide justification for a review, so that I can ensure my work is evaluated fairly and any errors are corrected.

Low-Fidelity Mockups

The idea is to explore the toggle state for input tools from a student view on an iPad or equivalent tablet. There is the ability for typing input as well as handwriting input. The student can erase or undo their input, mark certain questions as “teacher help needed”, and search for different parts of the homework, jumping to results.

screenshot of lofi mockup of student view UI

By default, the pen tool is unselected so that the student can focus on reading the page

screenshot of lofi mockup of student view UI with the pen tool selected for use

Clicking once on the pen tool icon will display its tools.

When the student gets their results, they can see if their teacher wrote specific comments beside incorrect answers. Then, they have the option to accept the grade or dispute it if they think they were incorrectly graded by the teacher.

screenshot of lofi mockup of a teacher commenting on a student's incorrect answer

From the student view, they can see the reasoning behind their incorrect answer and dispute it if they feel it was unjustly marked incorrect.

Hi-Fidelity Mockups

The teacher would create a workbook assignment by choosing among the classes they teach, selecting the applicable workbook, then selecting the appropriate chapters or units.

hi fidelity UI of assignment creation process in teacher view

Teacher view for assignment creation through the class portal. Teachers can choose segments of their textbooks and the question types.

Students would then complete the workbook assignment and submit it before the deadline.

student doing homework in the digital workbook

Student view of homework in progress - students will typically work on school-assigned tablets or laptops.

Once the deadline has passed, the teacher is able to grade the current workbook assignment. In their web app portal’s People page, they can see the students in their class and how well they had performed in previous assignments. This can help the teacher gauge who is most likely to need supplemental assistance with the current assignment. Once the teacher is done grading, they may release the grades to the class.

grading table for a teacher's class showing scores of each student

Students who have asked for help on certain questions will have those questions tagged as "help requested". Lower scores will be highlighted to identify which student is in need of help.

During the grading process, the teacher can toggle on and off the answer key to compare student responses with the expected responses. Some question types (ie. multiple choice, multiple response) can be auto-graded by the system while other question types (ie. short answer, longform) are meant to be graded by the teacher. Typically, any question with input where students draw will need to be manually graded.

grading table for a teacher's class showing scores of each student

The highlight on the page scrubber at the bottom shows the page range for the current homework. For the scope of our timeline, we only considered fixed layout textbook pages. Management of highlight size changes for reflowable layout books will be a future item.

Takeaways

This project required significant work within a constrained timeline.

If additional time had been available, we would have explored how the nuances of different school subjects could inform distinct design elements and features. Furthermore, we would have delved into ways teachers could leverage class analytics to enhance their instruction and monitor student progress.

Future iterations of the digital workbook could include:

  • Randomized Questions for replicable practice, enabling students to reinforce their knowledge through varied exercises.

  • Semantic Insight Marking to analyze question types students struggle with, track time spent on tasks, and provide actionable feedback.

  • Teacher Collaboration Features allowing synchronization between teachers managing the same homeroom class, particularly useful in elementary and middle school settings.

  • Support for External Books, accommodating scenarios where overlays or direct integrations are not feasible.

  • Extended Accessibility Features for Students, accommodating a greater breadth of student needs including but not limited to Dyslexia-friendly typefaces, reading ruler tools, customizing page zoom level, integrations for students with English as a foreign language, etc.

These enhancements would broaden the workbook’s functionality and further support diverse teaching and learning needs.

Back to Home