Project Goal
The main goal was to create a mobile version of GATE Control Station and thus to provide an excellent user experience for airsoft players adjusting their replicas on the battlefield. It quickly turned out to be a base of a completely new desktop version also.
1. Discovery Phase
Previous Implementation Analysis
The previous implementation of GCS was exclusively available on Windows and macOS. I knew the game-like aesthetics was a good direction, and I wanted to push it further. The app wasn't mobile-friendly, though, and felt outdated even for 2017. However, it was a good starting point for me to learn about airsoft mechanics and GATE products in general.
Competition Analysis
Several companies are competing in the delivery of modern airsoft devices able to be configured via mobile apps. At the time, most of them already offered Bluetooth communication which GATE was only planning to release. It was clear enough the new design has to be ready for the devices which were to come with wireless communication and advanced telemetry.
User Research
We've used some customer research data when creating user personas. I've also dived into the online airsoft communities to learn more about their language, approach, and priorities. The resulting personas made it easier to work on user flows with the rest of the team. I've also run in-depth interviews with airsoft players which helped to verify many hypothesises during every project iteration.
2. Design Phase
Wireframing
I like making ideas visual quickly, so hand-drawn wireframes are my way to go when testing design in the early stages. Of course, they are not beautiful but they serve as an efficient and practical medium to discuss and note ideas with co-workers. With the first iteration, those sketches became a foundation of high-fidelity wireframes.
Workshops
To ensure everyone in the team is on the same track, I facilitated workshops with product owners, developers, sales representatives and airsoft players. The engagement from such a broad spectrum of perspectives resulted in quicker validations and some great brainstorming.
Information Architecture
From the main menu and dashboard to every setting's option and context message possible - a dozen content types and a few hundred elements were taken into account while rethinking navigation and information distribution. Everything to make the experience as easy as possible even for the newcomers.
Visual Design
The airsoft players are very often gamers as well. Therefore I focused on delivering the aesthetics which would remind them of modern shooters or movie-like futuristic Head-Up Displays. I wanted the visual experience to be fun while remaining simple and compatible with Material Design and Human Interface Guidelines.
Prototyping
Ever since Adobe XD premiered prototyping tools, I've delivered almost every new logical process and screen I was working on as a clickable prototype. This way, everyone in the team could get a feeling of actually using the app and provide feedback even before any coding.
UX Writing
During the app development, I was sharing my UX knowledge with the whole creative team to prototype microcopy, which was later revised by language specialists and adjusted for the best results.
3. Production Phase
Specification
I was publishing all screens and components as a specification on Adobe XD with upfront assigned naming convention, thus enabling developers to download and manage assets in their developing environments with ease.
Documentation
Except the Adobe XD specs, a lot of written documentation was being created to cover otherwise hard to visualise aspects of the design such as grid system, microcopy states, animations and more.
Testing
Every idea and hypothesis needs to be verified, and I think the best way is to give the product to the target users and ask them for feedback. But before that, we were testing the apps ourselves, reporting and fixing as many bugs as we managed to grab.
And then the iteration cycle repeats.
.jpg)
