final report - 134.126.97.130134.126.97.130/students/jmuconnect.pdf · on study guides, and group...

53
Final Report: Jessie Bodner, Kiki Inman, Jordan McLellan

Upload: others

Post on 04-Aug-2020

0 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report:

Jessie Bodner, Kiki Inman, Jordan McLellan

Page 2: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Table of Contents:

Final Report December 2019//

01

Chapter 1: Executive Summary

Chapter 2: Problem Statement

Chapter 3: Related Work

Chapter 4: Design Process

4.1 User Research

4.2 Personas

4.3 Scenarios

4.4 Storyboards

4.5 Design Requirements

Chapter 5: Design Solutions

5.1 Brainstorming & Sketches

5.2 The Best 3 Concepts

5.3 Paper Prototype & Testing

5.4 Low Fidelity & Testing

5.5 High Fidelity & Testing

Chapter 6: Conclusion

References

…….………………….…..…..…………...…..…………..…..

...……………………………….

………………………...…….…....

02

02

03-04

……………………….……………….........

…….………..…………………..…….....

…………………………….…………….....…..……………..…………………..……..

………….…………..………….....………………………….……....

………………………….........

…………………………………......

…………………………....…......

………………..………..…......

…………………………………...

………………..……………………....……………………..…………………………...

.

05-25

05-16

17-19

20-21

22-2324-25

25-50

26

27-30

31-42

43-46

47-50

51

52

Page 3: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

02Executive Summary:

Chapter One and Two:

Design Problem Statement:

Our goal was to create an application to assist students in their everyday academic life. JMUConnect prides itself on being different from its competitors and brings resources right to its students. Our application allows users to create an account, build a profile, add classes, join groups, post study guides, and many more feature . Students will no longer struggle to find classmates and communication will be easier than ever. JMUConnect encompasses many features that student applications on the market today lack. After conducting user research, interviews and usability testing, we were able to create an application that our users found easy to navigate and contribute towards their academic success as a JMU student.

Students at James Madison University need to connect with other JMU students because it will directly improve their success in their classes and overall within the program. Students enroll into new classes each semester, sometimes without any clue of the difficulty of the class or who the professor is. Often times, it is required for students to use many different websites to ensure success within each of their classes. Many feel frustration about navigating to countless websites to find information and to gather study tools.Our goal is to combine all of these different web platforms into one overall system, JMUConnect. This is a community-based platform where students can interact with one another about classes, professors, and study guides. Students can post study guides and talk to one another via this application about course material, assignment due dates, and group projects. This app will also provide a platform for groups to collaborate on projects. This innovative application uses elements from Google Docs, Canvas, Quizlet, Rate My Professor, and Facebook Messenger to enable students to be more successful in their daily course material. The users for this application would be students across all majors at JMU. This application is part of the connecting category. For this project we are aiming to connect students with other students within JMU. Overall, by combining these different platforms, students will have an easier experience trying to stay informed and connected within their major. There has never been a platform targeting such a specific group of students, but the success of this application would open up doors for other majors to integrate their information as well.

Page 4: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

03Chapter Three: Related Works

Existing Work:

Research: Edmodo

Research: Quizlet

Quizlet aims to combat the issue of confusing and non-virtual study tools. This website is a study tool where users create virtual flashcards, participate in related games, and take practice tests. Quizlet allows for students to share their study sets, but lacks the structure to navigate to just JMU course flashcards. Quizlet does a good job at allowing students to connect with each other by sharing study guides. One thing quizlet doesn’t include, which could be beneficial if it did, is a messenger aspect where students can share their thoughts on study guides, and group study sessions.

Edmodo is a website that helps connect students with teachers and classmates. As well as helping students and teachers organize their school work. Edmodo does a good job at allowing teachers to use the site to post work, assignments, and grades for students to easily and quickly access it. One thing we want our app to emphasize that Edmodo doesn’t do enough of, is the connection between classmates.

Some different apps or websites people use to connect with other students are: Edmodo, Quizlet, Canvas, Google Docs, and StudyBlue. The issue with these platforms is that they don’t cater to all of the needs of the students. Edmodo is controlled by the educators, Quizlet doesn’t allow enough communication, Canvas does not allow students to connect unless the professor enables it, Google Docs allows for collaboration but not messaging, and StudyBlue is too broad. In conclusion, all of these different platforms play an integral role in the success of JMUConnect.

