After the launch of eazyX (Beta on Rinkeby testnet) last month, we thought of taking it one step further. Why limit our users to a desktop version? Why not provide the fair price mechanism also on mobile? Again, we put our focus on easy usability in order to address casual users without crypto expertise and tried to build the product as clean and lucid as possible. Let me walk you through the interface and summarize briefly our main design decisions.
Most of the design principles for eazyX mobile are the same as for eazyX desktop and have been discussed in this previous article. We also shared some of our observations in this talk at this year’s Dappcon in Berlin. However, a new platform brings new design challenges. Some were obvious: smaller screen size; cross-platform operability; different usage habits.
EazyX — cross-platform dApp UX
If you look at the screens you will immediately see a resemblance to the web version. The colours are the same, colour contrast is retained and minimal shadows are displayed.
In order to retain the user flow though, we had to get a bit creative. For example, the on-boarding process is quite different for both versions. For web, you log in with your Metamask account and you can also change your wallet in the Metamask plugin. Whereas, for the mobile app, we could not rely on third party services (as plugin) for signing. Instead, we integrated a wallet within the app.
Simple. Transparent. Eazy.
You can start using the app without doing anything and a new wallet is created. At the same time, you can use your existing wallet by signing with your unique mnemonic.
Thanks to this wallet-within-app, we can now sign transactions on behalf of the users. So, NO METAMASK POPUPS. We have been able to get rid of metamask popups entirely. From four to Z-E-R-O. This makes everything easy and smooth for the user, but at the same time we face a dilemma of not being transparent. Hence, we have loading screens clearly describing what’s actually happening with your tokens.
Another challenge we faced was to show transactions on a smaller mobile screen. The same applies to other informative screens that could not be shown at once. So we made a conscious decision to keep some information only on web.
The mobile version is designed to be quick and easy, and that’s exactly what it does. As an example, the withdraw screen has been reduced from a long table to a slim listview with only displaying necessary information combined with a quick withdraw button.
As the screens get less wide, the length of continuous displayed text decreases. But as it goes in crypto, token amounts can be over 18 digits, plus a decimal. These can be shown straight-up in large screen phones. But when tested on smaller phones, we had to put ellipsis (…). Looking for the most elegant solution, we made the assumption that people don’t want to trade in amounts less than 1/10th of a USD cent. Based on that we are now using some mathematics to calculate the round figure of your token in USD up to $0.001 and subsequently convert that to token value. If that value comes up to be zero or negligible, we add another decimal point. This not only makes it look more pretty but also a lot more usable.
Enough of that. If you haven’t tried eazyX yet — try the desktop version here (Rinkeby testnet).
We will soon be launching it in Android Play Store for beta users. Here’s a first preview:
To let me know what you think of all this, tweet to us or join the discussion and give us feedback, on eazyX Telegram. We will be inviting users to do a beta testing of the app, keep an eye out for that.