One of the most common feature requests for Money Button from businesses is the ability to customize the appearance of the button. To satisfy these requests and more, we are happy to announce the immediate availability of Invisible Money Button (IMB), an API for developers to request permission to swipe automatically on behalf of users from within web apps.
What is Invisible Money Button?
Some companies want the ability to change the color of Money Button or to customize it in other ways. But the button has gone through extensive user testing and we are convinced the button is a very good solution for payments in the general case. Thus, we do not want apps to modify its appearance or behavior.
But the swipe action of the button is not appropriate for all apps. Especially for any app where payments need to be made automatically, such as for uploading large files, or for social apps, where many micropayments are made in a short period of time.
Thus, rather than allow apps to customize the appearance of the button, we have created a complete API to allow apps to swipe on the user’s behalf after requesting and being granted permission by the user to do so. This is a much better solution and is far more powerful than customization of the button’s appearance or behavior.
With Invisible Money Button, the button itself keeps its ideal user-experience, while enabling Money Button apps to have complete control over their user-experience in a manner appropriate for their use-case and company brand style.
The Invisible Money Button API
The Invisible Money Button is very easy for developers. Instead of calling the
render() method on a
div, you create a new invisible button and then call the
swipe() method. If the user has not yet given permission, then they will be requested to do so before the swipe will succeed.
The configuration passed into
swipe(config) is exactly the same as the configuration passed into
render(config), making it easy for developers to add support for IMB. All features supported by Money Button are also supported by IMB, such as writing data to the blockchain, crypto operations, and smart contracts.
Here is an example of what it looks like to use an Invisible Money Button:
Every time the
swipe() action is called, the amount of money being spent is matched against the amount of money the user has granted for the app. If the spent amount surpasses the amount the user has granted, the user is asked to grant permission again.
The app can suggest a value for the user to grant permission to the app. However, the user always has full control over the amount of money they grant to the app. The user can edit the value and choose any amount when granting permission. The user can edit this amount at any time on their settings page, and they can delete permission at any time after they have granted it.
IMB is not just about spending money. The full Money Button API is accessible, enabling scripts and crypto operations. Apps can automatically submit complex scripts to the blockchain, sign on behalf of the user, and encrypt and decrypt data.
Another important thing is that IMB was designed considering modern web practices. That’s why the interface is based on promises. You can completely replace the classic callbacks with promise handling.
Also, properties that affect the visual appearance of the button, such as “label”, do not have any effect inside IMB. For full details about the Invisible Money Button API, please refer to the documentation.
How Invisible Money Button works
Money Button is a fully non-custodial wallet, which means the users have their keys. The keys are encrypted client-side with a hash of the user’s password and are backed up to our server. The user’s password is hashed in a different way for logging in, meaning our company does not have access to the users’ funds.
When a button is displayed on a web page, the button is actually an iframe, and the keys are contained inside. The swipe action builds and signs a transaction or performs other cryptographic operations using the keys. The keys are never exposed to the containing app because the app cannot access the information inside the iframe. The iframe is a secure container for the user’s keys.
We designed Money Button to be non-custodial to create maximum security and flexibility for our wallet infrastructure. However, the non-custodial nature of the wallet presents a challenge for automatic payments. If the user has the keys, how can payments be made without the user swiping the button?
The way Invisible Money Button works is that there is indeed literally an invisible Money Button – an iframe – contained inside the app that that is messaged when the app calls the
This presents a security issue. We can’t give every app access to swipe on behalf of every user, or malicious apps would steal funds. Thus, we have designed a permissions system such that when the
swipe() action is called by the app for the first time, the user must grant permission to allow that app.
The permissions system works similarly to permissions systems in modern operating systems like iOS an Android that ask the user if they agree to grant permission to the app.
The permissions system gives users full control over the permissions they grant to apps. Users can accept or deny permission requests, and they can even modify the permissions. If the app requests permission to spend $10, but the user is uncomfortable giving permission for that amount, they can lower it to $5 or to any other value. They may also increase the value if they wish. In order to give clear information to the user, values are always denominated in the their preferred currency.
If the user changes their mind about the permissions for an app at a later date, they can access the full list of permissions they have granted in the “Permissions” section of their settings page where they can change or delete permissions at any time.
The user always has the final say over how their wallet is used.
The permissions dialog uses an iframe, similar to Money Button itself, and permissions can only be granted within that iframe to ensure the user is correctly informed about what permissions they are granting to what app before agreeing to anything.
Note that because Invisible Money Button relies on an iframe in order to hold the user’s keys, it is not possible to send money on behalf of a user if they are not online. The user must have the app visible on the screen for the API to be accessible. If the app is not open, then there is no Invisible Money Button, and the app cannot swipe on the user’s behalf. Swipes can only be made while the user is engaged with the app.
Use-cases for Invisible Money Button
The full API for Money Button is available inside Invisible Money Button. This means not only can apps create payments on behalf of the user, but they can also access OP_RETURN data, multiple outputs, scripts, signatures, and encryption and decryption.
This makes a wide variety of applications possible and user-friendly. Social media, messaging, data management, and gaming apps can all benefit from Invisible Money Button.
Chat apps can allow the user to tap ‘send’ or press ‘enter’ to submit a transaction to the blockchain containing a message. The messages can be encrypted automatically if desired to a particular recipient or group of recipients and can be decrypted automatically by the recipient(s) when received.
Like buttons, retweet buttons, and post buttons can all be created so that the user does not need to swipe when making payments, writing content, or engaging with the app in other ways.
Newspapers or other digital media websites can integrate IMB so that the user can press a button, turn a page, or scroll to make payments for content.
Games can initiate actions with screen taps or mouse clicks or even initiate actions automatically such as with timers or in response to actions from other players.
Arbitrarily large files can be uploaded automatically by generating large numbers of transactions such as with the bcat protocol. Data can be encrypted for oneself or for other individuals or groups.
Building an app that uses Invisible Money Button comes with a lot of responsibility. The user is trusting that you will do the right thing with the permission they are granting to you. Here are some best practices to make sure the user is always satisfied with the experience.
- Inform the user why you need to spend money or perform other actions on their behalf before requesting permission so that they are not surprised to see the permissions dialog.
- Inform the user about the way in which you will be spending money, signing data, or encrypting and decrypting data so that they are not surprised by any of the behavior of your app.
- Swipes do not occur instantly due to the time it takes to build, sign, and broadcast transactions or to perform other cryptographic operations. Invisible Money Button provides a natural promise based API, that allows to easily handle all the asynchronous events in a smooth way. That includes showing waiting feedback like spinners and show success feedback only when the swipe succeeds, but in other case show an appropriate error. If you were already using the classic Money Button widget, you can even plug your configuration and use
onErrorto keep using the same logic you already had.
- IMB is asynchronous, so if you issue two swipes at the same moment, one may fail due to the inability to use the same UTXOs. You can work around this by queuing your swipes such that each swipe waits for the previous swipe to finish.
- IMB does not lock funds and does not guarantee the user has the entire expected balance. You may encounter a ‘low balance’ error. Other errors may occur as well, such as ‘too long mempool’. Be sure to handle errors.
Get help building apps
Bitcoin works because businesses build complementary infrastructure that fits together. Bitcoin is decentralized not because everyone does the same thing, but because everyone does something special to help others.
At Money Button, we work hard building wallet infrastructure for other businesses. We make the button. You make the apps. We work together. We want to do everything we can to help make your business successful.
To get help building applications with Money Button, we encourage developers to join our development group on Telegram. Or, if you would like to ask us for help directly, please send your question to firstname.lastname@example.org.
If you are a business looking for partnership opportunities, please contact email@example.com.
Thank you for building your app with Money Button ❤️