Page MenuHomePhabricator

GSoC 2022 / Outreachy-24 Project Proposal: Edit Request Wizard
Open, Needs TriagePublic

Description

Profile Information

Name: Navya Bhatia
Email: navyabhatia10@gmail.com
Web Profile: GitHub, Linkedin
Timezone : IST (Indian Standard Time) (UTC + 05.30)
Location (country or state): Uttar Pradesh, India
Typical working hours (include your timezone): 18:00 IST to 01:00 IST (5 - 5.5 hours on weekdays), 10:00 IST to 22:00 IST (10 - 10.5 hours on Saturdays and Sundays)

Synopsis

Edit Request Wizard is a project that aims to create a step-by-step form to help beginners submit a Wikipedia edit request. An edit request is a request for someone to change some text in an article. Edit requests are a crucial part of Wikipedia. The goal of this project is to redesign the whole process in a fun and interactive way, such that beginners, as well as professionals, can edit the articles with ease without thinking and worrying about rules, and edit request made also complies with Wikipedia policy. At last, this would make editing more accessible for people from all backgrounds.

Project Details

This proposal aims at developing an Edit Request Form, so that anyone around the globe irrespective of their background, can edit the article with ease. The following list defines the proposed workflow of all Outcomes proposed in the project.

NOTE: This section is just the draft of the project, which is further needed to be discussed with mentors and other community members for a more interactive form.

Screenshot 2022-04-17 at 10.42.22 AM.png (578×871 px, 94 KB)

FRONTEND PART

  • Designing the form with input fields for adding facts i.e source, quote, type of source and quote, selecting relevant tags, etc.
  • The form will also have buttons for previewing the article, final submission, reset button, any extra comments, etc.
  • The form will also have guided mini-tutorials in the form of a "?" icon. When clicked it will guide the user on how to proceed with that field.
  • What would happen when the user clicks the dropdown menu to select the type of source?

When the user clicks on the dropdown menu, a list of all types of sources users can add, i.e ISBN, URL, etc. gets displayed. This will help us to check for every error and validate the source accordingly.

  • INSTRUCTIONS /TUTORIAL( "?" icon)::

