Those 3 Little Words (Part 1)
Skive was building an edTech platform where university students can create and share flashcards for group studying. The good news was that students didn't seem to have much trouble creating flashcards once they got to that point: the problem came one step before that.
Study materials were organized by university courses, and it fell to the students to add courses to the platform as it was impossible to automatically track every university's schedule. Once a course was created, students could then contribute flashcards to share with their classmates. But given the community size, only a relative few were creating courses; in a semi-social platform driven by user created content, it was causing a serious content bottleneck.
Business Goals
1) Increase the avg. number of students who click 'Add a Course'
2) Increase the avg. number of students who successfully added courses
3) Increase the avg. rate of courses being added
To tick off the low hanging UX fruit, the first question is, did students even visibly notice the option to add a course? Considering the scale, placement, and boldness of the dark purple, "Add a Course" button's design, I was inclined to believe students were seeing it, but assumptions are dangerous, and given the high correlation between mouse and eye movement, heatmaps are much more concrete.
Ok, students were definitely seeing the "Add a course" button, but most were just hovering over the option, while a select few were decisively clicking. Why? To figure that out, you have to take a step back and tackle any prior assumptions, beginning with - did students even understand what the button is for? It was unclear how students expected to use the platform, so no one could tell me "yes" with 100% certainty. This is also something no analytics platform can tell you. So after coming up with an additional 15 or so questions to map out motivations and perceptions about the platform, itself, I recruited 9 students, and interviewed each of them for about 20-30min over Skype.
When pinpointing whether students understood what the "Add a course" button was for, the tricky part was that, paradoxically, I could not simply ask, "Have you ever added a university course?" At least, not initially. By asking straight away, in cases where the student might not have known what it was for, it would have given them information they could not unlearn.
Instead, I started by asking,
"Who adds the university courses?"
The unanimous consensus was,
"Um...students, I guess."
This was the correct answer (woohoo!), though the fact they weren't confident meant Skive could do more to set their expectations, upfront. Still, the students knew adding courses was up to them, which meant they had to know that somewhere on the site was a way for them to do it, and meant I could objectively follow up with,
"Have you ever added a course?"
For a minority, the answer was "yes" and it wasn't particularly hard. For the rest, the answer was "no".
"Why?"
"It's too much work." (User Perception of the Problem)
Keeping in mind these students may have never actually, literally clicked the button, and therefore wouldn't know how many steps came after:
"Why? What do you think happens?"
"I think I'd have to add all the content, upfront. That's a lot of effort, and I don't have that much time."
"If I created a course, I'd feel responsible for it, and I'd be afraid if there was ever anything in it that could be wrong or mislead other students, even by accident".
Problem: User Side
Misaligned expectations
Students think by adding a course, they are responsible for adding all the study materials (they weren't), which should not contain errors (yes, but materials are moderated by the community, so it's a group effort, not any one person's responsibility).
Meaning the primary pain point for the design was:
Problem: Business Side
Students are not clicking the 'Add a Course' button because they are intimidated by what they think comes next.
How do you make a button less scary?
I can hear some of you already - change the color! Different font! Make it round! Add a smiley! The thing is, when you enter an elevator, after glancing to one or both sides to see which panel the buttons are on, you aren't pausing to ponder, "My, what an exquisite backlight color." or "Oh goodie! A serif font, my favorite!" You've already pressed the button and barely gave any conscious thought to even that. So when the UX Researcher in the same elevator turns and asks, "What do you think of these buttons?" you'd probably answer something to the effect of, "They're um... very round?", maybe exiting early to escape the weirdo obsessively asking in-depth questions about buttons.
None of the students I interviewed were art or graphic majors (or offered similar critique), I'm certain I had not accidentally managed to interview 9 porphyrophobes, and not once did anyone express an overwhelming aversion to san-serif fonts; style-wise, there was nothing wrong with it. It's easy to suck ourselves down the rabbit hole of visuals, but from the lens of interface design, the important part was that the button was demonstrably recognizable as a button, i.e. something that you click; so UI-wise, there was nothing wrong with it.
Remember, the students were focused not on what the button looked like, but entirely on what they thought would happen next.
The Root of the UX Problem
Students are not clicking the 'Add a Course' button because the only information it offers somehow implies a lot of difficult, upfront work.
This was a matter of instruction mixed with marketing; I argued phrases like, "Add a course", "Create a course", "Course creation" and the like were too broad and vague. More importantly, they reflected the interviewees own words when discussing (and identifying) their apprehension. The fact students weren't clicking meant they did not believe there was actually only 1 or 2 more clicks afterwards. Above all, the "Add a course" functionality wasn't even about adding a comprehensive guide. Rather, it created a bucket name for adding and organizing study materials, later.
This is what I recommended:
By changing the label to "Add Course Title", I argued the process became much more approachable. "Title" implies only a single, short line of text (that's easy, right?), implied we wanted the official, university reference of the course (naturally, we wanted to avoid things like - The Bestest Course EVERLULZ!) and was accessible given the fact most students knew off-hand the names of all the courses they were currently enrolled in.
The Results
+30% click rate in the next week, alone.
Those 3 Little Words (Part 1)
Skive was building an edTech platform where university students can create and share flashcards for group studying. The good news was that students didn't seem to have much trouble creating flashcards once they got to that point: the problem came one step before that.
Study materials were organized by university courses, and it fell to the students to add courses to the platform as it was impossible to automatically track every university's schedule. Once a course was created, students could then contribute flashcards to share with their classmates. But given the community size, only a relative few were creating courses; in a semi-social platform driven by user created content, it was causing a serious content bottleneck.
Business Goals
1) Increase the avg. number of students who click 'Add a Course'
2) Increase the avg. number of students who successfully added courses
3) Increase the avg. rate of courses being added
To tick off the low hanging UX fruit, the first question is, did students even visibly notice the option to add a course? Considering the scale, placement, and boldness of the dark purple, "Add a Course" button's design, I was inclined to believe students were seeing it, but assumptions are dangerous, and given the high correlation between mouse and eye movement, heatmaps are much more concrete.
Ok, students were definitely seeing the "Add a course" button, but most were just hovering over the option, while a select few were decisively clicking. Why? To figure that out, you have to take a step back and tackle any prior assumptions, beginning with - did students even understand what the button is for? It was unclear how students expected to use the platform, so no one could tell me "yes" with 100% certainty. This is also something no analytics platform can tell you. So after coming up with an additional 15 or so questions to map out motivations and perceptions about the platform, itself, I recruited 9 students, and interviewed each of them for about 20-30min over Skype.
When pinpointing whether students understood what the "Add a course" button was for, the tricky part was that, paradoxically, I could not simply ask, "Have you ever added a university course?" At least, not initially. By asking straight away, in cases where the student might not have known what it was for, it would have given them information they could not unlearn.
Instead, I started by asking,
"Who adds the university courses?"
The unanimous consensus was,
"Um...students, I guess."
This was the correct answer (woohoo!), though the fact they weren't confident meant Skive could do more to set their expectations, upfront. Still, the students knew adding courses was up to them, which meant they had to know that somewhere on the site was a way for them to do it, and meant I could objectively follow up with,
"Have you ever added a course?"
For a minority, the answer was "yes" and it wasn't particularly hard. For the rest, the answer was "no".
"Why?"
"It's too much work." (User Perception of the Problem)
Keeping in mind these students may have never actually, literally clicked the button, and therefore wouldn't know how many steps came after:
"Why? What do you think happens?"
"I think I'd have to add all the content, upfront. That's a lot of effort, and I don't have that much time."
"If I created a course, I'd feel responsible for it, and I'd be afraid if there was ever anything in it that could be wrong or mislead other students, even by accident".
Problem: User Side
Misaligned expectations
Students think by adding a course, they are responsible for adding all the study materials (they weren't), which should not contain errors (yes, but materials are moderated by the community, so it's a group effort, not any one person's responsibility).
Meaning the primary pain point for the design was:
Problem: Business Side
Students are not clicking the 'Add a Course' button because they are intimidated by what they think comes next.
How do you make a button less scary?
I can hear some of you already - change the color! Different font! Make it round! Add a smiley! The thing is, when you enter an elevator, after glancing to one or both sides to see which panel the buttons are on, you aren't pausing to ponder, "My, what an exquisite backlight color." or "Oh goodie! A serif font, my favorite!" You've already pressed the button and barely gave any conscious thought to even that. So when the UX Researcher in the same elevator turns and asks, "What do you think of these buttons?" you'd probably answer something to the effect of, "They're um... very round?", maybe exiting early to escape the weirdo obsessively asking in-depth questions about buttons.
None of the students I interviewed were art or graphic majors (or offered similar critique), I'm certain I had not accidentally managed to interview 9 porphyrophobes, and not once did anyone express an overwhelming aversion to san-serif fonts; style-wise, there was nothing wrong with it. It's easy to suck ourselves down the rabbit hole of visuals, but from the lens of interface design, the important part was that the button was demonstrably recognizable as a button, i.e. something that you click; so UI-wise, there was nothing wrong with it.
Remember, the students were focused not on what the button looked like, but entirely on what they thought would happen next.
The Root of the UX Problem
Students are not clicking the 'Add a Course' button because the only information it offers somehow implies a lot of difficult, upfront work.
This was a matter of instruction mixed with marketing; I argued phrases like, "Add a course", "Create a course", "Course creation" and the like were too broad and vague. More importantly, they reflected the interviewees own words when discussing (and identifying) their apprehension. The fact students weren't clicking meant they did not believe there was actually only 1 or 2 more clicks afterwards. Above all, the "Add a course" functionality wasn't even about adding a comprehensive guide. Rather, it created a bucket name for adding and organizing study materials, later.
This is what I recommended:
By changing the label to "Add Course Title", I argued the process became much more approachable. "Title" implies only a single, short line of text (that's easy, right?), implied we wanted the official, university reference of the course (naturally, we wanted to avoid things like - The Bestest Course EVERLULZ!) and was accessible given the fact most students knew off-hand the names of all the courses they were currently enrolled in.