Public Lab Research note

Outreachy proposal: Revamp the website interface and add User friendly features

by vanshika421 new contributor | | 89 views | 5 comments |

Read more:

About me

Name: Vanshika Gupta


Github: vansjyo

Affiliation: Third year Undergrad at NITK, Surathkal

Location: India

A web enthusiast, with an aim to add value to the way people live their lives by implementing what I have learned so far. I aspire to do research in computational sciences and mathematics and am always open to new Technology and topics

Project description

Revamp the website interface and adding User friendly features

Abstract/summary (<20 words):

Provide an appealing user interface and adding more involved features to ease browsing.


Currently, the website has a lot of scope, pages and activities that a visitor can perform and browse through. However, for a first timer, the website is not much friendly and not much appealing to its users. Also, very less internal features are available and have a huge scope of enhancement. The website more user friendly and more features (both major and minor) can be added to the website, which will make the overall website more organised and easy to browse through.This will also include some minor back-end and front-end bug fixes subsequently that will have a major impact on the overall experience of the website.


Milestone 1: Modifying the People Page

Current Idea:

  1. Changing the rows displayed to responsive and appealing cards with data organised meticulously.
  2. Modify the overall layout of the page to display the map on the right side to make optimum usage of space.
  3. Minor bug fixes include:

  4. Hovering on the map causes disorientation of the web page.

  5. Add search bar to search people by username.

Milestone 2: Modifying the Tags Page

Current Idea:

  1. Show responsive appealing cards instead of rows.
  2. Add statistics representation options(eg. Pie Chart, Bar graph)
  3. Expand scope of tags, ie. Give option to explore statistics, for eg. show graphs to represent popular tag's frequency occurring in conjunction with the users' searched tag.
  4. Minor Bug fixes:

  5. Clicking on (Show Graph) should toggle the state of display of canvas. (currently, it adds another canvas display on multiple clicks).

  6. Give Option to view canvas in separate page.

Milestone 3: Modifying the Questions Page

Current Idea:

  1. Modify the card and display contents in a more organised matter.('Post an answer should be pinned to the end and tentatively add darker shade bubbles for likes and comments instead of '|' pipeline as separator).
  2. "Ask a Question Here" input search box is not needed, instead we can have a button which redirects us to a form where it can.
  3. Allow various more filtering options for questions based on popular tags, etc and allow search question by title, author etc.

Milestone 4: Modifying the Dashboard Page

Current Idea:

  1. Show lesser activity as compared to the current number.
  2. Add a row section of cards to enlist the scope of the website rather than placing buttons for it randomly anywhere on the screen.
  3. Show recent activity based on a combination of recent activity, subscribed tags and most popular.

Milestone 5: Adding common features

Common additives to all pages.

  1. Adding a proper introductory text to enlist the scope of the page, below the heading of the page.
  2. Extend and clearly define the scope of the search input.
  3. Add option of filters rather than tabs for sorting. Give option of adding multiple filters wherever possible.(eg. In "Questions" Page, filter "Unanswered" + "Popular" Questions.). This will help find things of their interest easily.
  4. Adding a customised loader to the website.(Like this)
  5. Change the title according to route. (eg. The title of the web page of the the route /people should be "People | Public Lab" instead of "Public Lab | People" to ease navigation for a user with several public lab tabs opened).
  6. Enhance footer with interactive Bootstrap Icons for links to Github and more, and decrease the text. Balance font weights. Position of "Scroll to Top" button should be fixed to the bottom right corner of the screen.
  7. In case of smaller screen view, Clicking on anywhere on the web page should close the menu opened using navbar icon.

Milestone 4: Optional

Current Idea:

  1. Add breadcrumbs.
  2. Add 3D animations to the canvas graph representation on 'tags' page.


What resources I will need: people to guide me, documentation for new features mostly available online.

First-time contribution

I have recently started working on some of the issues.


  2. ...


  2. ...


I started coding in C as a course in the first semester of college. Before that, I didn't have much experience with coding except for basic HTML and VBscript. I first got my hands on development in my first year at college when I proposed to create an Ecommerce website for my college supermarket as a part of an IEEE project(GitHub link). I started learning HTML, CSS, Materialize, JS, ajax, EJS, Angular and eventually node.js. That was the project which shaped me as a developer as I did every bit of it by my own and from scratch.

Further, I built Oauth Applications, Disaster Management Web app, and also became a part of many other projects in my college (INCIDENT'19, WebClub). I also published a research paper on 'Dimensionality Reduction of Hyperspectral images using spectral clustering' while being a summer research intern at IIT Mandi, during which I learned MATLAB.

I interned at a startup Carabiner Tech. as a software Development Intern for about a month where I added some features to the OCLAVI API(unlocking feature, adding image editing options). Apart from node.js, I learned Django, React. I am currently working on learning Python and Ruby. As a part of Open Source, I have also made contributions to the Mozilla Profiler Codebase(PR1 PR2) and TaskCluster(PR1),


Describe teams you've worked with before, whether open or closed source, and in what capacity you participated.


What about our projects, and Public Lab, interests you? What are you passionate about? Open science, environmental justice?


Whom do you want your work to help? We especially appreciate proposals which make technologies and techniques more welcoming and friendly to those who've often been excluded.


Hey @vanshika421 , Great proposal. Love your detailed timeline/milestones however could you add mockups or images/sketches or charts to visualize further what you have in mind. Also It would be nice to break down the tasks into weeks so that you have a timeline for each week. The experience bit looks great too.Thanks

Reply to this comment...

@cess This is a draft for now listing the tasks I would like to take up. I am working on the mockup and will put it up soon. However, it would be great if you could suggest me if something listed in the tasks is irrelevant or not needed. Thanks a lot :).

Reply to this comment...

@gauravano @warren @bansal_sidharth2996 could you review this too for finalizing the list of tasks.

Reply to this comment...

Great work, @vanshika421. I especially love your experience in programming. Since that shows you've worked in teams before, you can talk about those teams in the Teamwork section. Also, the Passion and Audience sections are not filled.

Reply to this comment...

Yeah @madeofhuman. I'll be updating it soon. Thanks a lot for your review πŸ™‚

Reply to this comment...

Login to comment.

Public Lab is open for anyone and will always be free. By signing up you'll join a diverse group of community researchers and tap into a lot of grassroots expertise.

Sign up