Page 5: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

04Chapter Three: Related Works

Final Report December 2019//

Chapter Three: Related Works

Research: Canvas

Research: Google Docs

Research: StudyBlue

Google Docs targets the issue of conflicting schedules and slow communication by allowing for students to share work and collaborate remotely. Google Docs has features enabling users to work on presentations and documents simultaneously without any lag in time. This app allows users to work on the same assignment at the same time which is very beneficial, the only downside is sometimes the app glitches when multiple people are uploading at once.

Canvas targets the issue of student-teacher communication. This site has been fully integrated into JMU to assist students and professors in posting grades, assignments, and announcements. Canvas is a professor-based platform and doesn’t allow for students to post or share information without permission from the professor. Canvas is beneficial in emailing professors, but a problem with Canvas is it does not allow you to easily connect with classmates.

StudyBlue is an application that helps students stay connected while studying. This app includes a study library with over 400 million flashcards, notes and study guides from students. You can make your own study guides to share, or search study guides from other students. This app does a good job with giving students a wide variety of study options. Our app wants to put a focus on specific departments inside a University to make the app more content specific and help students connect even easier.

Page 6: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

05Chapter Four: Design Process4.1 User Research:

Design Problem: Students within the School of Media Arts and Design (SMAD) need to connect with other

SMAD students because it will directly improve their success in their classes and overall within the program. Students enroll into new classes each semester, sometimes without any clue of the difficulty of the class or who the professor is. Often times, it is required for students to use many different websites to ensure success within each of their classes. Many feel frustration about navigating to countless websites to find information and to gather study tools.

Our goal is to combine all of these different web platforms into one overall system, JMUConnect . This is a community-based platform where students can interact with one another about classes, professors, and study guides. Students can post study guides and talk to one another via this application about course material, assignment due dates, and group projects. This app will also provide a platform for groups to collaborate on projects. This innovative application uses elements from Google Docs, Canvas, Quizlet, Rate My Professor, and Facebook Messenger to enable students to be more successful in their daily course material. The users for this application would be JMU students within the School of Media Arts and Design.

Define Users: The users chosen for this project are college or graduate students who attend/attended

JMU. We reached out to each of the users as they are either our classmates, roommates, or close friends. It was very feasible for us to find users to interview and we had no trouble accessing the users we wanted to reach. The primary target audience is SMAD students but we are also targeting college students within any major because we are expecting an expansion of our application to reach the entire JMU community. Six students participated in this interview process: three SMAD students, a health science major, a communications major, and an accounting graduate student. They are all from varying cultural and economic backgrounds. We chose our users because they would be our direct target audience for this application. These students need assistance in combining different platforms used in everyday scholastic life. Below is a breakdown of our interviewees.

Page 7: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

06Chapter Four: Design Process4.1 User Research:

Interview Process:The four out of the five interviews conducted were in person. Ester Jon’s interview was

conducted virtually via Google Docs. All of these interviews were conducted one-on-one where questions were read out loud and recorded via Google Docs word for word. The interviewees were asked questions either at home or on campus. We asked the interviewees where they do work most often and based on their responses we were able to conduct their interviews in the respective locations. Grace Waters was interviewed on campus at Dhall because in between her classes she sits there and works on her homework. The other interviewees: Courtney Gay, Ester Jon, Caroline Plashal, and Kaitlin Caesar all complete their homework most comfortably at home so this is where their interviews were conducted. Bryan Cohn is currently a graduate student living in Boston, Massachusetts and completed his interview at home where he lives and studies.

Interviewee Grace Waters

Bryan Cohn Caroline Plashal

Courtney Gay

Kaitlin Caesar

Ester Jon

Location DHALL Home (Boston)

Porch Study Area

Kitchen Study Area

Home Home

Major SMAD Accounting SMAD Health Sciences

SCOM SMAD

Date Sept, 16th, 2019

Sept, 16th, 2019

Sept, 16th, 2019

Sept, 16th, 2019

Sept, 16th, 2019

Sept, 16th, 2019

Time 2:11-3:45pm

8:45-9pm 4:00-4:31pm

7:25-8pm 9:40-10:10pm

