Untitled%2Bdesign%2B%25285%2529.jpg

Guru

Mobile App

Guru: Classroom Engagement Concept

2018 • 2 Week Project • Prototyping Techniques Course

Overview

Guru is an app that is similar to stack-overflow for the classroom. The app is designed for students and professors where students can ask, upvote or downvote, and answer questions and professors can monitor the questions being asked, favorite student answers, and provide their own answers. The goal of Guru is to create a place where students can learn and share their knowledge and professors can monitor and check-in when necessary.

My role

UX Designer


THE PROBLEM

How might we create an inclusive communication platform that encourages participation, helps answer students questions in the open, that fosters a dynamic and collaborative learning environment?


RESEARCH

Interviews

I started off by asking current students and graduate students what technologies they use not only to get in contact with professors but also the types of discussion boards and class forums that they are a part of. I got some very interesting feedback. One student said that he loved using Slack to communicate with professors and students because the app was so seamless. Another student who is in law school mentioned that her professor made all students post their questions on a discussion board because the professor felt like it was only fair for the entire class to know answers to questions asked, not just the students who asked the question. Some of the students I spoke with mentioned that at times they are reluctant to ask questions because they are afraid of seeming unintelligent or asking too many questions. 

Next I spoke with two professors, the first was a law professor and the second was a Portuguese professor. The feedback I got from them was that many times different students ask the same questions and primarily contact them via e-mail. One professor mentioned that she would be interested in giving extra credit to students for answering questions.  

Bulls Eye Diagram

bulls.png

Creating a bulls eye diagram helped me distinguish the main features of the app from secondary and tertiary features. The pink post-it notes at the center represent the main features, the blue post-its are secondary features, and the green are tertiary. 

This exercise helped me think through a minimum viable product and to prioritize what was most important.  This was especially useful to do before before I began the wireframing process.


DESIGN PROCESS

Wireframes

After conducting interviews and putting together the bulls-eye diagram, the next step in my process was creating digital wireframes using Balsamiq. I tested out the application, making changes based on the feedback I received. Testing the wireframes helped me solve any problems with the functionality of the application before it was designed and prototyped. 

Student interface (Alternate 894f).png

High-fidelity Prototype

When I finalized the wireframes I began designing the mobile app. The app has two interfaces, one for student users, and the other for professors. When the user logs in with their Cane-ID, if they are a student will be logged into the student version of the app, and if they are a professor they will be logged into the professor version.

student2.png

Student Interface

professor.png

Professor Interface


PROTOTYPE

After designing the screens I created a prototype of GURU on Invision.