A Design Concept For a Mobile Moodle Application

Arjen Vrielink and I write a monthly series titled: Parallax. We both agree on a title for the post and on some other arbitrary restrictions to induce our creative process. For this post we agreed to create a design concept for a mobile Moodle application. The concept should include screen mockups. You can read Arjen’s post with the same title here. This month we are delighted to have two guest writers writing about the same topic. Marcel de Leeuwe (read his post here) and Job Bilsen (his post can be found here).
Mobile applications have taken off. This is largely due to the trailblazing work that Apple has done with the iPhone and the App Store. If you have been watching my Delicious feed, you will have noticed that I too have succumbed and will be part of the iPhone-toting crowd (I will write more about me losing my principles later).
Nearly every web service that I use has a mobile application. Examples are Last.fm, Flickr, WordPress, Dropbox, NY times, Paypal and more, the list is endless. Moodle, the web application that I use most often, does not have a mobile app yet. There have been a couple attempts at creating themes that display well on a mobile (such as here). These mobile themes usually try to deliver all of Moodle’s functionality, which often limits their phone specific interaction and their user friendliness. Other applications use JAVA applications that gives people access to specific Moodle functionality (examples here and here).
It would be great to have a true mobile Moodle application. Here are some initial thoughts for a design.
Audience
The audience for this Moodle application would mainly be students/participants. I want the functionality to focus on things that are easily delivered on a mobile platform. I don’t think grading and reporting interfaces lend themselves well to a smaller screen. The things that people like to do with a mobile device are usually: seeing what has happened/is happening, plan and communicate. This Moodle application will enable the users of a Moodle installation to do exactly those things.
Getting rid of the course paradigm
Moodle is extremely course centric. I have always thought that this has some great advantages, mainly that all the learning is very contextual. Students, however, often have to “multi-course” (doing multiple courses at the same time). A mobile application should make the most urgent or current events, actions and resources bubble to the top. This requires the application to get rid of the course paradigm and show a personal page per user.
People that have used Moodle for a while might know of the “My Moodle” page. This page also tried to pull up the most relevant information for a particular user, but would still display this information on a course by course basis.
This application will consist of four main screens. Each screen has its own icon at the bottom of the screen that stays available at all times. Each screen could of course lead to other screens that take you deeper into the Moodle installation.
1. Recent activity stream
Facebook and Twitter have really taught us the use of activity streams. These pages display short status messages about what is happening in reverse chronological order. Moodle has had an activity stream since its inception: the recent activity block. This block shows what has been happening in a particular course. Examples are forum posts, work being handed in or materials being added by the teacher.
This screen will work in a similar way, but will include all the courses a user is participating in. I would imagine that each update on the screen would include a date and a time, would link to an extended version of the update and would include a user image if the update concerns another user, or an activity icon if it concerns a particular activity. The newest updates would be at the top of the screen and the user would be able to scroll down to see older entries (very similar to Twitter). See below for an example:

Recent Activity

You would have to think about each Moodle module and decide what a status update would look like for that particular module. Some examples of events that could trigger a status update:

• A forum post is added to a course of which the user is a member.
• An activity becomes available (either because it was added or because it had certain time that it would become available, like the choice or assignment activity) or a deadline has passed.
• An entry is added to a database activity or a glossary that the user has access to.
• A topic or week has been made current by the teacher/facilitator.
• A message has been sent to the user.
• The user hands in work for an assignment, fills in a choice, starts a lesson, gets the results for a quiz or starts a SCORM object.
• A change is made to a wiki page that the user has access to.

These status updates could announce themselves on the home screen in a similar way to how the mobile platform shows that you have new email messages: by showing how many new updates are available.
2. Upcoming events
This screen is also an extension of existing Moodle functionality made course independent. Conceptually it is what you would see if you would scroll up on the recent activity screen. Upcoming events that can be displayed are:

• Anything that is in the user’s calendar.
• Activities that will become available or that have a deadline.
• Courses that will start and that the user is enrolled in.

This screen would look very similar to the “Recent Activity” screen as shown above.
3. Social: contacts, interests and messaging
A mobile device is used for communications and a mobile Moodle application should facilitate that. This screen is an alphabetical list of all the users that a student/participant shares a course with, combined with an alphabetical list of all the interests that a user has put in their profile and all the courses the user is enrolled in. See example:

Social

Selecting a user will take you their profile page. This page will focus on the ways that the user can be contacted. You can message the user from here, call (or Skype) them, send them an email and click on the links to their external websites (a blog, Twitter, Facebook, etc.). See this example:

