blog

Building a prototype

Written by Morten Olsen | Jun 29, 2024 10:52:36 AM

After talking to several schools, course providers and teachers, it was time to put some of the learnings together and build a prototype to have something more tangible to talk about. We built it in Figma, a graphical design tool that can also handle clicks and make changes to the graphics to make a quick prototype. It can not easily do everything, but we chose this to be able to create something fast to illustrate a potential system without actually coding it.

Goals

A main goal with the system is to offer learners bite-sized learning content to help learners find time to do their homework. Being able to just do 5-10 minutes allows learners to do a little bit of studying in small breaks in their day, for instance when commuting, at the end of the lunch break, or whenever they might use their phone to read news or social media. We had also learned from teachers that there were several time-consuming boring tasks, which we believed we might be able to help with.

We learned from teachers that many of the Learning Management Systems they had been in contact with are very complex, so it became a goal to simplify and offer a great, easy and understandable user experience. We believe that this involves trying to limit functionality and not be a swiss army knife that can be used for any learning needs covering internal employees, external customers, and actual students from pre-schools to Universities. We also believe that it involves hiding seldom used and special case functionality and providing good defaults, so the user is not overburdened with understanding and making choices about too many things.

We also learned that many Learning Management Systems do not work well with mobile devices. This is in part because many LMSes originate from web and advances in web technology. Also there are some standards for learning content that are targeting web. Another reason for things to not work in practice is that teachers may use their laptop and the LMS does not guide or help with file formats that may or may not be supported on mobile devices, so they may upload something that cannot typically be used on mobile. To be able to offer an experience where the learner starts the app and then starts on the next exercises immediately, we believe it is important to have a native app, 

Designing

Navigation

For teachers and maybe other personnel there is some functionality that relates to a specific course and some that is at a higher levels and that is something else than courses. However, it seems undesirable to have very deep navigation hierarchies, where the teacher and learners will first have to navigate to something that list courses and then click into a course before getting to the functionality related to the course. 

Part of this may be solved with a home screen that displays and give access to the most relevant functionality directly from a start screen. Many learners at language schools or other commercial course providers may often only attend a single course. So, it may make sense to offer access to everything about the specific course, and just have navigated to the course and its home screen automatically if the user only has one course.

Some learners and teachers may have a few courses. Rather than having to navigate up to a top list of courses before navigating down to another course, we think it will be better to be able to navigate sideways. Users will typically not have a lot of active courses. For some teacher with many courses it could stretch to a few tens of courses. We can still allow for navigating up, but just not making it center of the design. 

The screenshots show the start view listing courses, when the user has more courses, and the view for a single course, which is the start view when the user is only associated with a single course. The top bar on a single course, which states the course name, doubles as a way to navigate to other courses without having to necessarily go to the course listing view. We have designed for mobiles and have tried to flatten the navigation hierarchy, When in a course, the main navigation relates to the course and only the top bar takes up space for navigating to other courses or things not related to only a single course. 

Allow quick exercises

When using the mobile app the user will not have to login each time, and if only attending one course, this course will be shown when starting the app. However, it is still important that the actual view for the course makes it possible to start doing the next exercises immediately rather than having to navigate.

Every step before actually doing the exercises adds a risk that the learner cannot utilize a break because it is not long enough for all the steps and the actual homework. Also, the perceived ratio between preparation and exercise time also affects whether a learner thinks it is worth to do just a little bit of exercises at a time. For instance, interviewed learners that probably have used less than 5 minutes for preparation and for putting things away afterwards, indicated that they would typically do all the homework (30 minutes to 2 hours) in one go. Having to add those minutes again if breaking up the exercises felt like too much.

We could add a button on any page to just do the next exercises, but we decided on showing a "course plan" as the opening view for the course. This shows the main units of the course together with bite-sized packages of exercises. The main units may be different subjects or in case of live classes, it may indicate the classes and also show the date and location. The packages are to contain 5-10 minutes of exercises that a learner can do in a small break. If the learner has more time, she can do multiple packages in one sitting. 

Above is shown examples of the course plan view with the main units as bars and the packages or individual exercise lessons as circles. The teacher may optionally give the units and exercises some descriptive texts, explaining what they are about. The learner can scroll this view and see what he has already done and what is to come, if the teacher has filled it out already. The view will be scrolled to the next exercises the learner should do, which is the emphasized circle with an extra circle around. After having opened the app, the learner only has to click the emphasized exercise session to start doing the next homework.

Focus on exercises

In some cases, when the homework is ill-defined, and the learner has to try to remember or study the exercises for some time to understand what is being requested, it adds to the perceived extra time and alters the ratio mentioned earlier, because the learner is more likely to understand the next exercises if continuing.

While we want some variety and fun in the exercises to keep the learners motivated and engaged, we also want to be clear and re-use established types and patterns of exercises. The learner shall spend as much time exercising and reinforcing the learning and not spend time on trying to figure out what is expected - unless that is part of the exercise (understanding an instruction in the target language). In the user interface, we may also help with removing other distraction to only focus on the exercise. We choose to use most of the screen area and remove other navigation while exercising.

Above is shown the exercise view, where focus is put on the exercise and other navigation removed. The first image shows a multiple choice style of exercise and the next image shows a view when the exercises have been finished. Some gamification and nudging is used to motivate the learner to continue exercising.

Testing

After building the views shown here and other views essential for the prototype, we showed it to several teachers and some school managers. We received mostly positive feedback, but also had some learnings. The insights from the usability tests and talks are summarized in the below.

  • Most teachers mentioned unprompted that the prototype is very user friendly and easy to navigate.
  • We identified two areas for improvement - teachers got in doubt in these areas when seeing them for the first time and were asked to perform various tasks.
  • Several teachers had experience with Moodle and preferred the simplicity and ideas in Edumo.
  • We sensed a lot of mixed feelings regarding Moodle from teachers experienced with it.
  • Most teacher saw a potential to save time when creating supplementary learning content (not touched on in this blog post).
  • Many evening school teachers feel they are not paid much for preparation and a few of the interviewed therefore are not spending time creating or even looking for content.
  • Most schools indicated they liked the user friendliness of Edumo and it being mobile first.
  • Most schools acknowledged that the current systems used do not work well on mobile and doesn’t offer learners to quickly practice when they have time.
  • Some schools indicated that not all of their learners actually have access to traditional computers, but all have smart phones.

We still have more usability tests and meetings lined up with teachers and language schools and are eager to get more insights and learn what we might adjust or improve.