Website Application Development as of 2013-12-27

I have been working on the website application development (infrastructure, database structure, adding trash markers, viewing the data, etc.) the past couple of days (since Dec 24th).  The website development is being created before working on the mobile app because we need to know what should be collected via the mobile app and to be able to view what we have collected via the mobile app.

Below are several screenshots of the Map, the List, the Calendar, and the Add Trash Marker form as of 2013-12-27 (a minimal viable product for some 🙂 ).  The pages are very crude, especially any design elements…because there are no design elements created yet — it is all coding, which is what is “under the covers”.

On the Map, the green leaves represent trash that was picked up, and the red leaves represent trash that was not picked up.

In the Add Trash Marker form, the user just has to upload the picture he/she took of the trash to get the time and location information.  Thus, users don’t have to spend a lot of time entering information in the fields on the form.

Trash Diary Map

Trash Diary Map (showing trash markers)

Trash Diary Map (showing trash markers)

List

Trash Diary List (of Trash Markers)

Trash Diary List (of Trash Markers)

Trash Diary Calendar

Trash Diary Calendar

Trash Diary Calendar

Add Trash Marker

Add Trash Marker

Add Trash Marker

We have close to 50 trash items / markers in the database currently. Below I explain how these trash items / markers were collected and put into the system:

  1. During the run, take a picture of the trash item with the CAMERA app on my Android-based mobile phone: LG Optimus VM696  (need to make sure the geolocation settings are turned on before taking the picture; that way the geolocation will be stored in the EXIF metadata of the picture). The data in the system at this time (the 50+ trash items / markers) were obtained via runs in June and this week during our annual Christmas run to the former Gibson Guitar factory.
  2. After the run, transfer the picture to my computer using Dropbox.
  3. Add Trash Marker using the website form. In the form, upload the picture and have the system pull the time and geolocation information from the picture’s EXIF metadata.  Also select the trash type, manufacturer, and cause.  This puts the information into the system for that trash item / marker.
  4. Then view the trash marker on the View Trash page, on the Map, in the List, or on the Calendar.

So in a sense, we have already accomplished our Jan 3rd goal of being able to use a mobile device to collect trash data.  However, we would like to make it easier for us to collect trash data…in other words, less steps to get this data into the system.  Thus, I am now researching how to develop an app for Android devices.

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.