App design

Here I showcase the process of designing the app.

With the help of a software engineer I was able to complete a first prototype. Alpha testing has already be done but beta testing (customer validation) has yet to be completed. An intervention is scheduled for the 29 of November week, where feedback about the product will be gathered.

I am currently in phase six of the SDLC (Systems development life cycle) model

Index:

  • Research, structure and early design
  • Stages of creation
  • Complete Prototype

Research, structure and early design

Research:

3/10/2021

Before starting the app design, I had to understand how similar apps are structured. I had a look at Lonely Planet, All trails, and Culture Trip. The one I thought aligned the most with my ideas was Lonely Planet so I proceeded to analyse the way it was constructed, making notes along the way.

Lonely Planet screenshots and notes:

  • Home page you choose your city
  • When you click on city you are sent to a map with (must see places, tickets and tours, curated tours)
  • There are 7 main features (All, see, eat, sleep, shop, drink, play), you can filter your responses according to them. The dots changes colour when you click one. 
  • (Need to know feature) There is an overview of the city of Athens
  • (Need to know feature) You’ve got the neighbourhoods (good for Venice districts)
  • (Need to know feature) Transport 
  • Dictionary 
  • Budget/currency 
  • You can vote for cities you would like to see on the guide

Early structure:

5/10/2021

This research helped me come up with an early app structure. After reviewing it with people in my surrounding and with the expert who has been helping me navigate creative softwares, I concluded that it could be improved on. I think i tried to cram too much information onto one page and overly complicated certain aspects.

Home page:

  • Logo
  • Button “Discover Venice”, which take you to the next page
  • Little “about” logo on one corner.

Archive:

  • Where read anecdotes are stored
  • Also where anecdotes are stored when the notifications where disabled

Notification:

  • When user gets a notification they are sent to Archive/collected info where the anecdote is unlocked.
  • Option to hear the audio version
  • Option to keep or delete the anecdote
  • Little camera button that lets you take a picture and share it on the app?

Features suggested by stakeholders:

  • Audio version
  • Adding a “disable notification” feature (so that users do not keep receiving the same anecdotes when retracing their steps)
  • clarify that the app is my personal take on Venice and not a universal one.
  • What happens to notifications that are read and unread
  • Find a way to limit the time users’ spend on the phone looking at the map
  • A recommended route option.
  • Adding urls

What should definitely be there:

  • Audio version
  • “disable notification” feature (so that users do not keep receiving the same anecdotes when retracing their steps)
  • A way to differentiate if the anecdote is a random history fact or linked to environment
  • Red and unread notifications stored in an archive when one can go read them again
  • A recommended route option?
  • A map
  • A feature where locals can submit new content or you can share your own photos 

My latest intervention helped me answer a few questions that I had such as the design of the map and whether there should be a recommended route option.

Later structure:

10/10/2021

The later structure contains all the features of the previous but differently arranged for a better user experience and app development ease. I made mockups of what it could look like on adobe illustrator.

I changed the colour palette from navy blue/purple/white to one that reflects the colours of Venice, which I believe is a nice way to create a visual consistency between the app and the environment it focuses on.

Home screen:

  • Logo
  • Button “Discover Venice”, which take you to the next screen

Screen 2 (Map):

  • Map with all the stops
  • Icons at the bottom representing each category 
  • User can choose which category they want on
  • Menu Icon on the top right corner

Menu Icon:

  • The menu appears above the map (or could be on a different page)
  • 3 options to choose from (about, settings, archive)

About:

Settings:

  • Enable or disable notifications
  • Basic that maps usually ask

Archive:

  • Where read anecdotes are stored
  • Also where anecdotes are stored when the notifications were disabled

Notification page:

  • When user gets a notification they are sent to Archive/collected info where the anecdote is unlocked.
  • Option to hear the audio version
  • Option to keep or delete the anecdote
  • Little camera button that lets you take a picture and share it on the app?

I have shared this list of features and screenshots with the expert helping me develop the app (Jesse Sigalov) and had a meeting to discuss the developments (more about this here).


Stages of creation:

27/10/2021

The map:

The very first element that is being brought to life is the map of Venice as the app heavily relies on it. As shown earlier on the post I have a good idea of what I want it to look like (this was tested with stakeholders).

