Every community - whether that's an apartment complex, a building, or a school - has some form of biodiversity with their flora. Awareness of and engagement with your local environment is critical to sustainability. However, community members usually have no way of learning about the biodiversity in their community, and community administrators have no way to easily enable that for them.

What it does

GreenScan is an app that allows community administrators to help community members learn about the biodiversity in their community using QR codes. The community administrator enters information on the CRUD (Create, Read, Update, Delete)-capable GreenScan website using their community account. They then, with a click of a button, get access to a printable PDF with cutting lines of all the QR codes of their community flora. They can then cut and place these QR codes on the corresponding trees and plants on their community. A community member just needs to scan the code with the inbuilt camera app on their phone to get taken to a web page with the information that the community administrator entered for that corresponding plant or tree - and learn all about the biodiversity in their community.

How we built it

Wireframes and ideation were first done in Figma. The website was then built using Django, a web framework for building robust modern applications in the Python programming language. The Django templating language, which intelligently renders HTML and CSS files using input variables, was used to produce the frontend. PyFPDF is used for PDF creation and rendering.

Challenges we ran into

The main roadblock was the PDF creation. Due to a visual issue with the sizing of images when printed, the entire original algorithm for PDF creation had to be removed and rewritten in PyFPDF instead of the previous framework. There were also challenges with the serving of the dynamically generated static PDF files on the server.

Accomplishments that I'm proud of

I'm particularly happy with how the PDF creation algorithm turned out. Not only was I able to succeed in rewriting the code within the time constraint, but I also had to develop twice distinct algorithms for calculating the coordinates of everything that had to be put on the sheet. There was a lot of math and planning on paper involved in creating an algorithm which could efficiently put as many QR codes and labels for the QR codes on the sheet, while also putting cutting lines.

What we learned

This was my first time working with PDFs or any other kind of graphical format in code, so I learnt a lot about working with graphics in code, as well as common standards for the representation of these kinds of in memory. This is also one of the first fully-fledged CRUD Django apps I have built, so I learnt more about common Django classes. In particular, this was my first time working with ModelForm as well as advanced conditional statements in templates.

What's next for Greenscan

I would like to make the app more accessible in two key ways -

  1. Add automatic translation of all pages of the app, in particular, the item detail screen that people see when they scan the QR code. Not everyone in the community may speak the language in which the details were originally entered, so increasing accessibility in this way could be instrumental to the wide use of the app.
  2. Adding text-to-speech technology to the item detail screen, so that people can absorb the information even if they have difficulty reading or are on too small of a screen to read comfortably. I have developed wireframes incorporating these ideas into the app to help me plan for implementing them.

*Thanks for reading! * Please contact me at if you have any queries

Built With

Share this project: