Wikipedia
Summary
Wikipedia is a useful resources when comes to information searching or doing research but the problem is that the UI/UX hasn’t changed since the website was launched. Let’s find out about this project.
Overview
I started this project during my spare time questioning to myself “What and how I can improve on the Wikipedia experience?” I wanted to challenge myself how I can help users to have a better user experience whether they are browsing or researching contents on Wikipedia without losing the “Encyclopedia” experience that we all know. Did you know that Wikipedia average more than 18 billion page views per month? That is incredible as how people using Wikipedia as their resources.
Wikipedia was launched in 15 January 2001, with some minimal improvements ever since. It’s a really old website, with it’s 21 years old. From back then until now, the internet and the way we use it has changed significantly. Back in the day, we only have small resolution monitors, the internet was very slow (fax modem and occupied telephone lines), no smartphones, no tablets, no smart TVs, or AI.
The User Experience
Nowadays, the word “User Experience” has become a really important factor when creating a product or design. We have to think about how every users will interact with your products. For this case study, I had to think about how the user interact on Wikipedia? What does the user think about it? Does the user have any difficulty reading or navigate within the page? What can I improve for the user to help them solve their problems?
What I want to accomplish?
When I started this project, I already have some idea in mind what I would like to accomplish and here’s what I want to accomplish for this project:
1. Make it simple, comfortable to browse and easy adaptable to other devices.
2. Creating an enjoyable experience for users.
3. Redesign the website with better UI Design where it’s easy for user to read and navigate.
How was approach to this?
The good and the “what could be improved?”
I first take a look at the current Wikipedia page, what could be improved? What is already good? I think that basically the visual itself could all be improved, but what else? Is there anything on the experience that could be better? For example if you search a particular subject, for my case I used Switzerland as an example for search on Wikipedia and here is the current page looks like
After my analysis I came up with some points that I think that could be better. Things like content reading experience, a more prominent search bar and minimal details that all together would create a better product.
Note that I never used the “bad” or “wrong design” words in this context. I think that Wikipedia is awesome, it truely is. And I think that a lot of great designers and people had put a lot of effort on creating it. So I think it would be unfair to call it bad or wrong.
User Research
For the user research, I’ve conducted an interview with 10 people and trying to get a better understanding on what they think about Wikipedia. I ended up creating 3 user persona which are the main type of users after talking with different people.
After the research is done, I realised that a lot of people don’t trust Wikipedia content 100%. What happened? And it looks like that they don’t trust the way that the content on Wikipedia is put on the site. Basically what happens is that everyone can put content on Wikipedia, and you don’t know who they are. This is because they are totally anonymous people who can change words and phrases whatever they want to change and whenever they want.
I could suggest some changes on the content insertion architecture (or maybe I would…) but my goal here is to design on the interface and focus on the user experience. What the interface could do to bring trust back? For the next steps I took some things in mind to build a more trustful experience:
1. Focus on the content
2. The content authors shouldn’t be anonymous anymore.
3. The visual should reflect confidence.
User Flow
After the research and a lot of thinking about how we can solve our users problems, I then created a user flow where I think what normally a user would go and do when they search for a topic on Wikipedia or even write an article on it.
Sketching Ideas
The next step I took was doing some sketches on some notebooks where I can use it for wireframes later on the process.
I did some sketches on the day and come up with a few designs that I really would like to implement it on the final design. I tried to reference as much as possible from the current Wikipedia page but also think of some new cool and interesting ideas to put on the new redesign Wikipedia page.
Wireframe
Soon after I finished doing sketches, I quickly jumped onto Adobe XD to do some wireframing. So this is the wireframing that I chose to use to design for the final product. I really like how they layout is being presented here as it stills give you the “Encyclopedia” feeling but also giving you the new fresh look of Wikipedia.
Final Visual Design
Finally, above is the final version of the new Wikipedia page redesign. I have redesign the Wikipedia “Logo” to make it a bit more cleaner look and feel to it. I added the full image of Switzerland Scenary as a hero image as it draws the user attention to the middle where they will read the summary text. I also added relavent Medium post for users to have a read about the topic that they searched, this provides them a better understanding about the topic/subject that they arre looking for.
The most commonly problem that I see users while doing usability testing is that, they never used the side bar menu once. From all the users that I have interviewed, I haven’t seen anyone one of them use the side bar menu. So I took the change to redesign the side bar menu so that users would want to click more often than the current, when they wish to view more of the content.
Overall Learning Experience
This was a fun project to work on for redesigning a Wikipedia page. I have learned so much things during the process and able to understand how and what the users uses Wikipedia for on their everyday life. I never stopped learning as there are always a lot more things to learn and keeping up to trend are also important as a UI/UX Designer.