RewardOps
My time as a Product Designer at RewardOps was an enriching opportunity that allowed me to grow as a design professional. As the sole designer on the team, I was responsible for improving our user interfaces, expanding the body of knowledge about our user base, and most importantly, launching new products. By the end of my time at RewardOps, I had successfully created a white-label e-commerce design system and component library that was reskinned to launch Desjardins’s BONUSDOLLARS.ca website, revamped the account management features of our order and item management dashboard, while creating a set of personas and user flows in the process.
RewardOps powers the loyalty industry by connecting programs like Aeroplane, LoyaltyOne, and US Bank to a vast network of suppliers within our item and order management dashboard web application. On the app, program managers select and price merchandise, generate purchase reports, and create seasonal promotions while customer service agents use the dashboard to troubleshoot orders. This product was slowly being refactored to run on React, meaning the design system would eventually switch to React MUI. I kicked off the design portion of this effort by redesigning the Account Management features in the new design system. This initiative included changes to features such as password and username change modal windows and an impersonation feature that allowed RewardOps employees to view loyalty program information as our users see it.
High-fidelity mockups for Australian bank Westpac’s loyalty store.
I was onboarded around the time RewardOps was launching Air Canada’s Aeroplan eStore. This was a new initiative for the business as it moved from solely powering web stores to building them as well. The contract with Air Canada saw their design team own the designs and RewardOps served as a dev shop. This was costly and unsustainable as web stores for future clients would have to be built from scratch. This is where I was tasked with building a white-label e-commerce design system and component library that would be hydrated with the branding of future clients allowing the business to quickly spin off new web stores with minimal rework as well as outlining the general design business processes that governed how RewardOps would interface with a client’s marketing and design team from project inception to completion.
White label components with differing styles to match a client’s existing online experience.
Building a design system and component library from scratch is no easy task. It required extensive research into the layouts, user flows, and components of popular e-commerce platforms, specifically those of big-box retailers. The loyalty program user base is comprised of your average online shopper; middle-aged, with an adequate grasp of technology, tending to use their mobile device over a desktop computer. The RewardOps white-label aimed to leverage our user’s experience with existing e-commerce platforms by employing standard components for navigation, search, filtering, and checkout while also mirroring the user flows of these websites. The design work was performed by modifying the React MUI library guided by mobile-first and atomic design methodologies, making minor tweaks to existing components only where necessary to lessen the workload on what was at the time, a development team with several junior members. After the launch of the Desjardins BONIDOLLAR website using the white label based on React MUI, senior developers decided to change course, opting to switch to shadcn/ui design system with Tailwind CSS as a framework for future loyalty clients. My work began on the second generation of our white-label e-commerce product. After delivering the first mobile prototypes, which included new features such as a cart and wish list, cash/points split components, and a new responsive item grid, I was relieved of my duties at RewardOps. RewardOps needed the business of a new client every year to remain profitable and the client slated for 2024 deferred indefinitely. With little design work on the horizon, my chapter in loyalty e-commerce had ended.
As a designer, e-commerce was an exciting industry to be immersed in. While a lot of the UX does not differ greatly from site to site, there are small but impactful ways to make a difference in how the user navigates to their preferred products and checks out without abandoning their cart. In the early stages of building RewardOp’s white-label product, I focused on emulating the UX of successful retail platforms. However, point redemption e-commerce differs slightly from these experiences and changes a designer's approach to our work in this industry. As a designer, grappling with points balances, redemption multipliers, and cash and point split redemptions presented unique challenges that required exhaustive user research and testing. These challenges also helped hone my design intuition. With this new knowledge and the many lessons I learned from my first position at a modern tech company, I am ready for what the future holds for me as a Product and UX Designer.
Tools
Sketch and Figma
Zeplin
Invision
Storybook
Webflow
Lucidchart
Google Analytics
Abstract
React MUI
Shadcn/ui
Tailwind CSS
JIRA
Skills
User-centered Agile design
User interviews
Industry analysis
Lo- and hi-fidelity prototyping
Paper and rapid prototyping
Task Analysis
User flow analysis
Empathy mapping
Service safari
Site mapping
Persona creation
Atomic Design
Mobile First
Double Diamond
Design Thinking
Design Systems
Component Libraries
A/B Testing
Usability Testing