Project Banner
User Interface Design

Outplay App

Project Summary

BRIEF

The task was to design a User Interface for a mobile app that would work with Toyota's e-palette concept. The e-palette is an autonomous vehicle which can enable a wide range of transport & delivery services.

PROBLEM

The context for this service are densely populated urban areas of the future. With a rotating population and space restrictions, this app aims to serve people that love sports and games, but lack the company, space or equipment to do so.

SOLUTION

Outplay is an app with which users can join sports / games planned by others around them. They can schedule their own games in available spaces. The equipment needed for these games will be delivered by the e-palette.
The project included designing the service concept, interface and visual language.

Project Type: Classroom
Hochschule Pforzheim, 2019
Guided by Andre Fisch

Project Summary Image

What is Outplay?

Often in densely populated cities, finding others that play the same game is an obstacle. It's not easy to find local games and even if you do, you may not have all the equipment.

Outplay is the solution for both indoor games and outdoor sports.

Outplay connects likeminded people and makes playable spaces and equipment available, so players can focus on what they enjoy.

HOW IT WORKS

The app can be used in a number of ways as per your need, but a typical flow involves:

  1. Join an existing game in your neighbourhood, or choose to create your own.
  2. Choose the equipment you'll need and a playable space.
  3. Invite your friends, with the option to make your game public or private.
  4. Show up to the location.
  5. The e-palette will bring you your equipment at the scheduled time.

APP MODES

The functionality of this application is divided into 4 main features, for ease of use.

  1. Player Profile
    Provides an overview of upcoming activities and manage personal details.
  2. Gamer Mode
    Find public games happening in your area to join.
  3. Creator Mode
    Create your own public or private game for a sport of your choice. Choose equipment and available space, if required.
  4. Outplayers
    Invite your friends to games, add friends or join groups.

Visual Language

As it is an app all about players, I took inspiration from board game elements. The idea was to have a map and player pieces scrambled across it, resembling a physical board.

  • The logo is in the form of a die, with the arrow indicating the "out" in Outplay.
  • The background grid and buttons are extensions of the hexagonal logo.
  • Different colours for the features, resemble the typical 4 player pieces.

Interaction Development

Scene from a feedback workshop.

SERVICE IDEA

For this hypothetical project, we had to address a problem for a future scenario - a future where the e-palette would be real. The problem addressed here is an issue even today, likely to grow in the future.

FEATURES

First I explored what a user in this scenario may want, need and hope to achieve. "What would be the variables they would need to find a solution?"
After exploring a lot of potential fixes, I whittled down to the most essential through rounds of participant feedback.

FLOWS

The most pressing questions to answer were:

  • What would be a logical way to navigate through the features?
  • With the optional nature of the features, what arrangement would allow the most flexibility?

Options were sketched, diagrammed, wireframed, discarded and tested with students across the school.

Other Projects