GhosTown is a ghost tracker app that brings a little delightfulness to people's daily life.
Individual Mobile App Design & Development Project
Whenever you see a ghost, you can pin its location, upload and/or take a photo. This photo will be layered with the ghost you just found!
First, I started to create the wireframe in order to have an overview of the whole app flow.
Created the basic structure of the app in jQuery Mobile's structure with very basic CSS. This is in order to understand the page structure before getting into a more specific design.
At this stage, there is no real data yet and the map is just an image. I’ve also defined the root color and typeface. This process is to make sure the app flow is easy to follow before moving into real data and real map.
Once the flow of the app is defined, I moved on to apply data to the app with a data set. Google Map API is also embedded in order to have a real map.
Or sign up for a new account if you wish 🤗
The default app has a dark theme with dark colors and neon accent colors to match the ghost town feeling.
App icons have a default style of line icons, filled icons are used for the selected stage. Every type of ghost has a unique icon with its special elements.
The primary typeface is Hind Guntur which is a clean geometrical typeface. The Righteous is used for some header text to create contrast.
This was a challenging yet fun project. Unlike developing a website where I would primarily focus on the grid system and responsive design, this project was meant to develop an app.