headline banner

UX Design: Ring of Steel App

ring of steel flyer for live event in Belfast March 2022

Summary.

Professor Kate Catterall grew up in Belfast and came up with the idea for this project. She recruited UX and computer science students to help with this project. We were tasked with redesigning the Ring of Steel website and then with designing an educational walking tour app about the Ring of Steel, a cordon built around the city center of Belfast during the Troubles. I will be showcasing the walking app.

This

This

Team: Myself and two other UX designers, Peggy Hu and Leah Shi, and a software developer, Vanny Yeh. 

Scope: March 2022 - current

Goal: Create an educational walking tour app to teach people about the “ring of steel”, a police cordon surrounding the city center of Belfast during the Troubles.

Methods/Skills: affinity mapping, concept development, organization scheming, wireframing, prototyping, iterative design

My Contribution

We each redesigned the website and I did a redesign of the mobile version of the website. After the event in March 2022, we began work on the walking tour app. We discussed what features we might want to include and set to work on creating initial designs. We then went through many design discussions and created the final prototype which we all worked on. We’ve been through ~5 versions of the final prototype so far.

royal avenue 1972

Background.

“On May 3rd 1921 the Government of Ireland Act became law, resulting in the partition of Ireland, a border that still separates the North (Northern Ireland, United Kingdom) from the South (Republic of Ireland). Two conflicts ensued: the Irish Civil War (1922-23) and the Troubles (1969-1998). The latter consumed Northern Ireland for three decades and informed a militarized built-environment designed to meet security imperatives; traces of which are still evident on the streets of Belfast today. This cordon is known as the 'ring of steel'.

A Troubles memorial was proposed as part of the peace process in 1998. Sectarian remembrance devices do exist across the country, but shared markers to the period remain unbuilt. On March 24th 2022, Drawing the Ring of Steel, a 16-hour live engagement event, helped facilitate public recollection of the Troubles, through one of few mutual experiences of the conflict, a security cordon that once encircled Belfast City center, protecting, while rendering suspect, an entire population.” Read more here.

This

Key Questions.

Who is our audience?

This was important to think about for a few reasons. First, we wanted the experience to be accessible to people of all ages and interests, from kids on a school trip to older adults on vacation. Second, though the Troubles are technically long over, there are still very strong feelings on both sides and we needed to be careful that we only used neutral language and neutral colors throughout the app experience. This required constant communication and detailed design walkthroughs with Kate, since she was the only one who had firsthand experience and knew the intricacies of the political situation in Ireland. 

What is the purpose of the app?

We wanted to make sure that it was clear that all we want to do with the app is provide people with a historical experience and education that is as unbiased as possible. More specifically, most of the traces of the police cordon were wiped away years ago with very little public discourse about so as to not stir up painful memories and feelings. However, history is important and for those who might want to learn more about it, we want to provide people an education and/or a reminder of the conflict and what the cordon looked like throughout the years of the Troubles.

How would we demonstrate the changes to the ring of steel that took place over the years?

The Troubles lasted for over 30 years and the ring of steel went through many changes during that time period. We had to decide how we would show these changes on the map and how we would provide other information about the different variations of the ring of steel.

What information should the app provide and in what form? How immersive should and can the experience be?

Kate’s research and the information collected from the live event held in March of 2022 left us with information in a variety of media formats, including images, audio, and video. We had to consider how to include all of these different types of media in the walking app.

Initial Designs.

For the initial designs, I took the changes I recommended for the website (below, left) and created a mobile version (below, right). This mobile version was the initial design we used to begin considering what a walking app might look like.

This

redesign of the initial website
redesign of the initial mobile design of the website

Next, we (the designers), each came up with our own initial designs for the app. My initial designs are below.

initial designs for walking tour app

Final Prototype.

Through many collaboration sessions between the other designers and Kate, and after many evolutions of the design, we eventually landed on this as our final design (which of course will continue to go through changes in the future). This is the version of the app that was presented to Belfast City Counsel (more about this in the next section).

This

Onboarding

This onboarding experience will be the first thing that pops up upon opening the app. It gives the user historical background before they start their walking tour journey.

gif of final prototype: onboarding

Onboarding for the map

This part explains different aspects of the map and how to use the map for the walking tour.

gif of final prototype: map

How the walking tour works

The map allows users to select certain years where the cordon around Belfast changed and shows what the cordon looked like that year. Background, explanations, and stories from that year are available to the user as they make their way around the cordon.

gif of final prototype: how it works
Belfast City Hall

Current Status.

Kate flew to Belfast October 21, 2022 to present the prototype we created to Belfast City Counsel. They liked it and we are waiting to hear back whether we will get funding to fully develop the app.

This

Reflections.

  • What I learned 

    • What it’s like to work on a timeline with a client and with other designers

    • Our team was always changing in terms of the amount of time people could dedicate to it and people fully dropping out due to other commitments so we had to be in constant communication to designate and determine changing responsibilities 

  • What could be improved 

    • I don’t think we made it obvious whether it would be possible to do the walking tour for each year or if there is just one tour that takes people to the important checkpoints and gives information about how they changed through the years.

      • This part of the design needs clarifying (one tour or a tour for each year?)

    • We are hoping to do usability testing at some point which would be especially necessary given the amount of information offered to users on the app and because educational walking tour apps are not the type of thing most people are super familiar with.

This

Role: UX Designer