Walls of Melbourne is a street art companion app that provides a library of information and guidance about Melbourne's iconic urban art. The app features a map marking key locations, an interactive location-based narrative that guides users through the city, and an augmented reality camera. The AR camera acts as a digital extension of the lanes, with unique, live user-generated art present on a wall at each supported location. This feature is not fully functional but is represented in the prototype.
Introduction
University Assignment Brief: Create a geolocation narrative mobile application that delivers a narrative spanning 10 locations within a 25km radius.
This was an intensive project given the wide scope of the project during my final semester of university, but it was immensely rewarding. It all started with the idea to base the app around street art to engage people with the iconic art we have all around the city. I then established application goals and a target audience - people aged 16-34 who live or are visiting Melbourne, and who have interests in art, street art, photography or exploring in general.
Development Journey
Then came ideation, and plenty of it. Brainstorming narrative ideas, potential locations, visual identity, the concept behind the narrative, wireframe layouts, etc. I also conducted a brief focus group with two participants, which provided insights into user's motivations around the app.
Collection of ideation pages.
Confirming my assumptions of the target audience, I starting digging into the planning of the application itself; developing user journey maps, a task flow map, an affinity diagram categorising interaction features, and more.
Content/features affinity diagram.
Interaction flow diagram for story progression.
Now was the hefty task of developing a low-fidelity prototype in Figma which included the complete narrative from start to end across 10 locations. Since users in the focus group were intrigued by the idea of the AR camera, I built the AR camera as a core means to interaction at each location throughout the story.
Low-fidelity prototype key pages.
I managed to test the application with four participants via observation and interviews. Field testing was done on location, for two participants. The remaining three individuals completed testing in-person but at a remote location. This was an immensely rewarding process, and I managed to gain plenty of feedback. I ended this process with 28 proposed design/usability changes based on this testing, which carried through to the final high-fidelity prototype.
User field testing completed on location.
Example of feedback and notes taken from testing for the first location.
Following our user testing venture, the high-fidelity prototype was created. I applied all changes that were recommended during this process, and fleshed out the story visuals with an assortment of fun street art inspired 'stickers', and real images taken on location.
Example page of annotated changes made based on low-fidelity testing.
Page detailing newly added tour to introduce users to the app.
To finalise the project, I conducted one final round of focus groups with four participants. Here, I was able to assess the impact of the design and usability changes, and gain even more input from fresh eyes. I established another list of changes based on this, and implemented that which was important or feasible within the assignment deadline.
Demo Prototype
This prototype is a "demo" version. It places you right in the middle of the action so you can get a feel for how the app functions. Most features of the AR camera are available to use in this version.
Note: In both prototypes, AR is simulated. On the AR page, the image background is simulating what the camera would be seeing. This can be moved around by dragging.
Full Story Prototype
This prototype includes the full 10-location story. Starting by logging in and working through the tour, you will be able to interact with all three created episodes of the story from start to end.
Note: Not all pages and features are available throughout this prototype, only that which is intended for progression through the story.
