Brief

Outserved is a geo-fence marketing application that allows local businesses to target customers on a deeper level and offer deal-based incentives to drive recurring sales.

The Challenge

Outserved started with just a few local businesses in Lubbock, TX, but quickly grew to over 120 businesses within a few months. Outserved needed a fresh new user interface for their business marketing solution. The mobile app needed to be simple for customers to use, but also robust for businesses to gather analytics and quickly prepare and send deals to prospective customers who come within a set proximity of the business location.

 

Wireframes

I started by sketching wireframes with good ol’ pen and paper to quickly explore concepts and try out variations in design. I then moved to mid-fidelity designs to start building out initial concepts.

User Flows

Since the application contained many features it was important to layout the user flows to ensure there were no holes in the user experience. These diagrams are my best friend, it really helps me to see everything at a glance since it’s easy to design screens and interactions and later find out they don’t connect.

Visual Design

Developer Handoff

I worked with an all-star development team. The client wanted to get the app into customers hands as soon as possible. We worked together for about 2 months to implement all of my designs. I created multiple animated interactions in the app, and thanks to tools like Kite and Flow, I was able to hand off native production-ready code for the animations. This along with Zeplin for design specs made the engineering process go a whole lot smoother.

Launch

Outserved launched early in 2019 and started doing well immediately. I had started using the app myself, but unfortunately couldn’t use it to the full since I’m not located in Texas, USA.

 

Gamification

After a few months in the app store, we saw that many users were downloading the app, but getting them to stay and engage businesses was starting to become difficult. We found this was due to businesses having to offer deals, and many times, if they didn’t regularly present offers, users would bounce. Our solution was adding an in-app rewards system that doesn’t solely rely on local business’ offers. Users could complete a number of tasks or “missions” and received points, which they could in turn redeem for gift cards from various merchants. This was a super fun addition to the app! I had a blast designing the rewards system and animations. Once we launched the update, users immediately loved it.

Outcomes

The app has been doing well in the Apple app store and the Outserved team continues to grow with more locations across TX and will soon expand to other States.

Key Learnings

  1. Onboarding design is crucial While the “deals” concept is nothing new for users, this app included numerous unique features that wouldn’t be immediately familiar. By using the onboarding process to also serve as a mini tutorial, we were able to ensure people understood. all of the functions
  2. Be open to new tools Throughout the project I designed multiple animated interactions that needed to be precise when implemented on the engineering side. I came across Flow and Kite, and was able fine-tune animations and export the code directly to the developers. This was my first project actually using code from tools like these. Now I won’t do another project without them. It alleviates developers from having to guess timing and keyframes to get the animation just how you design it.
  3. Always use components and instances! A design system is only useful if you use it. Not only did the company go through a rebrand during the project, but that also brought many new flows to the app, and being able to update colors, buttons and forms one time was a game changer! Often I found myself detaching original instances to make changes, only to have to update multiple buttons because I forgot to make it a component. I learned to always create new components when changes happen and use instances if I even think there’s a chance of reuse.
  4. Do user research throughout the entire process Once users started to drop off the application due to lack of business deals, I really saw the importance of doing UX research at every stage, especially once you launch. While you can get feedback from App Store reviews, that’s the last place you want to find them, as it can lower the overall perception of your product. I’m glad we caught the reason for users bouncing when we did, but it could have foiled the entire project. Even if I couldn’t do the research I wanted, I can always do something, even if it’s a simple survey or polls on twitter.

Download Outserved Today!

Michael is very easy-going and stays on top of everything. This is the second time we have hired Michael and each time he has blown us away. Michael will continue to be our first option when it comes to UI / UX design. Brock F. , Outserved