4.1 | Prototype

When creating the prototype for our idea we had to think of a couple of things. Like what we wanted to accomplish, how to accomplish it and where with who. We knew we had to create a digital solution since our entire idea revolves around an already digital platform. We got to this step before learning about Adobe XD. At the time we planned to straight-up make a live mockup site of

Canvas and edit its HTML and CSS to fit our needs. We scrapped this idea before we even began looking at the code as this would take forever and would also use too many already existing assets. But then we got introduced to Adobe XD and its tools. Something that made this a lot simpler for us.

 

We shifted focus over to creating an Adobe XD based prototype and had to come with a quick solution to all things we needed. We figured out that Adobe XD actually lacks a lot of the features needed for an effective site. Elements like text fields and lasting updates after button presses. The solution to this would be creating a buck load of steps, and have Adobe XD act as a button to get to the next site. Almost like a powerpoint presentation, with more accurate clicking involved. Here is an image of how the entire workspace looked, at the end of this post is all the linked pages so you can see exactly what I’m talking about.

–// PROTOTYPE \\–

Click the prototype link above to walk through the prototype as you like.  Below you will find both a simple walkthrough of the prototype in a video and also the second video where there is more of a talking-heads style explanation video.

— Quick Walkthrough video

— TH Prototype  Video

What was our vision creating this prototype?

We wanted to create a fully, or at least semi-functional site containing the whole package. Our idea was supposed to be comparable with the current live version of Canvas. You should be able to have both beside each other and point out differences and feel how much greater our product was in the end-stage.  We were limited by the current technology that Adobe XD currently has packed, we were lacking important features that would make out most if not all our idea was based on. Being able to have lasting changes made by the user, and text input fields. We really needed these things in our prototype, or else our product would not be correctly observed and tested later.

We had to create the illusion of progress. Creating step by step workplaces that gave the illusion of progress. It ended up being a lot more work than we thought but we are really happy with the result and product we are able to present today.

Below are the visible connections between the pages. Giving insight into exactly how we created this project.

5.1 | Testing

Testing our product/prototype.

One of the final stages before either going back to scratch or going forward.  We already knew that the idea of our idea was liked by laymen as we found this out during the Cultural Probes Exercise.  So we created something awesome that we felt represented our idea to its full potential. The remade Canvas, more customizable than ever.

What did we want to accomplish with these tests?

Our main goal with this test run was simply wanting to know if our idea held water.  We wanted to see if our product still held up to the positive feedback we got before.  If we were still on the path we hoped to be or if we had stepped away from a product that people actually wanted and needed. We wanted to hold ourselves accountable if we had shifted too far away from what our feedback had given us previously.

We did the test on three different people.  We wanted to present different students from different courses with different methods of presentation.  We chose to present only the video to some, and both video and an on-site prototype for them to test live.  We let them first have a look around before answering questions. Below are some premade questions we asked the students after presenting the prototype/video prototype.

The questions were  as follows:

  1. Is this something you would use?
  2. Is there something you miss or you think could be improved?
  3. Do you register any obvious flaws with the product?
  4. What features do you like?

 

Person 1 ( Presented on-site demonstration of prototype + video prototype)
Currently studying Digital Media and Design Bachelor.

  1. I would absolutely use Canvas more if this was implemented. It removes a lot of the need to tab to other services and is a huge QoL improvement overall.
  2. Not at the time as I can think of, as much of what I can think of would easily be introduced through the plugins page.
  3. Maybe a short introduction walkthrough? But that said we don’t get that in the current Canvas either so.
  4. I really liked the plugin function. Being able to add stuff to the current Canvas reduces the need to switch apps and third-party sites to operate at a decently good pace. The built-in code editor was genius.

 

Person 2 ( Presented on-site demonstration of prototype + video prototype)
Currently studying Political Science (Second year, extra semester) + Language

  1. Yes, I would use this program. It seems like a much greater overall experience and looks a lot clearer and generally easier to use. Also, plus points for adaptability for people with weaker vision, etc. I would use this if Canvas manages to run it cleanly.
  2. Maybe some more customizable options when it comes to how Canvas looks? This is generally small things and could be implemented with the plugin and addon function.  But would fit well with the whole customizable Canvas theme.
  3. A little clearer name maybe, like settings or edit(TM)? Not really a flaw as much as personal opinion on the overall product.
  4. I really like the possibilities to change font size and adapt canvas for Universal design-needs. I enjoy the possibility to edit the menus so that only things I feel is needed is there.  The idea to implement plugins is also greatly favored as long as it doesn’t remove the stability of Canvas.

 

Person 3 ( Presented with only the video-prototype)
Currently studying Digital Media and Design.

  1. I would gladly use a better, customizable Canvas.
  2. Predesigned Canvas themes? It’s not a feature that’s necessary, but it could be nice to have some nice looking themes to choose from.
  3. I haven’t noticed any flaws. In my opinion, the rework looks pretty good.
  4. As it is now, Canvas isn’t well-organized, and it might be cumbersome to navigate through the website. Your Canvas rework solves those problems, as it is possible to choose which menus are supposed to be displayed on the main page (emneinfo, kunngjøringer, etc.) I also like the addon and plugins idea, especially the Outlook plugin.

