The task in the brief given,  in  a nutshell, was to re-designing Wikipedia. The main task was to re-imagine Wikipedia’s website into an infotorial-styled layout to allow for more focus and understanding of Wikipedia’s content as well as the as the website as a whole. It was also tasked by the brief that improving the user flow of the donation feature for Wikipedia as that is their main source of income as well as implementing a nudge strategy to improve donation frequency is a must. Lastly the brief asked to improve the findability and credibility of the articles of Wikipedia via implementing new systems in place.

These are the layout for the top-fold (first thing you see when entering a website) of the home page and a article page for desktop and large devices.

These are the layout for the top-fold of the home page and a article page for Smaller display devices.

These are the layout for the top-fold of the home page and a article page for small devices and mobile devices

This is the final, re-designed, user flow of the process of giving a donation. The entire idea of simplifying this was inspired my Mozilla's donation method, as it used minimal fields and is extremely efficient in its pace and senselessness of the process of donating.

This is the original user flow of the donation process of Wikipedia currently. It is clear there are far to many steps, too much room for user deviation and user error as well as the fact that when you click donate on Wikipedia, it takes you to a new page called Wikimedia of which can quickly put off a user to potentially lose a valuable donation.

This is the new suggested user-flow. This was created with the user in mind meaning, they want this to be done with ease, clarity and safety. What has  mainly been done is the chances of user error and deviation has been reduced as well as reduced the steps involved by hybridizing some steps and well as simplifying the fields and user input ares as well as lifted some odd restrictions.

Here, decisions were being made as to what belongs where from Wikipedia’s side nave as is clearly has far too much. Thus it was a process of understanding what these links where and what they did. what deserved to stay and what could be combined with each other.

The final navigation designs came down to having two navigation, the primary one being the top navigation used for all the main functions like writing, donating and profile & preference management. This is also a place where my 'nudge' strategy lives to lightly push users into donating with a very  clear 'donate to Wikipedia' button. Whereas the side navigation acts as a way finder within websites, using headings and subheadings to act as jump links and a visual aid to tell the user where they are in the page or the article they're reading. 

The top navigation also has a collapsible toolbar that contains Wikipedia user functions like 'Edit', 'Page Information', 'Recent Changes etc. Other pieces of the original navigation that were considered less prioritized were place in the footer of the website.

Adaptations of the navigation and tool bar on mobile

In the beginning the colors were only grades of grey and green. The reason for this was the the grey was an echo of the original color scheme of Wikipedia and green acted as an accent color that would help draw focus to elements within the page.  After some research was conducted it was decided to add another accenting color that would help the users be more active as well as develop a better visual hierarchy while using the other colors to improve overall readability. 

Two typefaces were chosen for this project of which were Roboto and Raleway. Why these two typefaces? Well firstly Wikipedia is used by countless people all over the world, of which there is no real demographic to narrow down who the primary users are thus the smallest possible user needs to be considered as they may not have fast internet to be able to easily download large websites in terms of data size. Therefore Roboto is the solution as its design calls for small files sizes and thus reducing the overall size of Wikipedia'a pages. Roboto also is easy to read on every device thereby improving the reading experience of large bodies of text. Raleway pairs beautifully with Roboto and is used for headers, titles and buttons as this helps to make the website seem less bland and also acts as an echo of the Wikipedia logo and the letter 'W' in Raleway looks similar to the Wikipedia logo's letter 'W'

How the 'nudge' strategy was put in place was clarity was given to the user as to why donations are needed by extracting quotes from within Wikipedia and Wikimedia and using them to appeal to the humane side of users which sits next to a ‘donate’ button along with the Wikimedia icon to reduce the fear of going to the Wikimedia page to donate. This Strategy will be placed under the search bar on the landing page as well as the right pane of article pages. This event will only happen occasionally as not to be something that becomes a common sight to frequent users rendering this strategy a  a 'nudge'  rather than an ad.

Findability was improved through fixing the search engine of Wikipedia, similarly to Wikipedia’s mobile search engine, when typing in the search bar; suggested results that match or closely match what the user is typing are displayed. Another system in place are filter options of which include ‘type’,  ‘category’ and  ‘publication date’ of which then help the user find relevant information. There is also an option to only search for high grade information to tie in with information credibility.

How information credibility was implemented was through an article grading system. Articles are given a grade based on 2 aspects, user votes and author credibility. User votes can only be made by all registers users , but user votes made by a more credible user credibility have a heavier impact. Credible users are users whom are experienced and have verified certifications. Users can give a vote of appreciation with an accompanying reason or a vote of concern to voice any issues with the article. Author credibility goes into looking at if the author has the academic standing to write this article, as well as the how many articles of which are high standard to then act as proof this author acts professionally and ethically. These two elements then give the article A – D grade, of which A / B are high grade and the rest aren’t, thus promoting users to write more credible articles so that they are read.

This project is about re-working Wikipedia and its core functions to make it more user friendly, to bring in more donations and to make its information more credible. The design solutions were made to target everyone, from the user with little bandwidth new to Wikipedia to veteran users of Wikipedia. Firstly the navigation was compressed to a high performance navigation system that provides only the essentials in relation to the page you are on, for example the edit button won’t pop up in the navigation if you’re in a place that cannot be edited, nor will other buttons that have functionality elsewhere within Wikipedia. The side navigation was kept but its function is not for navigation but  to tell the user where they are within the page which contains jump links to the headings in the page giving the user clear guidance and full way finding control, this allows for this side bar to contain the contents of articles. Next findability was improved through fixing the search engine of Wikipedia, similarly to Wikipedia’s mobile search engine, when typing in the search bar; suggested results that match or closely match what the user is typing are displayed. Another system in place are filter options of which include ‘type’,  ‘category’ and  ‘publication date’ of which then help the user find relevant information. There is an option to only search for high grade information, this is where information credibility comes in. Articles are given a grade based on 2 aspects, votes and author credibility. User votes can only be made by credible users, these are users whom are experienced and have enough verified certifications,  to them give a vote of appreciation with an accompanying reason or a vote of concern to voice any issues with the article. Author credibility goes into looking at if the author has the academic standing to write this article as well as the how many articles of which are high standard to then act as proof this author acts professionally and ethically. These three elements then give the article A – D grade, of which A / B are high grade and the rest aren’t. Moving on to donations or the 'nudge' strategy, clarity was given to the user as to why donations are needed by extracting quotes from within Wikipedia and using them to appeal to the humane side of users which sits next to a ‘donate’ button along with the Wikimedia icon to reduce the fear of going to the Wikimedia page to donate. The donation flow has been reduced to essential information in one page to make the donation process seamless and fast. The overall layout for Wikipedia uses the Roboto font to reduce the page load time to work for the small users as well as appeal to the users through its simplicity and geometric look.