This button shows how to add reliable sources to the page i.e process of it (first to select the type of source then how to cite it ) and what is the source, types of source explanation with concrete content(as minimal text as possible), etc.
Also, we can have the whole tutorial (by combining all these small tutorials ( when clicking on “?” icon ) on how to make edit requests, together as a whole tutorial on a different page for users who want it all, and also the mini-tutorial listed on right side of each field for users who want to move step by step.

  • How would a user know that they were supposed to click the dropdown menu first?

If the user tries to enter or type the source first, we can add a feature (where a box zigzags on the screen in place and displays an error to first select the type of source ). This way we will not have to write everything on the page itself and the user will be able to follow it.
https://codepen.io/insite-tyler/pen/jOgPOe
This is an example where the input box shakes when an incorrect source gets entered or the user first tries to enter the source instead of selecting its type of it. In this way, we minimize the written content and make a fun and interactive way for beginners to make an edit request.

BACKEND PART

  • The backend server will validate the source URL i.e the entered source is valid or not.
  • The form will also validate whether the quote comes from a valid source or not.

Deliverables

  • A well-designed Mock-up for the web form of ‘Edit Request Wizard’.
  • Implementing design and text areas for source, quote, etc.
  • Design the feature for displaying feedback whether correct or wrong and how to display error messages in an as minimal and interactive way as possible.
  • Design form in a way such that each section has a guided tutorial in form of a question mark " ? " for beginners.
  • The frontend Technologies used are HTML5, CSS3, Javascript, and React.js

Phase I evaluation

  • Developing a backend, for URL validation checks for each type of source, etc.
  • Backend Tech stack used is Python

Phase II evaluation

  • Designing the user script of the form for submitting a Wikimedia edit request along with the frontend and backend behind its high-quality guidance and error messages.
  • A backend server that the user scripts will make calls to for checking websites and other purposes.
  • Integrating backend and frontend and check if frontend easily communicates with backend
  • Stretch Goals - an interface to show these edit requests to experienced editors as they read the article and an interface for the general public to express feedback on these edit requests.
  • Bug fixing and writing documentation.

Final Evaluation

Timeline

COMMUNITY BONDING PERIOD : ( May 20 - June 12 )

  • Know more about Wikimedia's community, its work ethics, and keep up with it.
  • Interact with the mentors and discuss deadlines and milestones with them.
  • Think of much more interactive ways to present tutorials and minimize the written content as much as possible.
  • Study and analyze in detail the rules and policies on reliable resources and how to present them in an as minimal way as possible.

CODING PERIOD

PERIOD TASK
June 13 - June 19 Designing the mockup UI and finalizing the design with the mentors
June 20 - June 26 Implementation of the UI design(frontend part) - Adding Input Fields for facts (source, quote, type of source/quote, choosing tags, source, etc). Write the bi-weekly report.
June 27 - July 3 Implementation of the UI design(frontend part) - Adding other relevant details like preview button, reset button, the last final submit button, deleting /updating something, error & pop-up messages and correct icons/symbols wherever needed (according to the design) ,etc (according to design)
July 4 - July 10Implementation of the UI design(frontend part) - Adding mini-tutorials (in ques mark icon) for beginners. Also, integrating them as one whole tutorial for anyone who wishes to watch them all together. Write the bi-weekly report.
July 11 - July 17Finishing any backlogs and fixing bugs of the frontend part. Also, seek out mentors for further improvements. Write the bi-weekly report..
July 18 - July 24 Discussion with mentors & community on what rules & policies have to be included (for validating inputs) and how to present them. Write the bi-weekly report
July 25 - July 29Phase 1 Evaluation
July 30 - Aug 5Discuss with the mentors the entire workflow of the backend part (implementation). Write the bi-weekly report.
Aug 6 - Aug 11Implementing the backend - Adding validation for website link & books ISBN as a source. Write the bi-weekly report..
Aug 12Implementing the backend - Adding validation for if the quoted text comes from the same source. Write the bi-weekly report.
Aug 13 - Aug 19Phase 2 Evaluation .
Aug 20 - Aug 26Working on backlogs, bug fixes, unit testing, and any further improvements on the backend validation part after discussing with the mentors
Aug 27 - Sep 2Integrating the frontend and the backend. Test the entire project and if the frontend can successfully communicate with the backend and display the appropriate data to the user. Write the bi-weekly report.
Sep 3 - Sep 6Developing an interface for the general public to express their feedback on edit requests. Write the bi-weekly report.
Sep 7 - Sep 9Preparing up the final report, Adding summarized rules and policies to the form in an interactive manner, Fixing-up bugs, and cleaning up code for submission.
Sep 10 - Sep 12Submitting the final code for mentors for review
Sept 13- Sept 19Evaluation by mentors
Sep 20 Initial GSOC 2022 Results Announced

Participation

  • I’ll be creating a repository on GitHub with a master and a development branch. The code will be pushed to the development branch periodically and merged with the master branch after reviewing and testing. The bugs and subtasks will be managed on Phabricator.
  • I’ll write bi-weekly reports, predominantly in the User namespace, and update them on my MediaWiki user page. To make general project-related work and information more accessible, I will also occasionally write Medium articles.
  • I’ll consult with my mentors in the Phabricator task, and/or in Zulip as per the requirements, in case I’ve queries regarding the implementation/workflow, etc. I’ll be active on the MediaWiki-General IRC channel to ask general doubts related to MediaWiki.
  • I’m reachable from 10:00 IST to 01:00 IST and can be pinged or DMed during working hours via any of the above platforms including email

About Me

Your education (completed or in progress):

I’m a third-year student at the National Institute of Technology Agartala, Tripura, India pursuing a Bachelor of Technology in Computer Science. I've completed my secondary education at Delhi Public School Azaad Nagar, Kanpur, Uttar Pradesh, India.

How did you hear about this program?

I heard about Google Summer of Code and Outreachy in my freshman year during a workshop that was being organized in our Institute. In that workshop, students talked about its perks, their experiences, contributing to the open-source organization, etc.
The very idea of working on a real-world project in a sought-after organization and at the same time getting the opportunity to learn and grow as a developer fascinated me.

Will you have any other time commitments, such as school work, another job, planned vacation, etc, during the duration of the program?

My end-semester exams would be conducted between May 5 and May 20 Since the first week of the Community Bonding Period lies in this period, I’ll plan my schedule accordingly to keep up with the events such as getting familiar with the community, and discussing strategies with my mentors to consolidate the timeline and milestones of the project.
But I’ll focus on GSoC/ Outreachy for more than the typical working hours mentioned above from June 7 to July 26. From July 26 onwards (that’s when my fourth year of college commences), I’ll continue as per the specified typical working hours. Rest assured, I'll be in touch with my mentors and inform them of my progress regularly.

We advise all candidates eligible for Google Summer of Code and Outreachy to apply for both programs. Are you planning to apply to both programs and, if so, with what organization(s)?

I am applying for both Google Summer of Code and Outreachy.

What does making this project happen mean to you?

The vision of the Wikimedia Foundation is to empower everyone with as much knowledge as possible. I’m inspired by the contributions of the volunteers who help sustain the goal of providing free knowledge to all. By working on this project, I’d like to continue its mission and empower many people.
Another reason that inspires me to take up this project is that it would help all users irrespective of their background to edit articles with ease. Implementing this project would help me apply my skills practically and get to learn new things by interacting with some of the best developers around.

Past Experience

  • I’ve worked on various JavaScript projects which have helped me gain proficiency and intuition in the internal structure and details of how things work together in JavaScript and its frameworks. I undertook the role of front-end developer as an Intern at Sapio Analytics (from Feb'22 - April 22) where I revamped the entire user interface of their website. I gained good exposure to UI/UX, Frontend Development, and user-driven outcomes.
  • I contributed and made several personal projects which helped me become familiar with core Javascript Concepts and React.js.(GitHub ).
  • Some of my projects are : Google Keep Clone (Github Link), Super Mario Jump (Github Link) etc.
  • In AAYAM 7.0, technocultural fest(Robotics Competition) at NIT Agartala, our team secured the second position in Line Follower Competition out of 50+ teams registered for it. This massive project-based learning event not only taught me how to manage time effectively but also techniques to collaborate remotely and get work done.
  • I was a part of a team that developed a prototype of the Eye Blink Detection system using OpenCV as part of the project under my college professor. (GitHub).
  • I am proficient in C/C++, HTML, CSS, Bootstrap, JavaScript, React.js, Node.js, Git, Linux, and Python (which I've taught myself during the period between Mentor Orgs announcement and Student Application Period, for gaining a sort of intuition in Backend Development).

Microtasks Carried out

MICROTASK 1: Make an edit request and write about it
These are notes on on how to make an edit request and what improvisation we can build in it .
Link: Mirotask 1
MICROTASK 2: Design a form input that allows the user to input a source.
Designed a form I put which displays correct and wrong sign according to the source entered.
Link: Microtask 2
MICROTASK 3: Implement a form for a quote.
Created 2 input fields(source &quote) which takes sentences /paragraph as input and checks whether text of quote is present in source or not .
This is just the prototype , as in source, URL will be entered and we will extract it's data and then check whether text of quote is present or not in the text (data extracted from url).
Link: Mirotask 3
Code : Github Link
MICROTASK 4: Validate a URL.
Created a React.js + Python web app which validates the URL entered by the user.
Hosted Link: Microtask 4
Code: Github Link
Backend Hosted Link: Link
Backend Code: Github Link

MICROTASK 5: Complete the user scripts tutorial.
Link: Tour

Event Timeline

@srishakatux Please add my proposal to “Proposals in Progress “

NavyaB.10 renamed this task from GSoC 2022 Proposal: Edit Request Wizard to GSoC 2022 / Outreachy-24 Project Proposal: Edit Request Wizard.Apr 18 2022, 1:55 PM

As the GSoC deadline is soon approaching in less than 24 hours (April 19, 2022, 18:00 UTC), please ensure that the information in your proposal on Phabricator is complete and you have already submitted it on the Google's program website in the recommended format. When you have done so, please move your proposal here on the Phabricator workboard https://phabricator.wikimedia.org/project/board/5716/ from "Proposals in Progress" to the "Proposals Submitted' column by simply dragging it. Let us know if you have any questions.