-
Part 1: The brief
For this assignment, we were given the task of designing a project that uses live data. I had the option to use what kind of live data I thought would be appropriate.
I have an idea that I will create a way for the citizens of Montserrat, a small volcanic island in the West Indies, to be able to receive an alert of volcanic activity via SMS or via a mobile notification. After volcanic eruptions wiped out two-thirds of the island in the 90s it has been on constant alert for any future volcanic activity that might happen in future. I wanted to explore this idea however it wasn’t feasible as I couldn’t find a reliable source to use for instant updates on the volcanic activity via an API, I couldn’t figure out how to get info as it happens.
Instead, I explored another angle, since moving to London I’ve realised since moving to London I didn’t enjoy using the maps that I downloaded via the iOS store. After hashing out an idea I came up with the idea to attempt to create an app that allows me to see the three nearest tube stations.
Part 2: OpenPaths and Google Maps with Oliver
We had a tutorial on with Oliver about Google Maps and how to use the API for the web. Within this tutorial we use a template file that Oliver issued — this file allowed us to take our OpenPaths data and learn about implementing it via js.
We briefly look into how to create a custom map using styling wizard before we went into looking at our OpenPaths Data. A week before our class did a Jailbreak challenge which allowed us to collect data that would prove handy for implementing our own unique maps into the template code.
Eventually we then looked into JSON (JavaScript Object Notation) as the template file was written in JSON and it was used whilst we ran our code locally. In class Oliver disucussed running a local server using Terminal and Python, I used MAMP and ran mine on a pre-made local host.
Once we got an idea of how we could use the OpenPaths data from a previous tutorial Oliver decided we should try using the data to make a map of our own and we explored things like animation and other ways to make the data more interactive.
Part 3: Research
Today after I had an idea on how I would go about my project, I decided to find some resources to help me build the idea. I wand to use Google Maps API on Angular JS to create an Ionic Mobile App; I’ve chosen to create a mobile app over a website because I feel like the website wouldn’t be as challenging.
To create an iOS App natively would take a long time to learn from scratch using the native language, Swift, however JavaScript Web Apps would be achieveable if I learn the Syntax. Also, I’m part of a development circle through Circular so I will have people to ask and learn from when it comes to building apps with JS.
After some research between AngularJS and similar competitors, I realised ReactNative (RN) was an easier option to go with as there seems to be a more native element to the development. This would help me learn some Swift whilst learning how to code in a new development language.
I decided to check the maps that I’ve been using to find out ways how they direct you throughout the city if you wanted to find a tube station. I found Google Maps to be the more reliable mapper for giving directions, Apple Maps felt like it was inconsistent with getting to places within good time. The Aesthetic on Apple maps to me feels more relaxing and hassle free, as opposed to the copious amounts of info on a Google Maps search page.
The Tube Map app is good at displaying maps and telling you what stations to go for a journey. The downside to using this was the app uses ads a way of monetising the product and the ads often get in the way.
Part 4: Prototyping and Refining idea
My idea was to create a website originally but after deciding to go with an iPhone app, it meant I could use features to the native iOS system like gps tracking, before if I used my idea on the web the GPS tracking could only be accessed whilst on the webpage as opposed to in the background. In the end I have decided to make an app that shows users the nearest three stations nearest to them and they can see a tube map at any time. An idea to make the product a little more unique is to display landmarks on the way and give a small bit of info on them.
I also went onto design lo-fi wireframes to get an idea on how I’d like the app to be structured. Initially I envisioned creating the app in a similar form to the Super Mario Bros 16bit design to make travelling around the city to make the app more engaging.
Part 5: Design and Development
