Sony Rewards is a loyalty program where customers can redeem Sony products, games, and coupons using points earned from purchases on Sony platforms. Merkle has a longstanding partnership with Sony, and has a dedicated team that designs and updates the Sony Rewards App and website. This includes developing the design system, crafting the UX/UI, and implementing new features via close collaboration between Sony and Merkle.
Therefore, for this project, Sony wants to add an "Event" category to the current redemption experience to enable users to redeem tickets for concerts, sports, arts and theater events, etc. Eventually, Sony can boost enrollment in the Sony Rewards program and drive revenue by increasing redemption usage.
How might we help users efficiently pinpoint the events that they want to redeem?
Create a new ticket redemption experience based upon the existing app/web design
I was invited into Merkle's Sony Rewards account team as the only UX designer in this Event feature design project. This team has been building Sony Rewards's digital experience since day one and owns the design system. So I need to create a new event ticket redeeming experience based on the established experience.
My responsibility in this team is similar to that of an in-house product designer, including research, competitor analysis, problem define, exploration, wire-framing, and crafting pixel-perfect hi-fidelity prototypes.
Since this new feature should be built based on existing experiences, the first step I took was to understand the current redeeming user flow.
The current redeeming experience includes four primary steps as below. Since the checkout page is the same website checkout page embedded in the app, I decided to focus on the first three steps while designing the App experience.
Not always do we have enough time and resources to do the full version of user research. But luckily, we have a research team who already did UX research for another Sony Rewards Design project.
So I started my research by asking the research team questions to understand the existing user pain points from their research findings. Then I conducted Competitor Analysis and User Survey to validate their results.
I asked the research team questions, including:
“How do users make decisions to redeem products?"
"What are users’ pain points in the current experience?”
...
The target users of the new event redeeming feature might differ from the existing user group, and the user needs and behaviors might change.
I want to identify the gap between existing experience and potential new users' needs/behaviors.
Currently, users will go through a series of actions to complete redemption. Users spend most of their time on "Shop" to identify the product they want to redeem.
Here are the two primary pain points that slow down users' experience at the "Shop" phase. And I will dive into each pain point in the next section.
01 Struggling to search a group of items
02 Hard to compare items quickly to make decisions
Here are the two primary pain points that slow down users' experience at the "Shop" phase.
Users can’t find products accurately with current filters.
“I want to see the 5-star products, but there is no filter for the rating...”
Current filters only have two kinds - "general categories" & "color," and users are not satisfied with the limited filter capability. I suggested to the team that we couldn't go with the existing filter setup.
Moreover, based on my survey and competitor analysis, typical event goers are used to searching events by "Date," "Location," and Artist/Team name."
Therefore
1) A gap between the capability of existing filters and event goers' needs
It decreases the accuracy of the search results for users.
We must fix the mismatch to help users find the events more efficiently.
Users have to click many times to use filters, which slows the search process.
“Sometimes, I have to click into the filter modal to double check if I apply any filters.”
I got the insight from the research team that the current filter is hard to use but also included some questions in the quick survey to clarify the real reasons. Meanwhile, I also conducted a UX audit for the filters against the usability heuristics and did some rapid user testing with the internal team according to the filter issue.
Users' search process got slowed down by the current inefficient filter design. No filter status is displayed on the catalog page, so users have to open the filter modal to recall what filters they are using. Also, many filter details are crowded in an accordion within a small pop-up modal. Users need to click and scroll multiple times to open the filter.
Therefore
1) memory burden caused by filters with low visibility & lack of status
2) extra interaction cost caused by complicated ways that users input data into filters
Those problems need to be solved so that users can pinpoint their events efficiently.
Users can’t collect the right event info via chunks of text to make decisions.
“I hate finding details from a big paragraph...”
Based on my survey, there are at least three critical information users want to know to compare events - "Time," "Location," and "Artist/Team." However, when I quickly prototyped a version with the top 3 event data and the existing product list design, the product title became a long paragraph. It is hard for users to compare/read/scan swiftly to make decisions.
Therefore
1) how to prioritize Event Time, Event Location, and Artist/Team Name in the user flow
2) how to make the product list easy to compare/scan/read
Those are the key problems we need to solve. And we need to rethink the product list design to solve those problems.
Therefore, eventually, I landed on a single critical user problem and broke it down into two design tasks:
Date & Location Information is prioritized on the Event card design.
The two pieces of information are aligned vertically for higher scannability.
Meanwhile, this design required the minimum updates of existing design components for consistency.
Filter with a dropdown menu is the only one brand new design component engaged in the system. In this case, users don't need to jump back and forth between modals to recall filter details.
Based on my research, "This Weekend" and "This Month" are the most often keywords event-goers use to search for events.
Meanwhile, I added a date selector to enable users to search events by date range.
Users can type the location into filters or directly enable the geolocation feature to search events by location.
Also, users can select a distance to see the events in the area around the specified city.
Instead of searching artist/team name via the search bar, users can sort events by the name. Events will be grouped by artist/team name. When users click "Load more," the list of the artist's events will extend to a full version.
Tickets will be displayed in groups based on the number of tickets selected by users. Only two continuous seats will show in the list if users select "2 tickets".
Eventually, users can lock on the specific seats by seat filter.
*Dynamic Map feature is not in the project scope this time. So users can review a static map of the venue by clicking "View the Venue map" for now.
Based on insights from the research team, user survey, and competitive analysis conducted by myself, I landed on two design goals for this challenge.
Goal Breakdown:
1) Prioritize Event Time, Event Location, and Artist/Team Name in the user flow
2) make the product list easy to compare/scan/read
For the team's proposal, I decided to explore and validate it before moving forward with it. Eventually, I came up with three versions of the product list design and showed them to the team to let them see the differences and collect feedback.
During the discussion, I pointed out the difference between the Sony Rewards event ticket redemption feature and other ticketing platforms like Ticketmaster and VIvidSeats. Normally those platform has an independent module called "View by Artist,' so that users' regular shopping experience - browsing events by location and date - won't be interrupted. But for Sony Rewards, we have to engage new pages and components to enable users to select artist/team names first since we are building a new redemption category based on existing experience.
Eventually, our team went with the third version - the one that allows users to select events by location and date for the following reasons:
To solve the request - enabling users to view events by artist/team name, I updated the sorting feature and received lots of positive feedback from clients regarding the design.
Through 3 rounds of iteration and feedback collection, I landed on the final version of the product list design and product detail page design, which solved the user pain points, balanced the visual requirements of the creative director, and satisfied the client's extra needs.
Based on insights from the research team, quick user surveys, and competitive analysis that I conducted, I landed on those design goals for this challenge:
Goal Breakdown:
1) Fill the gap between filters' capability and users' needs
2) Increase the visibility of filters
3) Enable users to input data into filters efficiently
Typically, all event information should be mirrored into filters. However, since the team wanted to build an MVP version to meet the tight timeline, I need to prioritize the most urgent needs for filters and confirm with the dev team to make sure the feature can be implemented on time.
Therefore, based on users' priority for filters and confirmation from the dev team, I landed on the filters as below:
After I confirmed the filters we needed to build in the new feature, the first thing I did was to quickly prototype a filter design that embedded all filters into the existing filter components to take consistency into account.
When I showed this version to our internal team (including the design system people) during our daily scrum stand-up meeting, all team members agreed that this version was too overwhelming for users. It made the existing pain points worse.
Therefore, I brought the whole team on the same page that we need to engage new design components for new filters.
Then I explored various types of filter patterns and landed on filter bars. But I want to manage the balance between consistency and usability carefully, so I designed two versions with filter bars and showed them to the internal team and dev team for feedback. Eventually, we went with the second version.
Then I started identifying the best way for users to input their data into filters. And the location filter has lots of variations used by other competitors, and I need to find the one design that can solve users' needs while taking care of the feasibility.
So the first thing I did was to chat with the dev team to confirm the feasibility of the ways that help users input their location information.
Eventually, I decided to use geolocation and predictive text to help users input their location information.
And here is the location filter design, which decreases the time and alleviates users' memory burden.
Eventually, I landed on the final version of the filter design, which solved the user pain points, and improved filters' efficiency, while engaging the minimum number of new components.
01 Received positive feedback from team and client;
02 Got Approval from the client successfully on time;
03 Inspire the new initiative of overall redeeming experience redesign
The scope of this project includes App design and Website design. For the project plan, our team decided to start with website design at first, since we have a really tight timeline and the development phase of the website is shorter. But I mentioned that there are more limits on App design, like, the screen space is smaller on the phone, and the phone screen doesn't have a cursor.
Therefore, to avoid unnecessary iterations between Website and App design in the future, I suggested to the team that we should start with App design first, and then build the website version based on App design. And the team agreed with my suggestion. Eventually, we spent more time on App design, and website design went faster based on the App design.