Profile page

Selecting an interest or a course will apply a filter to the alphabetical list. It will now only show users that share this interest or this course. It might allow the user to contact all these users in one go (if this role has been given the permission for this capability).
4. Browsing courses, activities and resources
I really like a side scrolling drill down navigation (examples are the way that email works on the iPhone or the “Slider view” on Grazr). A mobile Moodle application should allow the user to navigate to activities and resources in their course by constantly drilling down. This can be done it two ways: course centric or activity-type centric. The application should probably support both.
The first screen shows a list of all the courses the user is participating in and below that a list of all the activity types that exist in Moodle.
Clicking on a course will make the previous screen slide to the left and display a new screen. The first option on this screen will be called “Course overview”. If you click on this you will see all the section/topic summaries, all the activities and resources and all the labels in their correct order (blocks are completely ignored in this mobile application). Below the course overview are links to the overview pages of each activity type. Clicking these will display all the instances of a particular activity or resource.
If you click on an individual activity or resource you will be shown that activity (again by making the screen slide to the left). What is shown here and what interactions are possible is dependent on the activity module. The minimum it would show is the title and the description. This would probably be the case for SCORM modules for example or for “upload a file” assignments. You would not implement a mobile SCORM player, nor will people likely have files for upload on their phone. The one activity that would benefit from being a bit richer would be the forum activity. It should be possible to follow and contribute to a forum discussion from the mobile Moodle application.
Technical considerations
The (start of a) functional design that I describe above will certainly have technical consequences (not to write obstacles). Below some of my first thoughts:

• What platform? The nice thing about web applications is that you only have to develop them for one single platform: the platform that the server is using. Of course it would be possible to create a mobile version of a Moodle site, but this would negate some of the great things that a native application can do. We are now in the unfortunate situation that we have multiple mobile development platforms. The two obvious choices for mobile development would be an iPhone app and an app for Android. But what about people who use a Blackberry, or a Symbian or Maemo phone? I have no knowledge of how easy it is to port an Android app to the iPhone, but I do know that multiple platforms will be a reality in the next couple of years. You better write portable code!
• Where does the code live? It is easy for Facebook to create an iPhone application. They run a single installation and can have server-side code and client-side code to make it all work. Moodle’s install base is completely decentralised. That means that Moodle installations will have to get some code that will allow a client to talk to it. In the client you will then need to be able to say what Moodle installation you want to connect to. This poses a couple of questions. Will a mobile Moodle app require a special server module? Will Moodle 2.0 expose enough of itself to an external API to make a client like I describe above possible? Should one client be able to plug into multiple Moodle installations at the same time? I am not a software architect, so I would not have any answers to these questions, but they will need to be resolved.
• Performance? Moodle’s data structure is course-centric and not user-centric. Moodle currently does not have internal functions that deliver the data in a format that the Moodle client can use. I think that the query to deliver a recent activity feed that is cross-course and has the perspective of a single user is very complex and will create a huge performance hit on the server. Again, I am not an architect, but I would imagine that this requires a special solution. Maybe more push and less pull? More database tables? Server-side pre-caching? Who knows? I certainly don’t!
• Roles/permissions/capabilities? Any new Moodle client that uses existing Moodle data (as opposed to new modules) needs to be very aware of any existing capabilities. All of these need to be checked before information can be shown to the user. I am sure this has further performance implications.
• Online/offline? A lot of mobile applications cache their information so that a user can continue to use the application even if an Internet connection is not available (e.g. the New York Times app). Even though it might be useful for a Moodle application too, I wouldn’t put any initial effort into solving that problem. Smartphones that have decent application support function well in a context where there is persistent mobile broadband. It is therefore okay for the first version of mobile Moodle application to assume that it is online.

A note on prototyping/mockups
I used the excellent Balsamiq to create the mockups that go with this post. This easy tool delivers quick static results, although it lacks a bit of precision that I would like to have added. Moodle has Balsamiq integrated into the Moodle Tracker, making it trivial for anybody to add a user interface mockup to any issue. There are other tools that could be used to do iPhone prototyping. This blog post gives a good overview.
Continuing the dialogue
I would really like an application like this (or something similar) to come into existence. I look forward to working with other people with a similar interest (bored developers? Google Summer of Code students?). Let’s make this happen! Any and all comments are welcome…

Source: http://blog.hansdezwart.info/2009/12/01/a-design-concept-for-a-mobile-moodle-application/