Notewardy Redesign

#UI/UX Design
#User Research
#Website Design

AI promoted study system for universities

Time: Jan 2023 - May 2023
Role: Project Lead, UX Designer
Tools: Adobe Photoshop, Figma, Miro

Background

About the Project...

This project is provided by Cornell University for providing practical real life opportunities to MPS students through collaborations with diverse companies.

Our project aims to enhance the digital learning experience. We designed interfaces with a feedback loop, focusing on intuitive reading and interactive question-answering capabilities.

Design Goal:

Problem:

The first part is a PDF reader with features like split display, highlighting, keyword organizer, Q&A chatbot, and automatic note generation.

The second part is a short answer function with AI-powered problem sets, smart hints, key concept explanations, and performance summaries.

How could we design a set of interfaces that incorporates a comprehensive feedback loop, with the goal of achieving the following objectives: 

1. Provide students with an intuitive reading experience;
2. Empower a thought-provoking question-answering process; 
3. Refine the product to align more with Notewardy’s vision and values.

Discovery

Competitor Analysis

We conducted an analysis of 7 products, focusing on their overall functionality and feedback loop design.

We found weaknesses in the current systems, such as difficulties in acquiring knowledge systematically, dependency on manual operation, overwhelming feedback, no real-time error detection, complex features, and a lack of student interaction and feedback.

However, these platforms also provide various easy-to-use tools, positive feedback, and recommendations based on user history, as well as clear highlights and informative pop-ups for selected content.

Literature Review

Our analysis has revealed that feedback loops can be designed to promote learning and performance improvements, regardless of the context.

Testing & Iterations

Low-fi Prototype

Part 1: PDF Reader

Key features for PDF Reader:

The first feature is the two view modes, skim reading and intensive reading, we have designed to meet to different user needs.

Another feature is the availability of different highlighting levels, which allows users to customize the color transparency of highlights to distinguish between different levels of importance of the content.

Part 2: Short Answer

Key features for Short Answers:

The first feature is the independent route for correct and incorrect answers, it allows user to view relevant concepts about the question on correct questions, while incorrect questions will additionally highlight the type of error.

Another feature is the afterwards summary, which allows users to track what they learned based on their performance and provide similar question for improve their understanding.

Usability Testing

We conducted 30 usability tests, selecting interviewees from various academic backgrounds to ensure that we received feedback from a diverse group of users.

What do we know from that?

For PDF Reader:

For Short Answer:

Final Designs

Uploading PDFs
Users can begin with the dashboard entry point, and they can upload their own PDFs to get start.

Highlights & Keywords
In highlight mode, users can creating new highlights, adding category tags and defining wanted keywords.

Chatboxes
When the chatbox mode is on, an interactive Q&A session will open up for the user to ask questions about the article.

Notes
In notes mode, a section with automatically generated and interactive notes will be displayed. Each part of the article are listed out with summarized contents.

Create Short Answer Questions
From the home page, students could create a new problem set, which will direct to the page for students to select materials that they want to have in the problem set. 

Smart Hint
In the situation where students had an answer that is closed to correct answer, we designed a feature of Smart Hint to provide students a bit help.

Key concepts
If students had a completely wrong answer, related key concepts will be identified and highlighted, with a button to easily direct student to the original sources.

Summary
After students completed all the questions, the system will provide a detailed analysis with progresses of different learning categories, timing information and try later function.

Reflection

This is my first time working on web design with clients and team members as a Project Lead. Originally, I thought it was roughly the same as what I do as a UX designer. While in the process of working, I discovered creating an well-planned agenda and communicating in a timely manner are the most critical to final success.

Of course, my UX and UI skills have been greatly improved in this project. I am happy to see that our clients are pleased with our final design and claim having a wonderful collaboration with us.

"You guys are doing an outstanding work, seeing the website are building up from the base to now is really impressing"

Andrew, Co Founder of Notewardy

Back to top