A SIMPLER CHECKOUT EXPERIENCE.
We are in the middle of a consumer revolution, and it’s changing the way we engage, interact, and communicate with payers. They want things easy, straightforward, and clear. On top of this, payers are growing increasingly comfortable and willing to share their experiences (both positive and negative) with the world (or at least their friends) through social media. As such, it is important that companies focused on ecommerce take a payer-centric approach to product development to ensure their payers are able to accomplish their desired goals quickly and easily. That is exactly what Cashnet has set out to do—turn its eMarket payer-facing checkout process into a dynamic and seamless experience. (In this eMarket version we are focusing on streamlining the eMarket Checkout payer-facing screens. The changes to the eMarket Storefront payer-facing screens will follow, and we will be announcing those soon.)
The product team at Cashnet relies heavily on feedback to ensure the right projects are prioritized, and it was unanimous that the eMarket payer-facing checkout process was much more “busy” than it needed to be. Enter Kristie Meyer, the Senior UI/UX Designer. Given all Kristie’s years at Cashnet and her expertise in UI/UX design, she was tasked for revamping this checkout experience from head to toe.
In our last UI/UX blog post, “A Marriage of Function and Form,” Kristie explained how she completely revised the eMarket store setup experience, streamlining pages, and reconfiguring to make it easier for administrative users. It will be available to campuses with the updated system release this summer.
“We needed to make this change [to the eMarket payer-facing checkout screens],” said Kristie Meyer, adding that Cashnet’s old flow is a little outdated and does not reflect some of the latest advancements which remove friction for payers. Kristie feels that it is vital for Cashnet to leverage experience from more than a decade of ecommerce evolution to gain all the important insight to get to where it is today. The goal of this new, streamlined, sleek experience is to provide the payer with more information during the checkout process while reducing the number of steps needed to complete the payment.
Use past experiences then deliver.
There’s no doubt Kristie has a love of purposeful design. It’s what makes her such a unique fit to oversee the changes and develop a more useful configuration. Her approach was holistic across the board applying the same set of Design Principles to this payer-facing checkout phase of the UI/UX changes. She also performed the same successful information-gathering exercise to research the best way to present a streamlined checkout for payers. Don Smith, VP of Payments Product Management, got his team to investigate the marketplace. “We went shopping so we could take a look at all the high-volume ecommerce experiences out there. We took note of common features and characteristics of the best to pull together the elements we felt would be most beneficial to our payers in the context of making payments to colleges and universities.”
Kristie was able to recommend a more streamlined concept. “With the old eMarket Checkout user experience, it was possible that the payer click through up to 10 pages to complete a payment,” said Kristie. “In the new design, I proposed reducing the number of pages to a maximum of 4.” She then put together wireframes and spoke with a strategic UI/UX consultant design firm out of the Bay area.
An intuitive experience.
The idea: Reduce the number of pages required to complete a payment and give users a clear picture of exactly where they are in the checkout process. The result: Seven of the checkout pages have been consolidated into one and a progress bar has been added that highlights where the user is in the checkout process.
“Payers will see their status in the progress bar and what is in their shopping cart at all times,” explained Kristie, adding that it’s one of the largest improvements of the site. “We’ve combined all of the checkout pages after the recent payment warning page into one page, which greatly streamlines things for the payer.”
“Kristie and the team have done an outstanding job. The new eMarket Checkout flow now reflects characteristics of a modern checkout ecommerce experience for the payer,” said Don. “It is an important and exciting step for us as we continue to work hard to improve the way payers use our product.”
Kristie is always on the lookout for faster and more efficient ways to make the checkout experience simpler and more powerful. “We want payers to have a positive experience,” said Kristie. “Changing the checkout flow really sets the stage and puts the payer in the position to easily make the payment.” And that’s what it’s all about: a better customer experience.
The Cashnet Customer
The customer experience can be defined as the sum of all interactions a company has with its customer. From the moment the customer enters the site to purchase completion, the goal was to:
Reduce barriers of conversion
Accomplished through less steps.
Accomplished through the progress bar.
Ease the journey
Accomplished by knowing at all times what is in the order cart.
Use features that take the user through the experience
Accomplished through the progress bar so buyers know exactly where they are in the buying process.