Wiki Education Dashboard
A tool for onboarding people for editing articles on Wikipedia and helping professors run assignments where their students edit Wikipedia.
Timeline: Dec 2016 - Mar 2017
Project Type: Internship
My Role: UX Engineer
Tools: HTML/CSS, Stylus, Vega, Ruby on Rails, React, Flux, Atom editor, Git
Skills: Remote usability testing, Wireframing, front end development
Studied Use Cases - Personas
Privacy by Design
Designed Wireframes with Annotations
Front end using HTML/CSS, Stylus and React.
Back end using Ruby on Rails and Flux
Visualizations using Vega Js
Designing protocol for usability testing
Organizing user interview
During the winter of 2016, I was selected to intern for Wikimedia Foundation via GNOME Outreachy Program. I worked on Wiki Education Dashboard under the mentorship of Sage Ross, Product Manager at Wiki Education Foundation and Jonathan Morgan, Design researcher at Wikimedia Foundation. I worked remotely and made code contributions through Github and collaborated with project members using Slack, Google Hangouts along with Phabricator, a collaboration platform open to all Wikimedia contributors.
This project was successfully deployed and is used by Wikipedia Dashboard users to showcase their contributions and demonstrate the impact they make with Wikipedia.
Link to the Dashboard: https://dashboard.wikiedu.org/
One of the big needs for users who facilitate many programs (eg, instructors who teach many courses with Wikipedia assignments) is to be able to report about the cumulative impact they've had. The dashboard only showed statistics for each individual program. There was no way for a user to see the totals from all their programs combined.
Adding User profile pages, which would have a list of all the programs user has participated in, and graphical representations of some of the statistics over time. This project aims at visualizing users cumulative impact on Wikipedia, thus allowing them to showcase their contributions.
Adding links to user profile pages from the Course Details section in the course page and Main Navigation menu
The More Info Section can contain a paragraph in which user can add some additional information about how and why he uses Wikipedia.
User details are placed at the top as the emphasis is on the user and getting to know a member better.
Courses Taught Graph - Plotting all the courses taught by the instructor on the time scale.
Students Taught Graph - Plotting the number of students taught by an instructor on the time scale.
Adding tooltips- Providing tooltips for each of these metrics, so people can click/hover and get a definition for the metric.
Course Details Section - Displays all the courses a user has participated in.
I designed the protocols for usability testing with my mentor Sage Ross. We organized a user interview and conducted the session using Google Hangouts screen share feature, a session where we asked the user to do some tasks on the profile pages, so as to test if they were able to create their profile or find anything confusing about it.
Things we tested:
- If users were easily able to navigate to the profile section.
- If they were reading the disclaimer.
- If the features were functioning.