Group Project for Wikimedia — A case study for teamwork in a UX design process (2 weeks)

The Client, the brief and the problem

With the growing popularity of video and audio content, the Wikimedia Foundation sees an opportunity to leverage their expert users and content library by highlighting multimedia content for its site visitors. This may include video content and podcasts.

We take a closer look at our client

Source: Wikimedia

We learn that between these 14 different platforms under the Wikimedia Foundation, we have to come up with a design solution to bring that 47+ million multi-media content to our text-based Wikipedia audience.

Identifying the users

We have composed a questionnaire to further understand our target users. To matches our client’s international audience, we deliberately make sure we have covered test participants from all over the world.

We learnt that:

  • 83% of our participant use audio & video content more than once every day.
  • Most of our participant watch a short video (less than five mins) online.
  • 74.1% of our participant would share online content.
  • A small number of our participant has ever created and uploaded an audio/video online, and the rest of our participant did not.
  • Most of our participant consume audio/ video content for entertainment.

Out of these participants, we further investigate our users’ thoughts on Wiki, doing online searches and also information that is available online. We conducted these users interview with scripts so we can compare our findings so different responses from for the same question would stand out more.

The following is a quick summary of our interviews:

To conclude:

  • Wiki is for searching low stakes queries

(casual research only)

  • “I trust the people that edit it but not the company.”
  • “I love Infotainment.”

Competitor Analysis

Following our user interview, we understand that most of our users mainly consume video content for low-impact learning every day and so we look at a couple of content hosting platforms:

Vimeo: Is for the creator of high-quality videos, mostly not brief.

Ted: High-quality information to watch and listen but Ted itself has all the editorial rights for the content.

Youtube: Default for visual but it is filled with adverts, and it is filled with high-quality content alongside with a lot of low-quality content as well.

So we identify a Gap in the market for Wiki, with is quality information which allows their users to contribute and also to collaborate.

Developing Personas

We have developed a persona, Tamara to help us identify the pain-point.

Credit: Nick Black

The Scenario:

Tamara has been discussing the historical event of Pearl Harbour with her friend, and she would like to learn some quick info about it :

Credit: Nick Black

So how can we help Tamara to achieve her goal?

Before we move on to identifying the critical feature, we have set up some fundamental design principle base on our findings and our brief:

these disciplines helped us to shape our selections of features which should be included in our design.

We tested these features on our paper prototype to test out our design idea:


We have tested the paper prototype, and we have the following modification:

  • Our users would prefer seeing what the app had suggested for her (a customised suggestion) for her first when she started to browse the app instead of “Today features” which is an Editor’s pick.
  • We have removed the categories from the search page because our interview shows that users would prefer using the search bar straight away instead of browsing through the suggested categories.
  • The users had found the flow from the paper prototype is easy to navigate for the given scenario for Tamara.

Lo-fi prototype

Wikimedia concept project — lo-fi prototype

Using the same scenario we have designed for our persona Tamara, we tested the lo-fi prototyped with users specifically for the following:

  • The navigation bar on the bottom.
  • The search function.
  • The display of search results.
  • The bookmark function on the video clip.
  • The suggested topic underneath the video.
  • The share function.

Our results are :

  • The navigation bar on the bottom is simple and easy to use.
  • Like the search function because it leads the user directly to what they are searching.
  • The icon for the different form of media file needs to be more visible.
  • The “expand icon” for the bookmark feature is slightly confusing, but it is still great.
  • The share function serves its purpose.

With these findings, we move on to our Hi-fi prototype.

Design Principle

We created a mood board for our project

Part of our brief requirement is to promote the multimedia database which already existed in Wikimedia. Hence we have decided to use the colour theme and font which is used by the current Wikipedia app. From our user research, our user associate Wikimedia with authenticity. To keep the apps in a similar colour and font would be a great way to express brand unity. We have tested that with our user and the feedback is “The resemblance of the Wikipedia app has provided trustworthiness.”

Hi-Fi Prototype

For our Hi-Fi Prototype, we have implemented the following design feature base on the usability test result.

  • We used the language icon from Wikipedia for users to change the app into the language of their choice.
  • The hat icon signified that this clip is “certificated” by Wikimedia to promote authenticity.
  • The universal icon to indicate what type of multi-media clip it is.
  • The clips are displayed in a photo album style for easy browsing.
  • A simple navigation bar for users to search the topic of their interest and to access the multimedia information the user had saved.
  • Once the user had got to the information they are looking for, we will have related tag below the clip to encourage the user to keep exploring in the app.
  • When the users click on the specific part of the clip, they will be bought to that part of the clip immediately.
  • The “More like this” feature is to enable the users to keep browsing other clips which were suggested to them according to their search instruction.
  • Users can also search this information via the share button.

Here is a demo of the Hi-Fi prototype:

What next?

  • From our screener survey, the second biggest group of users are the contributor to the Wikipedia database, therefore to create a flow for the collaborators would increase the user’s interaction with the app.
  • Develop the saved list to personalised preferences.
  • Test the randomise aspect for leisure users, promote the multi-media database even further.

I have had fun to work on this project. This is my first group project, and I have learned so much from my teammate.

I hope you have enjoyed reading about this and feel free to leave me a comment. Thanks a lot for your time.