SupportBLM

Want to help with the Black Lives Matter protests but don't know where to start? SupportBLM provides access to information about protests, petitions, donating, and more techniques you can use to help.

Comment

Inspiration

The protests that have rightfully erupted over George Floyd's death made us want to do something, but it was hard to know exactly what - we found resources through google docs shared many times through instagram or passed along between friends; we heard discussion of going to protests but were unsure what to do if we were unable to do so. SupportBLM gives people a clear place to start: here are petitions to sign, books to read, places to donate if you are capable of doing so, and protesting tips.

What it does

Provides the user with information on:

  • Calling and emailing officials on both a national and local scale
  • How to support Black-owned businesses
  • Tips for safely protesting
  • Books to read to gain a broader understanding of the situation

Provides user with the opportunity to:

  • Directly sign petitions
  • Directly donate to organizations
  • Search for protests near them
  • View recent news articles related to BLM

The site is also easy to add new functionality to, which we are working on.

How we built it

The project is reasonably simple behind the scenes - just HTML, CSS, and JavaScript. The project heavily relies on iframe and modals to create popups that allow the user to access many different petitions and donation sites in one spot. The news feed relies on an RSS widget. The whole goal was to make a clean and simple user interface that had all the information users would need and tasks users would want to perform in one spot. The site is hosted using repl.it.

Challenges we ran into

One of the biggest challenges was getting the news feed to work - we ended up using a widget that did it for us, but in the future we'd like to code in our own version. We also struggled with getting some sites to connect with the iframe - for example, we still haven't gotten change.org to properly load in an iframe. This was partly difficult because the project is hosted using repl.it, and hyperlinks have specific requirements we were unaware of. We also had some difficulties with the map displaying protest locations, and ran out of time completing that. Finally, we had a brief moment of concern wondering if iframes were secure ways to donate money through (seeing as that often requires sensitive information) but were able to determine through mentors that it was secure.

Accomplishments that we're proud of

We're very proud of how the website looks and how the user is able to interact with different petitions, books, and donation sites easily and cleanly. The horizontal sliding, for instance, allows the user to scroll through many options easily, and makes the site more accessible across different devices. Seeing the site start to come together as a usable tool was very exciting.

What we learned

We learned a lot about the Google API early on when we were trying to use Google Maps for the protest map (ended up not being used in the final site). We also improved our design skills in the process of creating a better user interface. We also continued to improve our approach to web dev and understanding of the tools that go into it.

What's next for SupportBLM

One major thing is expanding the donation and petition sections to be more complete, and getting iframes with change.org links to work - I think they have a semi-retired API that is half of the issue. Another is improving the map - getting a list of e.g., facebook events and having them show up as pins on a map would be way better than the current map stripped from a U.S. News article. Finally, adding a way for people to contact an email associated with the site to suggest improvements would be pretty nice.

Built With

Share this project:

Updates