Project Overview
Role: Design Lead
Team: Doreen Tenenblatt, Jenny Park, Peter Kim, James Walsh
Timeframe: 2 Weeks
Platform: Webapp
Tools: Sketch, InVision, Photoshop, Whiteboard
ClasscCalc is an app that has the functionality of both a graphing and scientific calculator. ClassCalc has the ability of locking students onto the calculator while taking a test, thus replacing high-tech calculators costing up to hundreds of dollars.
Our objective as a team was to redesign the teacher panel on the webapp and create a smooth and seamless experience for teachers.
Research
Surveys
I conducted a survey to better understand our demographic. Where do they travel, how do they get there, how much money are they spending, and what is most important to them when buying their ticket. The major findings were that most people took a plane or car when traveling over 200 miles within the US. The other being when most people purchase plane and train tickets they first take a look at cost and then time.
Interviews
Click to Enlarge
Synthesis
AFFINITY MAPPING
Flow
-
Confusing steps from marketing page to teacher panel interferes smooth flow
-
Multiple contents one page disrupts teachers to have a smooth flow
-
Teachers demanded more intuitive flow of the Teacher Panel
Content Hierarchy
-
Multiple contents in single page violates content hierarchy
-
Teachers requested contents to be organized and easily noticeable
-
Teachers were unsure of available features.
Research
INTERVIEWS
"I like that the look and feel was clean."
"For software like this I expect it to tell me what it can do and what the features are."
"During a test, I would want the teacher panel to be the majority of the page, not the graph."
"How do I preview the custom calculator?"
*preview button currently does not work
FINDINGS FROM TEACHER INTERVIEWS
From these findings and interviews we conducted an affinity map to see what we must and should include on our redesign.
Learnability
-
Teachers expected contextual help and tips to guide them through use of Webapp
-
Demanded intuitive help page
-
Teachers like the tutorial videos
Aesthetics
-
The majority of opinions about visual design came from ClassCal stakeholders (blue)
-
Teachers thought the design was clean and simple
REDEFINED PROBLEM STATEMENT
How might we help redesign the teacher panel and dashboard to improve learnability through contextual help and improve content hierarchy for current and future users?
Ideation
FEATURE PRIORITIZATION
*Improved sign in flow was out of scope
Design
PAPER PROTOTYPE 01
We conducted A/B test to determine which paper prototype worked for teachers.
Our pop out icon was not intuitive enough for teachers and left them confused.
We needed clearer iconography and terminology on global navigation.
MID FIDELITY
The client informed team that there is more than one calculator that teachers will be able to use on the webapp.
The home icon on graph confused users about its functionality.
The copy on the tutorial modal and pop ups needed clarification.
PAPER PROTOTYPE 02
Our teachers wanted a separate page for account settings.
The teachers felt the whole process was intuitive.
Our teachers wanted to have a basic knowledge of functionalities prior to starting a test.
HI FIDELITY
The copy elements were too small and difficult to read.
The student calculator was not intuitively understood.
The visibility of start test button on teacher panel was too low and hard to notice.
Next Steps
BUILD IT OUT
The UX team met with the client and presented the deliverables. The client informed the team that the changes will be made as soon as possible.
EXPLORING MORE
Allow teachers graph to be displayed on the student app for instructional purposes
Ability to have the teachers' custom calculators to be usable on the student view page
Redesign the marketing landing page
