Gravity Payments prepares a new service for partner integration — API-driven text-to-pay contactless payments. Allowing merchants to deliver a seamless payment experience for their customers onsite, in the car, or at home.
Due to many factors, and hastened by the events of 2020, the payment market is moving fast to more contactless payments. Some of the most familiar methods include RFID technology and Digital Wallets using mobile terminals like the Clover Flex that Gravity Payments offers. Text-to-pay is also a popular method desired in automotive, healthcare, veterinary, and service-oriented businesses.
Competitors like autotext.me, SwipeSimple, and Weave offer text-to-pay solutions which put Gravity at a disadvantage in the market.
Partners integrate our Text-to-Pay API into their software, website, or POS. The API initiates an SMS message with a link to a payment page hosted by Gravity Payments. Merchants who use Text-to-Pay can upload a logo and set business-specific information in our customer Dashboard.
Text-to-Pay launched in June 2021. The team worked to complete the MVP with an expected completion of June 2021.
Text-to-Pay launched in June 2021. Though I left Gravity before the final launch and could not finalize quantitative measurements, we saw very positive qualitative reviews.
Discovery discussions were held with prospective and confirmed partners that will integrate Text-to-Pay, such as Hippo, Vet2Pet, and Instinct Science. During these sessions, the partners gave us great insight into their business needs and the potential merchants and customer users essential to the experience.
The main benefits they are looking for are convenience, efficiency, easy API, better experience, and security. Text-to-Pay will be the middleware between the partner's software and the user making the payment. Credit Sale transaction type will be the main feature of MVP, however, more payment types may be explored in the future.
Initially, my Product Manager did not see the value of further discovery. I was able to impart the importance of not skipping valuable exploration steps. I successfully conducted 3 mini-workshops: Competitive Review & Heuristic Audit, Personas, and Initial User Flow.
As an API-driven service, our users are POS software developers, merchants, and paying customers. Our focus is on the paying customer up-leveling their experience and ease of payment. Our first integration partners are in the Veterinary space. I defined 3 personas:
As part of gaining empathy for the users and understanding the story, I used Miro to create a quick storyboard. Miro's iPad app has simple sketching tools that kept me from trying to make it look pretty and spend the time delivering a story. The heroes of the story are our identified personas that use VetOfficeManager (not real) software.
One of my favorite methods is combining the user flow with a quick wireframe. Especially when the user flow is short and the project has a lean timeline. When I presented the wireflow to stakeholders and the dev team, I was able to iterate fast using my wireframe components and made remote collaboration a breeze. During this remote collaboration, we were able to identify, as a team, obstacles we would face at implementation and patterns that may slow the user.
There were 2 flows established for our user groups: Text-to-Pay and Dashboard set-up.
There was no need to develop a new design system or pattern library. Using the proven components and styles from our core system saved time in design and development. The UI design was intentionally simple. The payment page contains the merchant logo so the UI should not distract from the merchants' existing visual standards. Plans are in the roadmap to include further customizations by the merchant.
With a tight timeline and simple design, I wanted the testing to be as short and as effective as possible. Using Figma prototypes I engaged our Customer Support, Developers, Product Manager, and random family/friends. There were no big surprises from the testing. The most valuable learning was validating the iterations made during the wireflow work. The testing revealed the importance of having development involved early during the design process.
As part of the handoff process, I gather all the screens into a UI flow. This helps direct the developer to the UI element they are working on. I've created a custom arrow & flow component library that can make this process very fast. This method is more effective than delivering a prototype to developers. Within the flow, I annotate screen elements with interaction samples, animation timing, and alternate states. Using Figma's inspect mode eliminates the need to go into deep redline details.
I hate the description "Unicorn" to describe a designer that codes. I work directly with the backend developers to deliver the HTML structure and CSS style framework. The experience I've gained through my career and the many hats I've worn make me a versatile member of an agile team.