What did this test tell us?

Overall what we learned from this test is that it actually seems like people want a new Canvas system. We wish we actually got some negative feedback in this test so we had something to work with and reflect on, but even when asked if there were any obvious flaws with the system, none of the questioned students had anything to say.

There were few differences in the answers from the students having a complete introduction to the test and the students having only a video preview.  That allows us to come to the conclusion that they all got the overall theme of our product.

If we would have had a larger sample of test subjects (tens, if not hundreds, more) we would gain more room for both negative and constructive criticism and feedback. We would have used this to give us a further understanding of what people actually wanted, and we would be allowed to pinpoint it even further. But we take the feedback we have gotten as a sign that what we produced was a product that actually showed up, spiked interest and questions regarding our current Canvas. A function that was mentioned most was the plugin function, having the possibility to create your own learning platform.

That was what we wanted to create, it was what we wanted to prove. And according to our feedback, it is exactly what we managed to do.

2.1 | Defining our research questions

How we defined our research questions.

The cultural probes

In order to define the problem, we needed to synthesize the data we achieved through the cultural probes and the expert interview. We began with the cultural probes by laying all of the tasks from all five probes in five respective piles and go through all of the answers one pile at the time while systematizing them in a simple form:


Results from the Circle Around the Word task:
– Stupid, Confused, Annoyed
– Confused
– Stupid, Confused, Annoyed
– Boring
– Confused, Satisfied, Smart

Results from the Pick a Face task:
– Bad / sad
– Bad / sad
– Happy
– Happy
– Okay happy

Results from the Expectations while using Communication Platforms task:
– «That» everyone » is on the platform and that it works well. Will also use the one that people are most available on.»
– «That it works properly.»
– «That I get replies quickly and that the platform works well and quickly.»
– «The fact that the platform is fast, can send files, seldom downtime, easy to use, no restrictions on what to share.»
– “Possibility of a group chat, that they are easy to use, that no problems occur while using them. Also, the ability to send more than just text, such as pictures and files. »

Results from the Weekly Basis Communication Platforms task:
– Facebook, Snapchat, SMS, Discord, Instagram, Twitter.
– Discord, Messenger, Snapchat.
– Facebook, WhatsApp, Instagram, Email.
– Facebook, Steam, Discord, Instagram, Snapchat, Canvas, Email, YouTube.
– Facebook / Messenger, Instagram, Snapchat, Vipps chat, in game chat functions like League of Legends Client chat, Email, SMS, YouTube.

Results from the Statements task:
1. «I always know where and when I have lectures thanks to Canvas.»
– Agree
– Neutral
– Strongly disagree
– Agree
– Neutral

2. «It’s easy to organize for group work in Canvas.»
– Neutral
– Strongly disagree
– Disagree
– Neutral
– Strongly disagree

3. «It is easy to respond to messages from teachers / lecturers.»
– Neutral
– Agree
– Disagree
– Disagree
– Disagree

4. «I can find my grades and feedback from my professors in Canvas quickly.»
– Agree
– Strongly agree
– Neutral
– Neutral
– Neutral

Results from the Complete the Sentence task:
«What I wish it was possible to do in Canvas is…»
– “I want a neatly organized Canvas where all subjects have the same structure and name and are in the same language. Better and more explanatory titles would have been nice, too. »
– «Don’t use more than one scroll bar.»
– “Instant chat with teachers.”
– “Organize the website the way you want”
– “Chat functions with those you are working with on group projects + Opportunity for co-writing (better).”

 

When we had gone through all of the probes, we were able to see a few patterns emerging, so our next step was to categorize the probe answers by organizing them in clusters.

The results from the cultural probes, organized in clusters.

Canvas/LMS was the main cluster in the centre from which we derived the results into three sub-clusters; Communication, Emotions, and Wishes/Improvement suggestions.

From Communication, we divided the probe answers further. Many answers brought up features we usually find on social media platforms, such as chat, so obviously we had to have a SoMe sub-cluster, as well as an Expectation sub-cluster. From the probe answers, we noticed that the expectations the people were having to LMS was often connected to the ability to communicate, like file sharing and chatting. Other expectations were connected to the more technological aspect of LMS, such as user-friendliness and stability. Chat functions were also echoed in the Wishes/Improvement suggestions sub-cluster, but this cluster also brought up another exciting suggestion: The possibility to organize the LMS yourself.
For the Emotions cluster, we noticed that a majority of the probe answers were those of negativity when dealing with their current LMS (Canvas).

The expert interview

Trying to synthesize data from the expert interview was a more challenging task, but even here we saw a clear pattern emerging as we analysed the interview.

The expert interview organized in clusters.

