Mobii was an app that enhances a user’s interaction with their surroundings while developing a stronger relationship with brands and advertisers adding a new layer of engagement. Television, radio, streaming and even geo-spatial locations come alive with content being sent in the form of deals, coupons and various entertainment content. It’s really an app about the quality of life dealings and relationship between consumers and providers, while adding a bit of joy and monetary benefits to both parties. This was the flagship app during my time at ACTV8me Technologies where we signed with partners such as AMC, Diebold Nixdorf, GSTV, Live Nation, Univision, Valassis and more.
UX/UI, Product and Visual Design / Front-End Development / Android, iOS, Web
Abstract - Bootstrap - GitHub - HTML/CSS - Illustrator - InVision - Jira - React - Sketch - Photoshop
A basic competitive anaylsis of Mobii and associated technology gives a snapshot of what's being provided on a feature level. While there is overlap, Mobii had some clear advantages over what the competition was doing at the time. Knowing where we stood helped the team prioritize and direct efforts and my tasks.
High-level feature comparison
User flow of initial and most basic instance of Mobii
User flows aided throughout the design and development process as high-level guides from which I created requirements and then broke into actionable assignments. With periods of project management ambiguity or nonexistence, this gave me a sense of continued direction as a default direction .
ACTV8me moved really fast and the Mobii app was constantly being updated. As a result styles tended to drift. So I shepherded, created a basic style guide distributed it to the various teams so we all had a common visual language. This would become increasingly important as we started moving towards white labeled solutions. This very simple set of styles multiplies very quickly across several platforms - as a result, inconsistency here provides significant issues later so initial synchronicity is crucial.
Primal foundations that will eventually evolve as in the case with
GSTVWhen the app is listening this video sends targeted content to it
This video was intended to distill Mobii's concept for easy consumption through demonstration. With the app listening and this video is playing there is a trigger that will send content to the user. The content received is filtered based on targeting (set by a dashboard) to give a sense of the potential of the technology. When paired with business outreach it was a powerful tool that acutely conveyed what the technology might do for users.
During the onboarding process we made certain to inform the user of powerful and fun features including Auto Mode, Daily Scratchers, the Digital Wallet and various ways Mobii interacts with the world.
Guided copy and a brief tooltip tutorial helps new users understand the basics so they can start doing what matters - interacting with Mobii
Short video of the splash icon
To set the tone for the new design of Mobii and to start establishing new expectations of collaboration between teams we designed a new loading animation. Simple in concept and execution, it represents the positive relationship of user, business and content as well as the engineering, business and design teams that make that relationship happen.
A feature that gives the user free digital scratchers every day with a chance to win prizes, offers and special content of various types based on their interests. It refresh every day, provides ways to get more scratchers through activities such as social sharing and provides opportunities to fine-tune content for the user as they use the app moving forward - increasing relevance and interaction quality of content.
Digital content served in the form of Daily Scratchers helped maintain user interaction with content
The team used focus groups to gather insights to help in understanding user needs, refining features, and improving the overall user experience of the platform. These were an excellent source of user feedback for me to draw upon. I supplemented this with my own very informal focus groups and it was very interesting to note the similarities.
CBS focus group testing of the Mobii app
Promotion cards were the main offer format delivered to the user. When a user decided to keep the offer beyond the initial delivery, they were stored in the user's wallet. From there the user could redeem the offer. There were three variations of redemption depending on settings dictated by content creators: online, in-store or choose from either.
Offer variations and wallet user interface designs
The Mobii Live show featuring the hilarious Jenifer Golden and Lauren Leonelli of the it's Complicated podcast
We created our own show featuring activities and interactive segments with Mobii so users had a set interaction period with the app, an entertaining time with Jen and Lauren and to provide offers to the benefit our partners and users. Triggers were fired at certain points of the show which sent content to the app. From there the users would interact with the content based on type. To further engagement we also had a live chat during the show that I moderated.
These cards greeted the user on the home view and provided an immediate way to interact with content. Graphics, content and actions were all easily manipulated on a dashboard. These cards allowed us to present immediate and controlled information.
App updates
Current and upcoming events
Universal content
Customizable content cards provide fresh offers and relevant deals
This interface allowed for the creation and manipulation of content. Editing here would be reflected in the application nearly immediately. In this way content of all types could be directly edited providing extreme flexibility. Being a very nimble team with many operations often occurring at once this was of paramount importance. I collected invaluable if not informal feedback from the content team when designing this feature.
Accurately reflect content instance
Ability to edit directly, increasing expectation match
A preview accompanies data input to help ensure intent matches output
Templates for quick design in Sketch to help quickly go from design to code
To facilitate quick content turnaround I designed and developed dozens of micro-sites. These sites were content containers optimized for mobile viewing and were wrapped within the application to have the feel of a native view but the flexibility of the web. This allowed me to create what felt like new app content without the delay of pushing updates.
One of the requirements of Mobii was a continuous saturation of the market. As a result the team went after and were able to team with some very impressive partners. The variety of these partnerships and branding identity requirements led me to create a way to quickly theme content based on a few branding elements.
Mobii and Sandra Lee (one of my favorite visitors to the office)
A simple but functional tool to help with QA
As work on Mobii traversed the various ways it interacted the environment, reporting issues and performing QA became increasingly complex. So to help reduce friction, I worked with the dev teams to create a basic but surprisingly useful tool to surface information to be used when performing quality assurance. This was very useful when implementing new features and checking design to development fidelity.
A significant part of Mobii really wasn't the app itself, but rather the core technology - the software development kit. We packaged the tech for distribution through our SDK which allows partners to inject our tech into their own app, using it as a wrapper with our SDK feeding into it. I worked with our product and developer teams to create a documentation website, SDK request process and design files featuring a white label app template ready to style.
GSTV app with SDK and visual design
The website was editable with markdown affording team contribution
At one point the team hired a documentation creation group that I worked with to design and develop a documentation site. Initially I just styled that site, but eventually the content started to require different editing capabilities so I designed and developed a solution for relatively easy updating with very little upkeep requirements. Both sites were very useful and also sharpened my component based front-end development.
Working with this product at almost all levels with nearly every team expanded my design and product thinking massively. I became extremely sensitive to the system as a whole. The capabilities of the teams and the priorities of the business started to guide my design priorities, I began to slip between big picture and pixels. I started thinking about how every aspect of the design affected engineering, design, content and business and as a result how to best design to get things done with what I have based on priorities and capabilities (and the people working on all of it).
Being in the position to mentor during my work throughout this project, I also began to fall in love with teaching and trying to help anyone interested in design. I'm pretty sure a few office doors are still locked in an effort to block out my discussions.