7:30-8pm

Page 8: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

07Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 9: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

08Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 10: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

09Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 11: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

10Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 12: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

11Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 13: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

12Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 14: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

13Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 15: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

14Chapter Four: Design Process4.1 User Research:Interview Questions and Responses:

Page 16: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

15Chapter Four: Design Process

4.1 User Research:

After the interviews were conducted there were recurring user needs that were evident. For example, all interviewees said they would use the study guide, messenger, and rating professor features of the application. All of the users felt that if the messenger feature was normalized and all students used it, it would definitely be a useful tool. Caroline said, “ 100% yes I think it would feel super normal and be really helpful.” Also, 2 out of the 6 interviews felt as though having friends in class lowered their grade, but the majority of interviewees said they were more comfortable asking questions and their grades increased when friends were present in their classes. With this new application focusing on community-based learning, more students will become comfortable in the classroom overall. All of our users exhibited frustration with JMU’s current platform, Canvas. This frustrations stemmed from professor inconsistency with the site, limited student accessibility, and all said it was not as user friendly as they had hoped. Kaitlyn said, “ Canvas doesn’t have any contact information so whenever I try to email my teachers it’s so hard to find. And the same goes for contacting students in my classes.” All students said they would use a platform to rate professors to give insight to other students about the course and general information about the professor.

Interview Findings:

Page 17: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

16Chapter Four: Design Process

Data Analysis:

When gathering the data from the interviewees, we made sure to categorize each person with a different color. This way each interviewees responses would be organized under each question. We also made sure to include a photograph with each individual, this way we could make sure to put a name with a face. We used the grounded theory to analyze the responses from each individual and decide if there was any common frustrations with the current applications and platforms offered for school work. Another task we did was analyzing the responses and categorize each answer so that we could group together which individuals agreed on what problems and which aspects that liked about certain applications. We sorted these into columns using the sticky notes. The sticky notes were our main use of organizing the data in a physical space. This helped us to visualize the most talked about problems, and tactics that we can use to make our app easier and more efficient to use.

4.1 User Research:

Page 18: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

4.2 Personas:17Chapter Four: Design Process

Primary Persona:

Page 19: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

4.2 Personas:18Chapter Four: Design Process

Secondary Persona:

Page 20: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

4.2 Personas:19Chapter Four: Design Process

Tertiary Persona:

Page 21: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

The typical SMAD student (Primary) “I am for anything that makes school work easier.”

• Wants to find a way to connect with more people in SMAD to get a good grade on his semester long project.

• Has trouble communicating with other students to ask for notes, study for tests, or work on group projects.

Brett Allen has just gotten back to his apartment after a long week of classes. After making a snack, he decides to look at his syllabuses and see what assignments he has due next week before making plans for the weekend. Brett, a social guy and coach of a little kid’s soccer team, always likes to be on top of his work so he can have enough time to study for his classes and not cram. When he looks at the syllabus for one of his classes he is shocked to find out that he has a group assignment due next Wednesday. He knows that he has to coach a game on Monday and on Tuesday so he needs to find a group and figure out when to meet quickly. How was he going to contact people from his class when he is not sure what most of their names are yet? But then Brett remembers an app called “JMUConnect” a peer told him about that connects students to share notes, study guides, and post questions onto a class page. He decides to download it and quickly fills out a profile and joins in his class pages. He scrolls through the members of his class until he recognizes the few he wants to ask to be in his group. Brett uses the messenger feature of the app to create a group chat to reach out to his peers. Soon all the students have responded excited to be collaborating on a project. The group sets up a time to meet and begins to work on the project remotely using the documents feature. After a few hours of work, Brett is excited to have his week planned so he grabs his keys and heads over to his friend’s house to enjoy the weekend.

Final Report December 2019//

20Chapter Four: Design Process4.3 Scenarios:

Scenario User: Brett Allen:

Page 22: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

21Chapter Four: Design Process4.3 Scenarios:

Scenario User: Julie Samuels:

Freshman Communications students (Secondary) “I love to work with other students and collaborate, but don’t feel comfortable initiating conversations with new people.”

• Actively looking for students within her major to collaborate with on group assignments and exam preparation

• Has difficulty initiating conversations with classmates about group work and needs an extra push to communicate with classmates about assignments

