Micro Mapping

BRIEF: Build a conceptual map of an area of Bristol to draw out connections between places. Browser based micro-app using hype with 3 nodes from your

Source of Inspiration:
A major source of inspiration for this project was Nikki Pugh’s ‘Sites of Potentiality Guidebooks’, read more about it here.


For this prototype, I was given the area of Millenium Square and Whapping Wharf to focus my Micro Mapping project on, I chose to primarily focus on the area around Millenium Square including; Cannons Marsh, the Amphitheatre, the Llyods Headquarters Building and Waterfront Square. I went to the location to take photos and get inspiration from the space, whilst I was there I didn’t have any instant ideas about how this Micro Mapping project could interact with my chosen space. However, when I got home and began researching more about the location, I discovered that the area has transformed a lot in the last 40 years. It has undergone a lot of development from being an industrial area of timber yards, transit sheds, railway sidings and a stone and marble works. The whole area around Millennium Square and the Waterfront was redeveloped in the late eighties and early nineties. This inspired me to do a walk through audio guide that not only directed you around the space, but as you walked to the three points on the tour the time period of which you experience the space changed, so the audio track and facts you were being told would be exclusive to the year in which it was set, and the map would change depending on how the landscape of the area in which you were standing looked from above, based off of maps from the time.

Below shows the development process involved in producing the prototype including; designing the graphic user interface using assets I created in Adobe Illustrator, building the app functionality and user experience using Tumult Hype and recording and building up the audio track for each of the three years in GarageBand.

IMG-9878 copy


Screen Shot 2018-02-19 at 21.50.33

Screen Shot 2018-02-19 at 21.50.43

Screen Shot 2018-02-19 at 22.25.24Screen Shot 2018-02-19 at 21.27.53Screen Shot 2018-02-19 at 21.20.39Screen Shot 2018-02-19 at 21.30.22Screen Shot 2018-02-19 at 21.24.54Screen Shot 2018-02-19 at 20.50.02


Click here to view my Micro Mapping mobile website!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s