Blackfire Research provides high performance Wi-Fi streaming between smart phones, music sources, and media devices. I was a lead designer on a redesign of Blackfire’s Android app, which needed to be updated from a basic prototype version. The project goals entailed the following:
I worked with a cross functional team on all phases of the project. I created a project plan, conducted workshops to solve user flows, explored design concepts, created final visual designs, and produced a style guide for developers to reference.
The project began with a kickoff meeting to get a high level understanding of the problems and goals and was followed by a demo of the existing app. It was clear that the overall design and interaction was lackluster and onboarding wifi/speaker configuration was convoluted and confusing.
In these initial meetings there was an enormous amount of blue sky ideas of what the app could do. The possibilities were endless, but we had to reign in the ideas to fit the budget so part of my role was to define scope of work and get agreement, which we did. At the core of the app there was plenty of basic problems to solve that would make for a compelling redesign and achieve the primary goals while also meeting the client’s budget and timeline.
I then did a competitor analysis to become familiar with the space. I am a big music app user and was already familiar with Spotify, iTunes, Pandora, and SoundCloud, but I found new patterns using Amazon Prime and Google Play’s music apps as well as gleaning as much as I could about Sonos for room and speaker configuration.
Ideas were flowing. I took a lot of screenshots of apps and made notes. I reviewed Material design to get up to speed on the latest Android design guidelines and then I led a workshop with the team that started to map out user flows.
Initial Concept Explorations
Next the design team and I developed a series of visual concept designs that explored the look and feel the app. The client was eager to see these at this early phase so we obliged and set about exploring icons, texture and patterns, typography, UI and color.
Sketching & Annotating
The client was excited about the visual concepts and we began to select elements from each concept that might be used. I then started to sketch the UI and figure out the interactions for the app based on the task flow charts that were created. Usually I would create wireframes but the client didn’t think these were necessary because he felt the developers would be able to piece together the interactions and screen flows. I knew from experience that this was going to be an issue and problems would surface. This wasn’t the ideal process and I pushed back, but the client insisted. To remedy this I decided that later I would annotate screen designs in the style guide so developers could at least understand how the app worked on some level. So, in this sense, I ended up creating high-fidelity wireframes.
Finalizing the Design
After sketching out screens I began to take elements from the concept designs and methodically created a visual system that felt cohesive. Several rounds of designs were created and reviewed with the client stakeholders. Once approved I created a style guide that included the final designs with annotations and specs for the interface, interactions, animations, typography, colors, and buttons.
The overall app design distinguishes Blackfire from its competitors. All of the objectives of the project were met and delivered on time. The scope of work was defined while a backlog of blue sky ideas were captured for future implementation. The app redesign created a vastly improved user experience including a compelling interface, interactions, and visual design. The complex tasks of connecting the host wifi network to the device, creation and control of different music zones, and playing/tracking multiple third-party music sources was made simple and intuitive.