Digital Defenders
A concept mockup game, created in a group of 2
Target Platform: Android / IOS
Game Genre: ARG
Roles:
• UI Design (Visualisation/Mockup, HUD, Logo Design)
• UX Design (Wireframe, Prototype)
Elevator Pitch:
Digital Defenders is an augmented reality (AR) mobile game where players use the mobile application to assemble clues that they find in the real world and solve monthly puzzles. 4 Players work together in "Share houses" as "housemates", where each of them has their own abilities.
Wireframe
This is the high fidelity wireframes I've created for Digital Defenders. After researching a few ARG games and based on the gameplay I received from my teammate, I've narrowed down the UI and UX needed for the game.
• Landing Screen
• Menu
• In-game messenger
• Class
• Progress Screen
• Mission - Stealth Attack
• Mission - Defense
• Mission - Secret (not visualised)
Software: Figma
User flow
Here are the 6 user flow documentations to demonstrate how users can interact from the wireframes above. Including:
• Players choosing their class
• Players double checking the class's details
• Check game/story progress
• Sending Message
• Attack Tutorial
• Defense Tutorial
Software: Figma
UI Design
This is the visual design of the Digital Defenders with the HUD and icons designed for the classes, which also work as the players' avatars for the in-game messenger. The overall art direction is clean, minimalistic and has a hacking theme. I've also searched up a code (hacking) and placed it as the background, where it could be animated the code to auto-scroll downwards if it is programmed.
Software: Illustrator, Figma
@Created by Daisy Chan 2021