Julie Samuels has just been assigned a midterm exam and knows no one in her class. Her introverted nature and anxiety about meeting new people makes it very difficult for her to initiate conversation with group members without knowing who they are first. Julie overheard a conversation with other classmates talking about a new application called “JMUConnect” where they can join study groups and look at online study-guides. Julie who is very tech-savvy and somewhat enjoys online communication, downloads the application and creates a new account. Julie then joins her online communication class and immediately gets a message from the girl, Emily, who sits behind her asking if they could get Starbucks and study for their upcoming exam together. Julie is delighted and responds to Emily immediately. Emily then adds Julie to a group chat on “JMUConnect” where everyone shares study spots, notes and study guides. Julie is welcomed into the group chat and starts sharing her direct contact information and current location in the library. Julie is sitting alone and has an entire table to herself, but offers to share her table to members in the group chat. Emily and the rest of the group reply back and say they would love to come join her. Julie, Emily and the study group sit together for hours and talk about study guides, homework and great professors they have had during their first semester at JMU. Julie and Emily realize they have more classes together and Emily adds Julie to more groups online and shares more study guides with her. Julie is ecstatic and even starts joining more classes online and requesting to join group chats with people who look familiar to her. She is finally able to open up socially to classmates, ultimately bringing her success in the future.

Page 23: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

22Chapter Four: Design Process4. 4 Storyboards:

Primary Storyboard:

Secondary Storyboard:

Page 24: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

23Chapter Four: Design Process4. 4 Storyboards:

Tertiary Storyboard:

Page 25: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

24Chapter Four: Design Process4.5 Design Requirements:

Data Requirements:● Messages● List of classes and teachers for each major● Calendar● Documents feature

Functional Requirements:● Ability to connect users● Ability to organize group meetings● Ability to message other users● Ability to rate and rank professors

● Ability to post notes, study guides, or ask questions on each class page

● Page to rate and review professors● App is available on mobile device, laptop,

desktop, or tablet.

Contextual Requirements:● Used on-the-go● Record of each user on the app

Page 26: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

25Chapter Four: Design Process4.5 Design Requirements:

Technical Requirements:● Software platform choice: Mobile phones, tablets or computers.● Must have wifi or internet connection● Available on both Apple and Android products● Connect to existing social media: Facebook, linkedIn, and Canvas.● Notifications/reminders

User Requirements:● Ease of installation of app● Ease of profile set-up and options for customization● The data requirements will be met on the app through the profile page, where each

user is required to make a profile including class schedule, age, name, as well as contact information.

Page 27: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

26Chapter Five: Design Solutions5.1 Brainstorming and Sketches:

Page 28: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

27Chapter Five: Design Solutions

Best 3 Concepts

Page 29: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

28Chapter Five: Design Solutions

Best 3 Concepts

Page 30: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

29Chapter Five: Design Solutions

Best 3 Concepts

Page 31: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

1. App includes a feature to connect with people who previously took the class for advice or tutoring

2. The class section will give you a place to share notes or study guides with other students.

3. App allows for users to comment on class newsfeed with questions or concerns

Final Report December 2019//

30Chapter Five: Design Solutions5.2 The Best 3 Concepts:

Page 32: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

For our paper prototypes, we would like to gather information on how users interact and understand our design. There are a few design elements and functions we are unsure about and would like to get feedback on. First off, we would like to get feedback on if the icons in our main, lower navigation bar are self explanatory to the user to understand what each one means. We attempted to implement universally known icons that represent each main page for our application. Secondly, we wanted to know if users found the drop down navigation menu to be easy to navigate and find the information and options they are looking for. If not a drop down menu, then how would they like the information displayed? Would they want it to be organized differently?

Thirdly, our app currently allows for users to automatically be friends with members of their classes without having to go to their profile and add them. Would the user want all members of their classes to be automatically added as a friend to their profile or would they want to have the option to individually add each person? Another feature for feedback we would like to know is if the user would like the ability to sync their contacts into the application from their phone contact list or not. Would this feature be helpful?

Is there any other feedback that the users would like to be implemented into the design or functionality of our application? Does our prototypes demonstrate a user friendly application that is easy to use, self evident, and one the users could see themselves using? All questions and comments are welcome and helpful to build upon and change our current design to be more friendly and appealing to the user.