On the mockup I took a design from Snazzy maps, a website that lets people freely use map designs made by creatives, however, it was not possible to transfer the design onto Unity (the software being used to develop the app).

On Unity there is a default map but it was not quite the style I wanted.

Therefore, I was advised to use another website called Mapbox where I could recreate the map myself and it would be compatible to transfer it over to Unity.

Mapbox gives you a standard map, which you can modify as you wish.

I created a version that looked closer to the design that I originally wanted. I removed all signage (street names, hotels, landmarks etc) to have a very simple map, which will only showcase the geolocated stops. The idea is that users do not rely completely on the map and can walk towards the general direction of what is indicated on the map without being GPsed to it.

The following image shows the first two geolocated stops (the map style will not stay this way)

12/11/2021

The map has been further refined. We are at a stage where we are uploading all the anecdotes with their right icon and completing the home page.

Here again, I was able to get involved in the tech side as I used the MapBox site to add the coordinates and details of each location so that they could be exported to Unity (the software where the app is being created). The process of copying and pasting the coordinates is a little tedious but really spending up the process for the engineer.

There were certain coordinates, which would not appear on the map, but the engineer managed to fix the problem.

We now also have a vision of the final design of the map with the icons representing each category (church, museum, artisan, legend, historical fact), which I had designed.

Audio:

2/11/2021

As I wanted to have an audio version as well as the written text, I contacted a friend from the course I had had the pleasure to work with before. He had lent his voice to one of our projects and I hope he could do so again with this one. He agreed and very efficiently recorded all the texts. Here is an example, it tells the story of the red stone.

I edited the recordings on my computer to improve the quality and deleted any unnecessary gaps or noises.

I chose this particular actor because his voice has a very audio book quality to it. He managed to make my amateurish writing sound more professional. His background in theatre really helped. Rightly so, my tutor questioned whether it would not be more authentic to have a local’s voice being featured on the app. Although it would be lovely and very in sync with the project, there are various reasons why I chose not to take that route. The locals are usually not very well versed in English and the rare who are do not speak with the clarity that is needed in such a recording. Indeed, when one is conveying information, the diction needs to be very clear especially since it must be assumed that some of the people who will be listening to the recordings will have English as there first language.

Maybe in the future it would be wonderful to have locals record their own suggestions for users although a solution would have to be found for the language barrier.

What went well:

  • The voice actor was very efficient and it only took us a few hours to get everything I needed
  • There were no technical difficulties

What could have been done better:

  • The quality of the sound is not perfect as it was not recorded with professional equipment

Other features:

18/11/2021

More features are being added to the app as it starts to come together. The anecdotes are being added and I am happy to see that it all looks very similar to what I had designed.

Anecdotes:

Below are two anecdote templates with and without and extra image (there are a few anecdotes where I have added visual support for bettie understanding).

Loading page:

The loading page is a feature that I particularly like. While it is loading the orange gradually fills up the logo and the explore button, which I find particularly aesthetically pleasing.

It is very reassuring to start having something concrete and it seems we will be able to finish what we had planned before the deadlines, which reduces my stress levels.

Need a screen shot of what it looks like on the phone (app icon)

18/11/2021

This is the final version of the anecdotes that have images. On the third one the audio was added, now they all have audio option.

The bottom bar on the app page with the 5 categories of Venice experiences was added. The user can choose which categories they want to appear, according to their particular interests.

22/11/2021

Here, is the first version of the archive (where the anecdotes are stored). In the squares should be added pictures that relate to each anecdote.

This is the complete version of the archive, with all the pictures uploaded (story my screenshots are blurry, the real thing is of better quality).

The engineer suggested that the seen anecdotes could in black and white to clarify that they have already been read. They can still be re-listened.

25/11/2021

It has come to a point where I realised that installing the geolocating feature to this prototype would take longer and would need further on-site testing (in Venice). Therefore, for the sake of this “first attempt”, we came up with an alternative. In addition to being able to move a virtual character with a joystick (the character hovers over the an icon and the anecdote appears).

I think this is a good compromise for now as it mimics the initial geolocation plan while allowing the app to work everywhere, not only Venice specifically. It will make testing easier.


Complete Prototype:

25/11/2021

Here are some screen recordings of the final product:

Leave a Reply

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