Higher tier experiences drives higher spending falling in line with the "spend-centric" business of American Express. In addition, the more experiences purchased with an AMEX membership also leads to more incentives for merchants to become AMEX partners and non-AMEX members and merchants to sign up in order to get access to these higher-tier experiences and clientele.
Design and Process
This section focuses on showing a brief summary of the development and design process. For a full breakdown of each design decision and how the project came to be, please feel free to look at our process book.
Process Book (Click to View)
Customer Journey & Touch points
To begin the design process we began by looking at the customer journey of before, during and after the discovery and purchasing of a membership experience. Ultimately we decided the best way for us to intervene were touch points in the "during" process of a membership experience which included searching for an experiencing, choosing the right experience, purchasing the experience and attending the experience.
American Express Customer Journey "During" Touch points (Click for Full Journey Framework)
The main features we decided to include with our proposed solution largely came from the journey framework and touchpoints, as well as the pre-existing membership experiences website. Ultimately we decided on including the following main features:
Shows an exclusive variety of experiences that have very limited offers (quantity or time) and are available to all members regardless of their membership level.
Freely browse and discover for new experiences by curated categories.
Recommended experiences for each member based on data from the American Express closed-loop network.
Events occurring within a specific range based on the member's current location (or a location of their choosing).
A list of experiences that the member has shown an interest in or if they decide to not purchase an experience immediately.
Wireframes and User Flow
Based upon the features we've identified along with determining why and how our users might be interacting with our proposal we started to wireframe potential layouts that could incorporate the features we wanted. We also began to sketch out preliminary user flow diagrams to see how users would navigate through various screens and perform tasks.
Sketches based on required features
We started to then put together a few wireframes depicting possible layouts and where key information could be displayed. Once we had a better idea of our user flow it allowed for us to refine our wireframes with proper navigation and menus. It also allowed us to link our wireframes together to see how a user would navigate through the different screens.
Refined Wireframes with user flow
Having refined wireframes helped us determine whether our preliminary user flow made sense, especially when it came to how users would go from one screen to another without having to "backtrack" to return to a main screen. We wanted to ensure the main features of the app could be accessed without having to click "back" or have to dig through any complicated menus. This ultimately led to our final user flow as shown below.
Refined Wireframes with user flow
Although our design process was not always linear after wireframes we moved onto working on visual design and interactions simultaneously. As group members were working to their strengths I provided a support position in the design of interactions that would not only improve user experience but also included aspects which encouraged and assisted with getting members to purchase experiences and upgrade their membership to the next level. Here are a few of the interactions below.
Browsing for an experience
We enhance the browsing experience in two ways. First is showing experiences that the user is looking for by organizing available experiences in simple yet distinct ways and second is minimizing distractions by automatically shrinking the header/title bar when the user scrolls through a page.
Discovery allows users to find what interests them. There are three panels for conducting a search which can be accessed through swiping to the left and right of the screen. The "For You" page utilizes data from American Express' closed-loop network to provide recommended experiences based on the members' spending habits and past purchases.
Viewing an Experience
Before committing to a purchase, users may want to read more about the experience so the buy button becomes stickied to the top when the user scrolls past it to find more information. This allows them to make a purchase at anytime without having to scroll back to the top. As a way to entice membership upgrades, the experience details passes available based on card levels should a member choose to upgrade their membership with American Express in order to obtain an even higher tiered experience.
We also decided to emphasize on large sized photos that are easily switchable allowing the user to get a good sense of what the experience is like and provides.
Purchasing an Experience
Since buying an experience is an important aspect we wanted to make this process as simple as possible by utilizing the very basic tap interaction throughout the process. The experience name and location comes along as the user taps the buying button to reassure the user they are purchasing the correct experience.
After purchasing the experience we hope to delight the user by reassuring their purchase is now safe in "My Events". The animation which shows the actual confirmation going into My Events allows the user to know where to look for the ticket they had just purchased.
Using an Experience & Enticing Upgrades
When the user is ready to use their purchased experience, they are able to view and open the ticket right from the app. We wanted to make the experience seemingly tangible by animating the ticket folding down to show you its details.
As another way to entice membership upgrades, when a user browses through a category and the listings of available experiences runs out, the user is allowed a sneak peek into what a higher tiered membership offers.