Canary

Rebuilding global community trust and confidence together... one canary at a time.

Comment

Inspiration

Although restrictions are being lifted, we know the world will never be the same. We hesitantly and cautiously approach the public but remain shrouded in uncertainty. With the most recent community constructed feedback, Canary (like a canary in a coal mine) is built with the goal for users to make more confident judgements on where they and their loved ones can safely and comfortably go in public ahead of time. It's vital that businesses and public spaces open safely and responsibly. We hope businesses can also use Canary to reflect, track and adjust how your business is operating based on customer feedback.

What it does

Canary is a web app where people from the community collaboratively leave ratings/reviews/feedback on public facing areas/businesses, rating these places on how well they were enforcing safety measures (cleanliness, social distancing, customer service) to prevent further spread of the virus. Users can directly search for locations or query based on category and requirement they want to check (ex. I am looking for a grocery store with social distancing near me). This will pull up the top rated places near the user, upon selection of one, the detailed average ratings for the location will pop up with and incoming comments coming in through the feedback box. If the ratings are turning out quite low, the app would suggest alternative places/activities for you instead (ex. this Sharetea is overcrowded will lead to a suggestion to instead try Yi Fang nearby, a Shartea location further away or direct you towards third party takeout apps to get your bubble tea delivered)!

How we built it

Wireframed and prototyped on Figma then bootstrapped create react app to start and went from there. We used Google's material-ui to create a consistent AppBar across our pages that conditionally changes colours based on the category (Groceries, Department Stores, Restaurants, Public Spaces) being searched. We utilized Google maps API to embed the map and autocomplete our location searches that prioritize nearby spots first. We used Cloud Firestore on our back-end to build our schema and connect our queries.

Challenges we ran into

Gridding and responsiveness is still a mess on the front-end and we had trouble connecting firestore from the backend. Also due to work/schedules during the weekday we only had a day to attempt developing our visions, not to mention wanting to also attend all the great IvyHacks workshops/events which contributed to cutting our time short.

Accomplishments that we're proud of

A good chunk of our team is completely new to project based development/hackathons in general so it really was a huge learning from scratch and peer mentorship opportunity! So regardless of functionalities we didn't have enough time to implement or unpredictable screen-size gridding or firebase configuration fails we're all very proud of everyones contributions. React was fun ;)

What we learned

A LOT OF REACT (but there's still SO much more to learn), simple API integrations and how to struggle with Firebase databases.

What's next for Canary

Moving forward we would really like to add more accessibility features into the app so it's usable for any demographic. Going into designing the web app we went for a fun yet soft colour palette and rounded edges to convey friendliness as the only way the app to function is through community collaboration. Integrations of speech-to-text then natural language processor to parse details in the review form! Simplifying what we can so elders and disabled can easily use it. We also wanted to integrate a visual graph with different views that maps the average rating data by days of the week or hours in an operating day, this would be beneficial for users and businesses. Furthermore, integrating this web app into a Chrome Extension so that whenever you're simply searching locations or activities the data can popup via extension so there's no need to specifically go to the site to search the location.

Share this project:

Updates