Final Report December 2019//

31Chapter Five: Design Solutions5.3 Paper Prototype:

Page 33: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

32Chapter Five: Design Solutions5.3 Paper Prototype:

Task one: Login or Register

Page 34: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

33Chapter Five: Design Solutions5.3 Paper Prototype:

Task Two: Choosing a Study Guide

Page 35: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

34Chapter Five: Design Solutions5.3 Paper Prototype:

Task Three: Create a Group Chat

Page 36: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Our Interaction Design group is currently working on creating an application to help connect students in certain majors at JMU. The goal is for the user to easily navigate through the app to view or post study guides, contact peers, ask questions, get notes, and stay up to date with class assignments. This app is being created to help students navigate through their classes with ease and efficiency. Our goal is to make the life of being a college student less hectic.

Final Report December 2019//

35Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Participant Briefing:

Open-ended Questions:

1. How was your overall experience with our application?2. What did you like or dislike about the app? Anything that could be

improved?3. Are there any features you think should be added to help college

students stay connected?4. Do you like the feature of sharing study guides online and making

your own available to other classmates?5. Are group chats via this application helpful to stay in touch with

group members instead of using an outside communication source?6. Are there any additional comments you would like to make?

Page 37: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

1. How to login or register for the application.

2. How to find study guides for a certain class.

3. How to create a group chat using the application.

Final Report December 2019//

36Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Tasks:

Assigned Roles for Team Members:

1. Human Computer

2. Facilitator

3. Observer

Page 38: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

1. Marissa Piemonte, (Woman, Age 21)• Marissa is a senior Marketing major graduating from the College of

Business in the Spring of 2020. Marissa was recruited because she is Jessie’s roommate. She has voiced that she loves using Canvas but sometimes feels limited with what canvas has to offer.

• Marissa was tested in the Student Success Center on Wednesday October 23rd at 11:35am.

2. Caroline Plashal, (Woman, Age 21)• Caroline is a senior Journalism concentrator graduating from the

Media Arts & Design program in Spring of 2020. Caroline was chosen because she is Jordan’s roommate, and also has professed her frustrations with applications such as Canvas, and the struggles of getting in contact with other students.

• Caroline was tested in the Student Success Center on Wednesday October 23rd at 12:15pm.

3. Courtney Gay , (Woman, Age 21)• Courtney is a senior Health Science major graduating in the Spring of

2020. Courtney was chosen because she is Kiki’s roommate. Courtney learns health-science related topics by collaborating with classmates, but she gets nervous sometimes initiating conversations in class.

• Courtney was tested in the Student Success Center on Wednesday October 23rd at 12:30pm.

Final Report December 2019//

37Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Participants:

Page 39: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

We provided our three participants with our application prototype and took detailed notes of actions and struggles while completing the three given tasks. After the participant finished the task we then prompted them to answer each open ended question.

Final Report December 2019//

38Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Testing Procedure:

Test Measures:

We measured the application’s success based off if the user was able to easily and efficiently complete the task. If the user was able to complete the tasks without stopping for questions, it was considered successful. If the user had to stop and ask questions, then the task needs improvement. We timed the user to see how long it took them to complete the task.

Page 40: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Marissa Piemonte: Marissa completed the first task of logging in or registering via

the first page of the application. It took Marissa exactly 1 minute and 27 seconds to complete the task. She easily was able to click on the register button and type in her information with the keyboard that popped up. She filled out her information in the application such as “First and Last Name”, “Username”, “Password”, “Phone Number”,“Email”, “School”, and “Major”. Next, Marissa was prompted to hit register and the login page appeared to login with the username and password she just created. She knew her task was to register and login so she quickly typed in her username and password and hit the login button to finish the task. Marissa completed the task with ease and knew exactly what she was supposed to be doing throughout the whole process. Marissa was then asked the open-ended questions where she stated the overall experience was user friendly and mirrored what most applications have as a register and login process so it was easy for her to navigate. Marissa said she never felt confused during the process and said it was very self explanatory. Marissa had zero errors. She said the layout and login and register process was a good idea for our application because it would be universally understood by users. She also added that a good feature to have would be to allow a group to be able to facetime or skype each other within the application with their group to collaborate on a project.

Final Report December 2019//

39Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Observations on the Testing Day:

Page 41: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Caroline Plashal: Caroline completed the second task by finding a study guide via

navigating through the application. It took Caroline exactly 2 minutes and 20 seconds to complete her given task. She was easily able to type in the required information required about “Class Name”, “Professor”, and “Time/Date.” But, she did have a question regarding what the “Time/Date” requirement was specifically asking. Next, Caroline was prompted to click a drop down menu to see all her classes, which was completed quickly. After the drop down menu appeared, she clicked on the class she wanted and was then prompted with the options of “available study guides”, “submit notes”, “assignments”, and “groups”. She was able to find “available study guides” with ease and proceeded to the option of “submitting study guides” or “viewing study guides”. She knew her task was to view study guides so she clicked on the drop down menu and saw options of categorized study guides based on the content of the class she chose. Caroline moved through this task fluidly and had one minor question before she completed the given task. Caroline was then asked the open-ended questions where she said that her overall experience with the application was very good. She didn’t feel lost or confused and she knew exactly how to navigate through her given task. She thought these features on our application could really help college students. Caroline had zero errors during the testing process.

Final Report December 2019//

40Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Observations on the Testing Day:

Page 42: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Courtney Gay: Courtney completed the third task by creating a group chat via

navigating through the application. It took Courtney 1 minute and 21 seconds to complete the task. The only struggle Courtney faced was small, and took place during the first step. She had a small pause when trying to figure out how to initially create the group message. Other than that, Courtney was able to smoothly navigate through the application. After clicking the icon that looks like a pen on paper, she was directed to the next step, which gave her the option to search her contact list to add members into the group message. After completing that, she was prompted to name the group chat. Both of these steps were done with ease and without question. After these steps, Courtney was welcomed to her new group message and could begin typing. She encountered zero errors in her testing process. Courtney was then asked the open-ended questions, she explained how her overall experience with the app was successful, and easy to operate. She thought the messaging feature was a good idea, and will be very helpful for college students and their need to stay connected.

Final Report December 2019//

41Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Observations on the Testing Day:

Page 43: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

1. A modification we will be making to our design is when users go to fill out information for: “Class Name”, “Professor”, and “Time/Date” within Task 2 we will be adding an example within each answer box so the user knows exactly what information is required.

2. A modification we will look to add would be to include a feature that allows a group call or video chat within our application in order for groups to collaborate remotely.

3. Another design modification is to ensure that there is color differentiation when the user is in a specific section. The icon will be highlighted in a different color.

4. A modification we will be focusing on is to make the icons more clear and concise, enabling the user to use and navigate through our app with ease.

Final Report December 2019//

42Chapter Five: Design Solutions5.3 Paper Prototype and Testing:

Design Modifications:

Page 44: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

43Chapter Five: Design Solutions5.4 Low Fidelity Prototype:

Task One: Login

Task One: Sign Up

Page 45: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

Chapter Five: Design Solutions5.4 Low Fidelity Prototype:

Task Two: Upload a File

Task Three: Create a Group Chat

44

Page 46: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

45Chapter Five: Design Solutions5.4 Low Fidelity Prototype:

Task Four: Create an Event

Task Five: Choose a Study Guide

Page 47: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

46Chapter Five: Design Solutions

5.4 Low Fidelity Prototype Feedback:

The five interactions that we focused on for our app, JMU Connect, included: logging

in and signing up, creating a group chat, creating an event, uploading a file (SMAD 330),

and choosing a study guide. Overall, each interaction had its own obstacles that we

faced. The signing up/logging in interaction was the most straight forward and received

the least amount of uncertainty. The uploading a file interaction has a similar look to

Canvas’ file options, therefore it should be easy to use to those who are familiar. This

interaction is also pretty straight forward, each step is easily identifiable by following the

arrows and buttons. The creating an event interaction is also easy to follow. Each step is

self-explanatory and similar to other applications such as the calendar app on an iPhone.

So if you are familiar with that, you shouldn’t have much trouble trying to figure it out on

this app. The creating a group chat interaction is easy to follow, but there are some

uncertainties with possible confusion due to the amount of options to click on when

creating the chat. The last interaction, choosing a study guide, is simple and easy to

follow, but there are some uncertainties that could use some feedback. There is

uncertainty with the headings and button names. One question being, are the button