We noticed that we could easily divide mr. Bisseberg’s main statements into two major sub-clusters: What is good with Canvas, and what is bad.

The good features are mostly technological, like constant bugfixes and updates, and little downtime, just to mention a few. Should the service be down for some reason, then Canvas can provide good support.
The bad features are often based on the user experience, such as a less than optimal user-friendly design, limitations in regards of co-operating and custom design the LMS for your own needs. «The «one size fits all» doesn’t fit all» statement sums up this aspect rather accurately.  It made us wonder, though: Would it be possible to hold on to everything that makes Canvas a good technical user experience, but simultaneously change and improve upon what makes it bad?

3.2 | Storyboard

About our storyboards.

Just like the scenarios, we went along with having just two storyboards: One for the student’s point of view, and the other for the teacher’s.

The student’s storyboard

The teacher’s storyboard

We tried to just include the most essential scenes from the scenarios in the images in order to make them appear more storyboard-esque, and not like an ordinary comic.

We used the digital services of storyboardthat to make our storyboards.

3.2 | Scenarios

About the scenarios.

We based the scenarios on our personas, introduced in last post. Whereas the personas focused on the target users themselves, the scenarios takes us to hypothetical situations the user is most likely to use our product.

We decided to do two scenarios, instead of three (one for each persona), simply because the student and the high schooler’s personas doesn’t differ that much.

The student’s scenario

Truls is taking a new course in his second year, and the first assignment is a group project. Truls doesn’t know anyone yet from this particular course and has no idea who the people he has ended up with in the group are or how to recognise them during classes. This stresses him, because he doesn’t like to waste time having to look them up on social media and initiate contact there. Fortunately, he has their names, so he logs into the LMS, types in their names in the chat bar and starts a group chat with them, where they agree to meet up in the hallway outside the auditorium at eleven o’clock and discuss their ideas further.

The teacher’s scenario

Jan Kåre has gotten the opportunity to involve digital technology in his lectures, but the software needed is quite new and requires a licence for money. He proposes his idea to the school administration, and they agree it’s an exciting idea. They buy a school licence, and the software is added as a plugin feature on the school’s LMS, easily accessible to Jan Kåre’s pupils.

 

As we can see, the teacher has a far more mod-esque role than the student.

Now, lets try to visualize these scenarios in a storyboard, shall we?

3.2 | Personas

The three ideas we generated in last post further narrowed down our main target groups. We thought the first and the third idea was similar enough to be combined into one «big» idea (or the two sides to the same coin, if you like), so we based the personas, the scenarios and the storyboards mainly around those.  A two-in-one solution, so to speak.

While we conducted our expert interview with mr. Bisseberg, the conversation never strayed from the fact that our main target group was students, but it also made us aware that these students also included users all the way down to elementary school pupils! Another group that was also brought up, was the presence of teachers, professors, and educators. On the account of this information, it felt natural to base our personas on these three users.

Without further ado, let us introduce..

PERSONA 1: THE UNIVERSITY COLLEGE STUDENT

PERSONA 2: THE HIGH SCHOOL STUDENT

and last, but not least

PERSONA 3: THE MIDDLE SCHOOL TEACHER

The personas are an important tool to visualize our main target users and the situations/scenarios in which they will most likely use our product.

Persona template by Alexander Georges.

3.1 | Generate Ideas

While we were synthesizing the data we collected from the cultural probes and the expert interview, we were also brainstorming ideas for our next phase: How to use the data we just retrieved to further develop our original idea. Strangely enough, the main pros and cons resulted in almost the same answer, namely that our project was so specific to begin with, there really weren’t that many ways to do it differently! Of course we had a few nutty ideas (like a LMS + hoverboard combo), but those only generated laughs and were not taken seriously enough to be a part of the contender. However, we did manage to come up with three ideas that did make the cut:

Idea One:

Advancing the Canvas application further than what it is now. Making it more like an open-source platform where you can download plugins and addons to make Canvas a more advanced and specialized tool rather than just an informational platform. Letting the students themselves choose what addons they want to have and what plugins they want to disable. And let them customize the course sites and groups.

This will create a new way of using Canvas. Instead of the user having to cave in and adapt to how Canvas is currently set up we can let the user decide and form their own platform. Do economy students need the same tools as IT students? Probably not. Some will use a lot of the same tools but some course-specific addons would create a more directed tool. Also letting eager students creating their own addons or plugins they can choose to share their idea/plugin/addon in the Plugin library (monitored by some form of authority).

 

Idea Two:

During our expert interview, mr. Bisseberg informed us that 47% of the students interact with Canvas through the app. Now, that’s a large number! Through our student interview, we learned the Canvas app was more user-friendly than the web browser version, but still had room for improvements.

 

Idea Three:


Our third idea is similar to the first idea, except this idea revolves around the teacher: The open-source platform solution where you can download plugins and addons can benefit the teacher, giving them the opportunity to choose what kind of software, plugins and addons they want to use as digital tools when teaching or is relevant to their subject.