← Back to Archive

DrinkSmart with OO Design

GWT JavaScript CPSC 310 Project
DrinkSmart Cover

A web applet using Google's app engine and BC government's database to help cyclists to find the drinking fountains along their routes.

Project Overview

DrinkSmart is a CPSC310 course project and a group effort of 4, following a scrum software team process and an agile process model. Making use of the dataset of drinking fountains from the city of Vancouver, DrinkSmart aims to help joggers, runners and bikers to easily get hydrated without carrying around water bottles on the road.

Users can view, save, rate and review drinking fountains by logging in to their Facebook accounts or registering new accounts on the website. The comments are shared with all users registered or unregistered to save time while doing sports activity.

My Role

The final product is a responsive web AJAX-rich application built with GWT using an object oriented design pattern. I took on the role to design data object, build UI and manage events. To enrich the functionality and ease of use, the interface is kept clean and simple without rich colors to distract user's attention from the map.

A black geo tag differentiates itself from the red ones which is designed to be moved by the user to display a list of drinking fountains near a specific location. Users can view the top 10 rated drinking fountains and their personal collection easily by tapping on the different tabs of the table list which is sorted alphabetically to switch view.

Key Features

  • Interactive map with drinking fountain locations
  • User ratings and reviews system
  • Facebook integration for authentication
  • Personal collection of favorite fountains
  • Top-rated fountains leaderboard
  • Location-based search functionality

Tools & Technologies

Java CSS GWT AJAX JUnit Adobe Photoshop Google App Engine