Starform

UI / UX Designer

10 Week Contract

Starform brought me on as a freelance designer to update the Squadron system for Metalstorm. I refreshed its visual design to align with the game’s newer UI, improved the UX where the existing flow created friction, and made sure the final system felt consistent with the rest of the game. The project drew heavily on my skills in visual systems, UX design, and working within an established art direction.

Basic Process

When I started working with the team, they asked me to follow a 3-phased approach to the work with each phase lasting about 3 weeks with 1 week of extra time just in case.

Phase 1: Basic Wireframes

During Phase 1 of the process, the team asked me to keep things simple with just some basic wireframes. This phase was focused on screen layout, visual hierarchy, and ensuring that all functionality was present.

Phase 2: UX Polish

During Phase 2 of the process, I was asked to start adding in established iconography, completely nail down the UX, and wrap up functionality changes that either I missed or the team requested. There might be some small edits done in this phase when it comes to sizing and spacing of elements when iconography starts to get introduced.

Phase 3: Visual Polish

During Phase 3 of the process, this was time to start adding in color and polish typography. The team gave me some references to other screens in the game for me to have a decent idea on what it should look like. This is where everything came together.

Squadron Screen Mockups

Phase 2 Wireframe

Squadron Match History

Squadron Chat

Phase 1 Wireframe

Phase 1 Wireframe

Phase 2 Wireframe

Phase 1 Wireframe

Phase 2 Wireframe

Squadron Members List

Phase 1 Wireframe

Phase 2 Wireframe

Squadron Invites List

Phase 1 Wireframe

Phase 2 Wireframe

Squadron Info Page

Other Mockups

Phase 2 Wireframe

Create Squadron Modal

Find a Squadron Screen

Phase 1 Wireframe

Phase 1 Wireframe

Phase 2 Wireframe

Phase 1 Wireframe

Phase 2 Wireframe

Squadron Members List

Phase 1 Wireframe

Phase 2 Wireframe

Emblem Selection

View Squadron Info Modal

Region Selection

Previous
Previous

uGen

Next
Next

Friday Games