. Gameplan ARAugmented reality can democratize sport one game at a time.
GamePlan AR allows people to generate playable virtual courts and pitches in unlikely spaces.
Project Overview
Design Brief:
Identify and Design for a key job that AR could do for people in this near future. The task is to develop a compelling video prototype which illustrates your interaction design paradigm and paints a high-quality picture of what it would be like to use your design

Duration:
4 weeks
Role:
There was me and one other person on this project. During this project, I was responsible for the idea generation, research, storyboarding, and Creating the UI and we shared the responsibilities of directing, filming and editing the video.
Initial explorations & research
We started the projects off with trying to decide what are we thought AR would be useful for in the future, so we started looking at the issues around us. We began looking into the lack of sports facilities in Dublin.

We explored local issues and found out that sport is especially inaccessible to the area surrounding the college and there has been public outcry to politicians to fix the problem. We interviewed people living near the college and asked them about their participation in sports and what their barriers were.. We visited local parks and free sports facilities in my area to see what was already available and observe how people use them. We rearched other initiatives in Ireland that are trying to make sports more accessible and evaluated their positives and negatives. These are some of our high-level findings:

  • Minor equipment isn’t the primary barrier to sports accessibility. equipment like rackets and balls, are generally affordable and space-efficient and there are already systems in place to freely distribute minor sports equipment to people who need them.

  • Lack of facilities such as courts and pitches is the main barrier stopping people from participating in sports. 

  • Public facilities in Dublin are scarce, often neglected, and unplayable due to broken nets and faded lines. They are expensive to build and maintain because they take up large amounts of valuable real estate and don’t generate any kind of income. Also, someone needs to be paid to maintain and take care of the facilities to ensure they don’t fall into ruin.

How might we use AR to create inclusive sports facilities for those lacking access to them?
Proposed concept

Lo-Fi prototyping
With a defined vision for our AR application, we began rigorous testing of its potential features, touchpoints, and interfaces.

We did this trough making a picture storyboard and overlapping them with opaque images and text to replicate what the user will be seeing.

Video Storyboard
Before filming we planned our shots through quick storyboarding so we knew what we were doing and to ensure we left space where we would need to put the after-effects. 

We went through a few iterations and they got more detailed every time and by the end, we had a clear story that we were happy with.

FilmingWhen we went out to film it went well. However, even though we had done rigorous planning before filming there were a few factors we hadn't anticipated in our planning and a few minor mistakes that meant a few shots had to be refilmed. Building the UI in Illustrator
Through experimentation with the overlay on photos, we gained valuable insights into effective design elements. This led us to prioritize the creation of a comprehensive style guide that implements.

  • Uniformity and consistency
  • Text backing for text legibility 
  • larger buttons to reduce precision in hand movements
  • A Fun and professional colour pallet

Using Adobe After Effects to make the AR features Adding in the UI from Illustrator
We brought the illustrator files with the UI elements into After effects and added them on top of the video and reduced to opacity to 80%.
3D and 2D tracking We used the tracking to anchor our UI elements to people and places. Generating the court
To make a tennis court slowly appear on the ground we decided to us the stroke effect that's in after effects. This made it look like how a real AR experience would generate itself and made it feel very realistic. Then we used key frames to adjust how quickly it appeared on screen.










Final video prototype and Screenshots




Previous: Roll-reminder