4. Prototype


For this assignment, the group was given the task to create a high fidelity prototype and a video prototype presenting our concept, with help from high fidelity prototype. The purpose of this assignment is to demonstrate our concept in a clear way for our users.

Adobe Xd Demo Process

The group gathered together and started drawing low-fidelity prototypes, sketching the rough idea for the app. One hour was spent sketching, then the group immediately started working on a high-fidelity prototype using Adobe Xd.

High fidelity prototype – Adobe Xd DEMO


The first ting the users do once they open our app “PowerChat”, is to log in with a Feide account. This will ensure that the user is a student or a teacher at Østfold University College, and it will also help the app find their courses.


After logging in with a Feide account the users will be given two choices, either continue with their ID which will be their names or be anonymous. The users will have access to the same content regardless of what they choose, this is just for the chat function whether the user prefer to be shown as anonymous or not.


Once the user has picked whether they want to be anonymous or not, they can then start browsing through the courses that they attend to during their semester.


Next an overview of the all the PowerPoints used in the selected course will appear, for the user to look through and pick the desired PowerPoint.


When you have selected the PowerPoint you want to access, you will have 3 different elements on the page. The first is the slide-selection, the one in the middle is the slide the lecturer is currently on and the one to the right is the chat bar where the users can leave comments or questions.

The Demo: https://xd.adobe.com/view/bea11141-3a11-4b6f-5e49-e5fb7bf3f584-c890/



Process of making the video

Firstly, the group sat down together and discussed how to present our concept in an easy and clear way through a video. Once the idea and how to solve the assignment was decided, we started to film immediately. The group decided to make a video of a situation that introduced a common problem which often occurs within a classroom to try and relate to the audience. In this way we could connect and empathize with the target audience, as well as present our concept and prototype to solve this problem.

The equipment that was used in this assignment was:

  • A camera
  • A microphone
  • An editing tool

The making of the video took 6 hours in total, where we filmed for three hours and edited for another three.