Public Lab Research note

Outreachy proposal: New Dashboard Implementation with Bootstrap 4

by Codenlyn | October 25, 2020 08:57 25 Oct 08:57 | #24809 | #24809

About Me

Name: Damilola Ale

Location: Nigeria

An interesting fact about me: I love teaching and solving Mathematics.

Project Description

Public Lab needs to implement a new dashboard. A new design that makes the user interface more user-friendly, accessible and improves user experience. This has been done by reducing the number of items displayed on the dashboard and shifting the focus on the user as opposed to the content.


With the latest design available. I would like to join the Public Lab's team in the implementation process using Bootstrap 4. The tasks needed for the implementation have been shared and there are two main parts to the project;

  1. Create a new page for 'All posts'.
  2. Implement the new design for the dashboard.

i. Create a new page for 'All posts'.

According to the design which has been planned out by Public Lab, the All posts page is to be created with reference to this page. This I totally agree to. It is neater and more user friendly than the current posts page. It can also be easily created with Bootstrap 4.

image description

    • I also agree with new link '/dashboard/all' and in addition, the link to all posts should be visible. This suggestion is based on the fact that the new dashboard will contain lists of topics and not posts. If I am correct each topic will or should lead to posts under that particular topic. As a user, I may not want to view posts according to the topic and I would need to view the full posts. A visible link possibly in the nav should be added.
  • For the posts, another major reason tags page should be used is because of the filter added. The filter is very important in the posts page. The sort by should not only be restricted to recency. I believe likes should be added because some users who are in a rush to view a particular topics post may want to view it according to its quality. sorted by likes or star will help reduce the time to search for the best post.
  • Adding a comments tab will make the website more presentable. It will be better than the present way comments are added. Every post has its comments page or card.
  • I also agree that comments entries may need to be displayed in a "card" format, like notes, but should show the fields: author, link to the node, permalink, # of comments on the parent node, time ago.

ii. Implement the latest Dashboard Designimage description

This is the latest dashboard design for Public lab.

It will initially contain a new URL '/dashboard2' so that the previous dashboard can be used while the new one is being implemented.


I was a student of Microverse remote school where we work remotely using pair programming.


I have always wanted to contribute to open source but there has been no major guide for me to contribute. The public lab will be a stepping stone to my open source contribution and also deepen my knowledge of Ruby, teamwork and working on a large database.


Public Lab is an organization where members of the community work together to solve environmental problems. You can post an event, a research note or ask a question using the editor or wiki.

The new dashboard and 'all post' design implementation will be beneficial to the Public Lab community. It will be easier to navigate the pages and simple enough to understand for new members joining the community.

The list of tasks needed for the project can also be implemented by first-time contributors such as creating new routes.


I understand that to achieve all these, I need to be fully committed. I have decided to devote 40 hours weekly to Public Labfully achieve all the goals I have set.


Hello @Codenlyn! thank you so much for your proposal! I do want to note that we have a pretty well-developed design already and that we are aiming to stick to it for the big changes -- however your input and design thinking skills are very welcome on specifics that aren't covered by our mockups! You can see the mockups in, for example, the proposal by @ruthnwaiganjo -

My apologies if this was unclear in our proposal posting. I like your ideas a lot and hope you'll find ways to put your creative thinking to work on the unresolved portions of the design! Also please see the style guide posting at for more on specific styling conventions we're planning to stick to. Thank you again!

Thank you for the review. I would work on it

Reply to this comment...

Login to comment.