descriptions clear enough to describe the step it is indicating? Another question is about

the new added interaction for uploading a file. We want to make sure it is clear to the

user how exactly a user completes this task so further testing should be applied to this

interaction. Other than that, we are pleased with how each interaction turned out on the

low-fidelity prototype using Adobe XD.

Page 48: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

47Chapter Five: Design Solutions

5.4 High-Fidelity Prototype:

Task One: Login and Sign Up

Page 49: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

48Chapter Five: Design Solutions

5.4 High-Fidelity Prototype:

Task Two: Creating a Group

Task Three: Creating a Group Chat

Page 50: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

49Chapter Five: Design Solutions

5.4 High-Fidelity Prototype:

Task Four: Create an Event

Task Five: Choosing a Study Guide

Page 51: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

50Chapter Five: Design Solutions

5.4 High Fidelity Prototype Feedback:

For the high-fidelity prototype we focused on the improvements that you recommended to us by bettering the same tasks only changing the task of uploading a file to a new task of adding students to a group to emphasize the connection of users. The five tasks are now: logging in and signing up, creating a group chat and individual chat, creating an event on the calendar, adding students to a new group, and choosing a study guide. For the first task there was little to no confusion with our users for functionality aspects but rather in the design aspects. We added more to the sign up section so users can create a profile after signing up. This helps users understand not just the task but the overall functionality of our application. For the second task of creating a group chat, the low-fidelity mockup was modified to increase user functionality and ease the way to create a group chat. Instead of having a pop up message to either “create a message” or “create a group chat”, once the user clicks on the create button, they are then prompted to create a new group chat right below the “to:” typeable bar. The layout was better formatted in the high-fidelity mockup with light-gray lines inserted to create a more organized look and the addition of real profile pictures. For the third task, creating an event on the calendar, we added in a way to edit the event. To make it more understandable for users we also clarified the color code and added a feature to choose which group to share the event with. For the fourth task, I (Jessie) created a new task to add students to a newly established group. The task begins by clicking on the groups section and then students can add each other to groups with ease. Users know they have been added to the group when the users see the green check mark next to their name. For the choosing a study guide task, we added an edit widget for the user to go back and edit or delete a class. We also added more detail to each study guide, showing a step beyond just seeing the different study guide categories. We made a list of what study guides were available and who created it. This will help the user narrow down exactly what they want to study. We also added a new section that shows what the user’s study guide looks like when you choose one.

Page 52: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

51Chapter Six: Conclusion

Final Video:

Link: https://vimeo.com/378652467

Our team was able to create and design a user friendly application that helps connect the student body of James Madison University. Based on our user research, the users found it difficult to balance all of the different platforms offered for students. JMUConnect offers a way for students to combine messaging, group chats, creating group meetings, and uploading study guides under the same application to meet our users wants and needs for a connection application. We made our design and technical decisions with the user in mind so they would have the best experience possible. As a team we decided to lay out the application similar to Canvas and Facebook since they are platforms our users are familiar with. We chose the color scheme to represent JMU and the pride our students feel towards their school. With using just the purple to contrast with the simplistic black, white, and gray, we kept the design aesthetic simple and clean. After testing and making changes to our design until we reached our final draft, we are pleased with the finished product, JMUConnect.

Page 53: Final Report - 134.126.97.130134.126.97.130/students/JMUConnect.pdf · on study guides, and group study sessions. Edmodo is a website that helps connect students with teachers and

Final Report December 2019//

52Chapter Six: References

1. Saffer, D. (2010). Designing for interaction: creating innovative applications and devices. New Riders. Print ISBN-13: 978-0-321-64339-1. Safari e-book link: http://proquestcombo.safaribooksonline.com/9780321679406

2.Cooper, A., Reimann, R., Cronin, D., & Noessel, C. (2014). About face: the essentials of interaction design. John Wiley & Sons. Print ISBN-13: 978-1-118-76658-3. Safari e-book link: https://ebookcentral.proquest.com/lib/jmu/detail.action?docID=1762072

3. “Learning Adobe XD.” LinkedIn Learning, Formerly Lynda.com, https://www.linkedin.com/learning/learning-adobe-xd-2

4. New.edmodo.com, https://new.edmodo.com/?go2url=/home.