1APP - MAKE YOUR MOBILE ACCESSIBLE INSTANTLY, THROUGH THE CLOUD
HOW DO WE DEVELOP A BETTER LOOKING TOOL FOR THE INTERNAL TEAM?
PROBLEM
The challenge was to create a better looking interface for the internal team at 1App. In our industry we often make great visuals for the consumer, we now must switch gears and make a better visuals for internal teams.
SOLUTION
Our goal was to represent the data as moving infographics and colors. Fortunately for us, we have all adapted to standard digital practices that would allow us to take liberties and gamify the experience.
Scope: 1 Month
Categories: UX Research, UI/UX Design, Motion Graphics
Role: Sole designer working with a UX Researcher
Tools: Balsamiq, Photoshop, Sketch, After Effects
THE SOLUTION IN DETAIL
IT SHOULD FEEL FUN
This product makes games instantly available on mobile devices by streaming them through the cloud. Gamers can start playing without having to funnel through the Google Play or the App Store. Companies that utilize the platform can also receive detailed feedback and analytics of how users interact with their game.
All of this presents a large amount of data to our internal team to look at, so to keep our internal team engaged we pumped up the visuals. Since mobile games are the focus we brought some of that visual flavor from the gaming world over to the dashboard.
DATA THROUGH DESIGN
Our mission was to change static data and basic charts into clean typography and eye popping graphs. Dashboards typically are plain for good reason, for readability. We focused on the hierarchy of information provided and applied a graphic design eye across the board.
COLORS ARE OUR FRIEND
Choosing a dark theme with an overall color tone helped us pop out our graphs. Using multiple colors can be a slippery slope so instead of using all the colors of the rainbow we settled on a few choice colors with varied hues. Game UI design dictates “green for good” and “red for bad” , we felt this was perfect for our user to focus in and interpret the data.
ORDER AMONGST THE CHAOS
In our aim to make visually appealing design there were still many areas such as menus and dialogues that really only required text. We decided to clean them up keep them simple. This gave us contrast between two types of data sets and set up a new standard for the platform.
In the end even with our bold design decisions, we adhered to standard dashboard practices. It’s not as pleasing to the eye as other areas we worked on but reduced our risk of making the entire platform cluttered and unreadable.
MOTION & ANIMATION
THE PROCESS
MOOD BOARD AND EXPLORATION
Establishing a strong design direction was important to how we planned to represent the data. The foundational thought was ‘cool vs. warm’, the overall color tone would be cool to subdue the general layout. The graphs however, and other fun part would tilt a little warmer to stand out.
WIREFRAMES
A lot of planning went into the project before we even made wireframes, because of the amount of information, we gathered feedback step by step from internal team that planned to use the platform. Once our ideas were more concrete and the architecture was in place we were able to expand on the design.
*Keep in mind these are only a handful of wireframes, the total number of screens are 15 give or take a few sub pages.