Skip to content
mackenziekerr1 edited this page Aug 28, 2022 · 47 revisions

Shop Overview

The shop feature is accessible to players during the day time cycle of the game, and provides players with the opportunity to purchase items that are beneficial to them during game play. Items available in the shop include artefacts, defence/weapons that provide additional protection against enemies, building upgrades & resource production upgrades.

Interface Design

Having settled on the most appropriate wireframe for the shop interface, medium-fidelity prototypes were created which were guided by the Design Guidelines. The interface follows the pixel-style of the game and utilises the same text and icon style as other interfaces in the game to ensure consistency throughout.

Page 1: Category Selection Page

shopfrontv3

Page 2: Item Selection Page

itemv3

Wireframes & Iterations

In initial planning stages, wireframes of the shop interface were created by various team members to ensure a holistic and broad range of ideas. As pictured below, initial interface designs ranged from complex, single-screen layouts to simpler multi-screen layouts. Hannah Wireframes Mackenzie Wireframes 1 Mackenzie Wireframes 2

Having assessed the feasibility of both simpler and more complex layouts, it was determined that the simpler multi-screen layouts were most appropriate for the functionality of the game. It was also taken in to account that the simpler wireframes and layouts were more feasible given the timeline of Sprint 1 and producing an MVP; and further iterations to make the interface more complex may be undertaken in future sprints if deemed necessary.

The wireframe titled 'main frame' was used as the basis for designing the category selection page due to it's flexibility to include less or more categories in future sprints depending on the requirements of gameplay. The wireframe was altered to display the player's wealth and resource status rather than the inventory, however it is intended that the inventory is added as a feature in future sprints and will then also be displayed on this page.

The item page was designed based on the wireframe titled 'alternative main frame', with some alterations to include necessary functionality. The item carousel displays available items in such a way that is not overwhelming to players, and clearly highlights the details of the selected item. Displaying the coin and resource value of the player was also significant to the player's experience, allowing them to make informed decisions about their purchases.

Classes

UML Diagram

Testing & Validation

User Design Testing

User Testing was conducted to gather feedback on the design & functionality of the shop interface. To do this, users were given a set of tasks and questions to complete that mimicked the tasks that a player would undertake during gameplay. Following these tasks, general interviews were conducted to gather feedback on the overall design and look of the interface. For the purpose of this testing, it was assumed that the target audience was students in at least their second year of studying who were undertaking a degree in the technology field. Users were asked to do the following:

  • Purchase an item. Outcomes: From the main category selection page, it was noted that there are no clear instructions for users to choose a category, therefore some users took a moment to familiarise themselves with the interface before clicking a category button. Once users progressed to the item selection page, there were no issues with navigation to make a purchase.
  • Abandon your current purchase, navigate back, choose a different category & purchase another item. Outcomes: Since dummy icons were used in this sprint, the 'back' icon did not have any visual indicator of its purpose other than the placement - users noted this, which will be addressed in future sprints.
  • Return to the main game. Outcomes: Similar to above, the top right corner placement of the back button signals to users the purpose of the button. However, a visual indication of this will be added in future sprints.

Users also undertook general interviews to give feedback on the overall design and look of the interface, and made the following observations which will be acted on in future sprints:

  • More contrast (either colour or design) between icons and background would be beneficial in matching art style with the rest of the game
  • Greater detail should be included in the title, currency representation and scrolling arrows - users felt that the design looked 'unfinished'
  • In terms of player orientation, it would be helpful to include the category that the player is in once they have progressed to the item page

Potential Future Iterations (Hannah to complete)

Challenges

Table of Contents

Home

How to Play

Introduction

Game Features

Main Character

Enemies
The Final Boss

Landscape Objects

Shop
Inventory
Achievements
Camera

Crystal

Infrastructure

Audio

User Interfaces Across All Pages
Juicy UI
User Interfaces Buildings
Guidebook
[Resource Management](Resource-Management)
Map
Day and Night Cycle
Unified Grid System (UGS)
Polishing

Game Engine

Getting Started

Entities and Components

Service Locator

Loading Resources

Logging

Unit Testing

Debug Terminal

Input Handling

UI

Animations

Audio

AI

Physics

Game Screens and Areas

Terrain

Concurrency & Threading

Settings

Troubleshooting

MacOS Setup Guide

Clone this wiki locally