GlideWinder

A responsive design for a arcade style sci fi video game's website.

Role
Lead Developer
Constraints
80 Hours
Devices
PC Desktop
Tools
Figma

Background

GlideWinder is an arcade-style game presently under development by Subliminal Fringe. Gameplay in GlideWinder resembles that of a runner-style game; however, its mechanics boast greater complexity compared to typical runners, and the game is structured around levels. Noteworthy is GlideWinder's distinctive art style, reminiscent of Studio Ghibli productions. The game has reached a stage where its gameplay can be showcased to audiences, prompting the developer to establish an online presence.


Goal

A responsive design for a website that educates potential players on the game GlideWinder, its features, and its basic gameplay mechanics.

Research Process

First I determined the questions that I wanted to answer via my research:

1. Understand users motivations in their methods of gauging interest in a new game through its website.
2. Understand users current methods in assessing if they would enjoy a game before purchasing it.


I then choose to conduct User Interviews and a Competitive Analysis of other games websites in order to answer these questions. User interviews will help inform me about both of these questions and a Competitive Analysis of other games websites will help me explore other designers methods to reach this goal.



Research


User Interviews

After conducting interviews with three individuals, I was able to determine the following shared pain points and motivations.

Shared Pain Points
Difficulty in assessing the enjoyment level of a game before purchasing
• Difficulty in assessing the gameplay before purchasing

Shared Motivations
• To experience novel games

I was left with the question of how might we solve these issues of assessing enjoyment level and gameplay before purchase a game in order to educate potential players on the game.


Competitive Analysis

I conducted a competitive analysis of twelve games websites in order to better understand the currently used methods of conveying gameplay information to potential customers. I focused on comparing and contrasting the features of each website as well as their presentation of the information.

Define


User Personas

Following preliminary research, I was able to create two user personas in order to have templates for my target users.


Key Takeaways:

• Provide clear and detailed information about the game's difficulty level and unique gameplay features to meet James' needs.

• Emphasize polished mechanics and provide an intuitive understanding of the control scheme and pricing model to meet Sarah's goals.

• Gameplay videos, demo options, and detailed descriptions could help both personas make informed purchasing decisions, ensuring the site caters to diverse gamer preferences and pain points.


User and Task Flows

I developed user and task flows for the most common actions that users would perform as well as flows for testing the special features that ReVenture offers which other travel solutions do not.




Ideate


Mood Board

I created a Mood Board in order to plan my visual design.
In order to align with the game's established color scheme, I selected complementary colors to maintain visual consistency.
For typography, Spartan Bold was chosen to echo Glidewinder's futuristic theme.
Additionally, I crafted several logo concepts, also in a futuristic style.



Low Fidelity Wireframes

After my initial research I created low fidelity wireframes in order to have a design basis for the final wireframes.

High Fidelity Wireframes

I then created high fidelity wireframes based on my low fidelity wireframes and my mood board. (click to enlarge)



Prototype and Test


Outcomes

After completing my wireframes I conducted usability tests using five participants and reached the following conclusions:

5/5 users were able to complete the user task.
Users felt that the design informed them of the game mechanics and features.
Users enjoyed the visual style of the design.

Next Steps