Brief 14 - Additional Screens

Following the completion of the initial digital wireframes, I started to work on the other pages that were needed for the App to make it a much more considered project.

One of the things that I had been thinking about recently was what the City home page would look like to the user if they clicked on it, but it wasn't time for their holiday yet and they just wanted to book some events in advance.

I think that this is a page that I should definitely include, so I thought about how this could work and what information would need to be there, and what did not.

The first thing I decided was that the content would have to be quite visible and stand out to the user so they would see it immediately. Because of this decision, I decided that it should be on a coloured block.

The information that wouldn't need to be there is the 'Day', 'Date' and 'Temperature'. This leaves space below the image to place the new information

The addition of this information is simple, but I think it is effective, and the green should stand out from the imagery that will be above it.

Following this I did the same for the individual event page, as for what would appear on an event when they had booked it, but it was not yet time for it.

For this, I decided on really simplifying the page down, because the user wouldn't need to see all of the information unless they really wanted to.

I decided that this would be a page where they could see the date, time and do four things - View the full event, View the location on the map, Set a reminder & Edit the visit.

The date replaces the location name, and stays in the dark grey, as to follow on from the colour of the My Planner heading. The planned time works over the green, as done in the previous page. The three icons work across where the Event information previously was, and a bar at the bottom can be clicked for the user to edit the information. I decided on keeping the Edit separate as it different from the other three options on this page.

I then moved onto creating the calendar for what comes up when an activity is selected to be added to the planner, or when the user is creating their trip.

Keeping to the overall aesthetic of the App, I went with a really simple and flat design. I incorporated a lighter green into this design as well because the other colours were too bold I felt, and the only bold parts on the page I wanted were the heading and the 'Add' button at the bottom.

Overall I think that this design works really, really well, and is definitely one of the best designs for the App. I love the way the actual calendar and time slots worked out. I was initially a bit unsure how to do the 'minutes' side, but working it in fives fit perfectly to the 'hour' numbers.

In terms of the 'Add a new trip' page, I realised that something important that was needed was the party number so this can be input automatically when choosing an activity. I added this section in.

The last thing to do on these pages was to decide how the numbers would appear when chosen. Taking inspiration from the visual list on the Mapped Route page, I decided on using red circles with white numbers.

This red works really well and definitely finishes the designs off. I feel that this is definitely one of the strongest visual designs in the App and it works really well in creating a simple way for users to choose a time and date.

I then overlaid these over the pages where they would appear.

Following this, I created the Sign Up page in the same format because of how successful it was.

Overall I think it works well, and I like the use of the red like in the calendar. When overlaying this over the Login page, I found that it was slightly smaller than the two buttons.

To sort this, I moved both of these buttons up to line up with the bottom of the Sign Up form, and decreased their widths slightly as well.

The last page that I needed to create was that for what would appear when a user clicked on the 'View on Map' button. This was relatively simple to do as I had already created a style of visual for the Map. All I had to do was apply it to the content I had, which was the Statue Of Liberty.

I added the address in a box in the top left so the user can see that if they need to. I think it adds a bit more to the page as well by being there and informing them of this. I also added a marker point to show the exact spot of the activity - keeping the same design as previously used on the Map Route, but just changing the text to work with this. I also changed the heading so it was clear exactly what the user is looking at.

Overall I am pleased with these additional pages and I think that they do finish the App off very well and cover all the bases. I'm excited to mock all of these pages up and displaying them in the way they would be seen.