Redesign: Mobile Payments for the enterprise
About the project
Blackthorn wanted to have a unique solution to pay with mobile using a card reader in Salesforce environment. My responsibility were creating a research and UX/UI design.
There are many solutions to pay with your mobile and using a card reader like Square, PayPal, Shopify…etc. But they use their own solutions and own softwares and hardwares as well. The company didn’t want to create a special card reader for this app so they’ve found a cheap but working tool for this. I took a research and I analyzed Square and Shopify apps. I wanted to know what kind of functions they have and actually how those apps are working. Basically it’s a simple flow so I didn’t have to take long time to find it out.
Because the company uses Angular Material framework to build their applications, I had to use Google’s Material Design Library to get the UI design done based on the components what MD contains. The company wanted to get this app done as soon as possible so I focused on this expectation.
The core functions
- Log in with your salesforce account
- Direct payments within the app
- Enter the description, amount, currency, and process
After taking the payment, pass the device to your customer to enter their email to send a receipt. The Transaction will be in your Stripe dashboard and in Salesforce.
Redesign
After the basic version has published, I wanted to make it more lovable and a bit playful. This time I left Material Design behind in order to have a bit more lovable UI Design for this app. It’s always hard to make an app more interesting which mainly contains inputs and controls only. It was a challenge but I thought it would be a good way to create small and informative but not too highlighted illustrations, unique icons and cute animations on those screens where it’s needed and avoiding to distract the focus. On the website, I use different logos and colors for each product. The payments’ logo colors are magenta and pink, and it has other brand elements as well so I decided I will use them.
Highlights
Streamlined process
Start from Salesforce Mobile or Field Service Mobile. One tap opens our iOS-native app and prefills the data. Connect the reader automatically, process your payment, and tap back to your app. Salesforce sessions are maintained.
Payment methods
EMV-certified card-present payments for reduced processing fees; and ACH, cash and check logging. Swipe, dip (EMV/chip), and NFC (Apple pay, Google pay, card tap) supported.
PCI Compliant
Stay PCI compliant, tokenizing through Stripe. No sensitive card data is stored outside of Stripe. Your database will not be liable for card or CVV numbers when processing through our mobile app or Terminal.
