Interactive Story Application
November 6, 2018
OBJECTIVES
The goal of this project was to create an iOS application that utilized the user interface builder in order to create a story driven, text-based adventure game. In order to accomplish this, I had to start from the most basic iOS view controller.
Utilizing a photo editor, I took this base image:
And converted into several different styles and color variations. It was at this point where I chose to further develop this app in a vertical format rather than landscape. The thinking behind this choice was that I wanted the design to reflect an ongoing transmission rather than reading out the dialogue like a book.
​
​
First View Controller
​
When creating my first view controller, I immediately gravitated toward a basic look that represented a simple space theme. In order to add some personal adjustments, I utilized Figma in order to create a title screen with some “alien” touches to it. Below on the is the result, and the right is the final product with text included.
Aside from the title itself and the Start button, the alien font was a design choice to make it obvious that the game would be alien in origin. The font actually reveals the twist of the game as well.
​
​
In order to design a game that routinely gave the player two choices, I used the program Twine to outline my storyboard. Given that if I only ever gave the player 2 options to progress in the story, I found that the exponential increase in view controllers was difficult to keep up with. To alleviate some of this, I implemented single option view screens that served to progress the story further.
Progression View Controllers
After I had my title screen and base storyboard laid out, I set out creating a base template for the standard progression screen that the player will land on. For buttons, I used a simple UI button with some bare designs.
This is the base that I ended up with after messing with several different designs: The one on the left is without text and the one on the right is an example of a finished view controller.
Once I was able to create a sort of template, all I had to do from there was replicate them and fill in my story. My original layout, while organized, ended up very chaotic as the connections made to each screen quickly got very messy.
End Screens
​
To finish out the story, I created three very simple end screens with endings that reflected whether or not the player got the positive ending, the neutral ending, and the bad ending. The most obvious way to discern these (aside from text) ended up being colors.
Below are the three in respective order:
