Time-Based Phone Application
The phone application assignment I received in my graphics design class was to design a time related application. I chose to design an app that tracks the number of days to the pay day. The pages in this app consisted of a log in, home page, a sign up page to put in the user information, the cycle view (with a count down), a calendar view and a page to add more than one job. Below are the wireframes I made to represent these ideas. I intended on calling the app Payday.
In the second draft I experimented with different colors and themes. This is where I came up with the idea to have the calendar represented by gold coins and the pay day represented by a dollar note with the number of days left written in it. I also thought of having some sort of piggy bank/ bowl with money in it representing the number of days left. I ended up going to the idea of having a cycle shown on the outside as in the pink draft because it looked cleaner and gave a simpler representation. I experimented with the bar graph representation, having the yellow color and the number of days written above. In the end I preferred the stack of bills being the bars in the graph.
The blue and green were nice choices of color but the pink was the most subtle and I was more inclined to go in that direction.
For the final draft, I chose to use a piggy bank as the logo because it was super cute and blended well with the pink of the title and the purple to pink gradient in the background. I thought the colors were soothing and neutral enough to allow the users to focus on the gold and green money.
My time interface included three different views: the cycle view which had a count down of gold coins and the numerical representation in the pig.
The second was a bar graph of the days left, the height of this depends on the users pay schedule. I showed one with a weekly, bi-weekly and monthly in that example.
The last is the calendar view. It had gold coins for the days. the coin would just be a ring if that was the day of the week or a money emoji if its pay day. The notes present the upcoming/ past pay days and have the number of days left written in them.
To navigate through the different views, the user slides to the left and the pink circle represents the page. The + button is to add a new job and the arrow is to switch between two different jobs in the same view.