De Oosterpoort - 3D Interior Design Tool

Designing and prototyping a UI/UX concept for a client to ease the burder of interior planning around the theatre venue

Usability Loop Flowchart

The research phase involved conducting client and user interviews, where we discovered that the personnel struggles with communicating their vision in preparation to decorate the venue accordingly for the upcoming performances. This flowchart, a sketch, and a few iterations of the user interface served as the proof of concept and a preffered by the client solution. that mapping user journeys to highlight friction points and gathering feedback from usability tests

Photo Annotation

During the field research a photo annotation method helped conduct which objects are being moved around the venue to later be implemented into the library of objects in the application

Iterative Design

In this photo are two of the best iterations for the heads-up display (HUD) layout. The first iteration was developed based on my initial design exploration, focusing on optimising the user’s field of vision and minimising distractions during the use. The second iteration was created by the client during a collaborative co-creation session

Figma Hi-Fi Prototype

The interactive Figma prototype I created that closely mimics the functionality of the final application. By utilising Figma's prototyping tools, I was able to make the design fully interactive, allowing users to click through and experience the app’s flow as if it were live

Main Menu

This prototype was tested extensively in focus groups, where we conducted multiple rounds of usability testing. We also employed A/B testing to compare different design variations, gaining valuable insights into user preferences and making refinements to ensure an optimal user experience

Settings Menu

The main menu also features a settings and controls menu that allows users to customise and adjust their controls. This functionality was implemented to enhance user experience by providing flexibility based on individual preferences and technical knowledge

Controls Menu

By allowing users to tailor the controls to their needs, we aim to improve ease of use and overall retention, ensuring that both novice and experienced users can engage with the application seamlessly

Core Prototype

The prototype was built in the Unity Engine together with another student who was working on programming the functionality of the tool: placing and manipulating objects in the 3D environment that replicates the building where SPOT is located - De Oosterpoort

GemFall Catcher

Product to be released for Android in November 2024

A mobile arcade game, where I take on the roles of both producer and game designer. As part of a small team, I wear many hats, contributing to various aspects from gameplay mechanics to business considerations like monetisation and marketing strategies

Settings Menu

A settings panel where users can adjust game elements such as the volume of music and sound effects, as well as linking their AppleID for iOS users and Google Play for Android users

Leaderboard

The page for best scores is linked to the PlayFab and analytics services, helping us track the game balance for optimal user experience and display the best of them on this page to promote competitiveness and social elements of the game

Core Gameplay

Our team consists of four key members: a programmer, a technical designer, and a 3D artist, alongside myself

Wireframe

The user interface prototype was designed in Figma for clear understanding of the user flow of using the application and to visualise how the scene manager would operate in the Unity Engine

User Interface Flowchart

The user interface flowchart provides an overview of all the panels, badges, and other UI elements within the game. It maps out the user journey, helping to visualise how users will be navigating through the game’s interface. This view helps ensure that and the design is intuitive and all elements deployed

Style Guide

This style guide was created to communicate my artistic vision to the team, ensuring we were all aligned on how the game should look and feel. It outlines key elements such as colour schemes, typography, visual motifs, and overall tone. The guide serves as a reference point to maintain consistency throughout the game's design, helping us evoke the desired emotions and create a cohesive experience for players

gemfall-timeline.png

I served as both the Product Owner and Scrum Master roles, utilising the Scrum Agile methodology to manage our workflow. I organised sprints and tracked progress using Trello for effective project management, ensuring the team stayed focused on tasks and goals. I also planned ahead by setting clear timelines and milestones, keeping the team aligned and on track to meet our objectives efficiently

Game Design Document

The concept is documented and elaborated to the full extend in the GDD. It also includes design, art, and technical requirements

Score Milestones

One of the last few iterations of the game logic behind the scenes. This includes the current and new milestone score system with increased difficulties to progressively overload the players with the challenge. The new iterations are made based on the quality assurance, gathered statistics, and player feedback.

Spawn Logic

The spawn logic system was calculated and structured in regards to the design requirements. The game features a spawning pattern between 3 shapes and 3 colours, while providing a player support in a way of spawning an objective to make it fair