The Challenge
In the spring of 2014, Memolink decided to expand their rewards platform to capture their ever-growing mobile market. Memolink’s desktop platform allowed users to collect, manage, and redeem reward points. I had two months to create a mobile interface that parallelled the desktop platform. With an improved search function and a new “my favorites” feature I created a strong mobile tool for savings.
Timeline: 2 Months
Mobile Site: http://m.memolink.com
My Role & Deliverables
- General Research
- Site Map (Slicksplan)
- Wireframes (UXPin)
- Interactive Prototyping (UXPin & Fiddlefly)
- Pattern Library & Style Guide
Understanding the Problem
A big hurdle that I had to overcome was figuring out the different user flows and the unique set of criteria for each one. Memolink provides five ways for shoppers to collect cash and apply discounts while they shop. There was also an account section where users could manage their settings and redeem points and rewards. All of this had to be translated seamlessly to mobile without sacrificing quality, content, or function.
Building the Structure
After I knew the user flows, it was time to start building the foundation. Using the wireframing tool UXPin, I was able to translate my rough sketches into more detailed, functional prototypes. By interacting with the prototypes, the team at Memolink had a user experience that was more accurate than the one they would get from a static design.
Explore the Wireframes: https://goo.gl/MxElgL
Creating the Components
At the time, pattern libraries were not as common as they are now. Memolink was the perfect example of component based design because it had a repeating frame individualized with a variety of unique components. Instead of designing out every key page, we designed each unique element of the site. This significantly reduced development time, helped maintain consistency, and reduced the number of lines of CSS. This process simplified the development of new key elements, functions, and styles
Key Features
Navigating the Deals
A major element of my work included expanding the search function for the user. The challenge was the existing workflow and back-end restrictions limited users to only searching for stores or products or coupons, rather than a search that combined all three elements. The impact of this was multiple searches and results. Through my work I was able to build in various filters allowing for one unified result. These filters allowed users to search alphabetically, by category, or by incorporating their favorites from previous searches. One search and multiple filters gave a great result- an easier experience for the user!
My Stores
The My favorite feature allowed members to mark their favorite stores and quickly access them on the desktop home page. This feature was buried on the bottom of the landing page making it less accessible to the user. I advocated to emphasis this feature throughout the mobile site making it easier to find coupons and products from the stores users love. I also introduced the functionality to reorder your favorites with simple tap, hold, and drag gestures. These features were especially important for user's couponing on the go.
Point Management
The most important aspect of the project was allowing users to manage their points with ease. To encourage the user to be active on the site, I built in ways to highlight the users' points throughout. These changes encouraged users to click more to get that big reward. I created a dashboard where users can access their account, profile and most importantly manage their points. Unlike other sites at this time, which offered minimal functioning on the mobile site, I was able to create a mobile interface with identical functionality to the desktop site.
The Result
Final Thoughts & Lasting Impressions
The end of June marked the end of my first major project as an independent contractor. Throughout these three months, I exercised my freedom to make new creative decisions and strategies. Many of these strategies included client involvement, rapid prototyping, and pattern libraries, which have become a staple in my workflow today. Almost a year later, I am still proud of the many hurdles I overcame to produce a modern mobile design that looks as if it was built today.
Want more?
Visit scott-thomas.net for more examples of my work
