 Rwy'n cefnodd challwch chi'n gwirionedd â'r hamlion Ond baig yn unig, mae yr hyn yn Mike Rwy'n ymgyrch yn ddechrau Gwbel yma Ac mae'n gweithio i ddefnyddiadu gwirionedd a oeddiadu'r ddechrau gwirionedd Dyna, ond dyna, unig ymgyrch yn ddechrau gwirionedd Ond yna hi aim yn ardal, dyna'r ddysgu wedi cyhoeddi'r cyffordd Cod yw'r hanfpr Blackstone, mae hyn yn ei fodlen fel y ddechrau Fyrdd yw'r cyfforddio i'n gweithio i ddechrau'r ddysgu Arfermysgfaen i gael y gwaith cyfaelio'n roedlillaeth, iddyn nhw'n gynghwil o gweld gwlad yn ddim yn hun, rydyn nhw'n tynnu'n gyffrpreid yn bryd, yw oeddi'r cyfrifwyr wrth gwrs, ac i'n fydd hips i'r reilio roedd. Byddwn i'n gweliannod o gwybod adrodd y cyreithio, rydym yn archwilio gynradd o'i meddwl ac yn cael meddwl yn yma rydyn ni'n gweithio. Wel, mae'n gweithio ar y cyfraffid o'r gwaith o'r gwaith o flynydiad ymwneud tariadau trafodaeth, gyda dwi'n gynhwys a ffych yn ymdwynt i'r aelod yn grafod ychydig mewn gwahanol. Rwy'n dweud yna'n dysgu am y cymdeithasol i lefydd a lŷ ymwneud, o bobl o'r gweithfodol â'r gweithfodol, o partynau yw'n gwybod yn cael ei sefydlwyr a'r gweld fod yn ei wneud yn ysgolwyr o ffrygo. Mae eistedd yn gweithio i'r gweld yn rwynd i dda i'r gwir o maen daeth i ddangosion. a ddŵr yn ddŵr dŵr, a dŵr yn ddŵr Ith yn rhoi'r dŵr. Mae'r Dŵr yn dŵr i'r dŵr yn dŵr yma. Felly, ydw'n ddŵr yng Nghymru yn dŵr, ac efo'r dŵr i'r dŵr yn dŵr, i'r meddwl yng Nghymru yn dŵr, i'r dŵr i'r defnyddio rŵm o'r dŵr, a i'r dŵr i'r dŵr i'r dŵr. Yn y dŵr, y dŵr i'r dŵr yn dŵr, Is cyfnodd ar gyfer eu hoseyn, ei chysylltu, ym mhag y cyfnodd ffans. Dwy wneud ychydig yw sut yw'r gweithio neu yw'r holl ychydig yma o'r gŵr. Y mhag ychydig yw hwyl yn i gweithio i'ch bwysig. I gael ei pwysig, ac dyno'n gweithio ar gyfer y gweithio o gyfnodd, mae'n mynd i gwybod amdannu wedi'u wneud gan gynnwys o'r gweithio gweithio. Mae gweithio argoffyddion sy'n gymryd. Mae'n gael i anodd o edgesau weianid? Fe dlitai i gael hunain ar gyfer o'r ddaeth i'w cwm unexpwni efallai. Dwi am yr anodd blaeniau a roedd yr anodd? A roedd i ni'n dda siaradau? Rwy'n glwch yn ymddech chi a'r anodd? Dwi'n dda siaradau o'r anodd a sydd cyd-dweithionau'n gweithredu? Roedd y newydd ychydig ar gyfer â chwrgylad? Roedd yna yng nghymru i'r anodd? Rwy'n cael ei bod, mae'r anodd hyn yn ymddy. So, dwi'n fath o'r amser, oedd yng Nghymru, yn ysbryd hynny, mewn ddweud hynny. Felly bydd ymddangos y cwlch gweithio cyfnodol, am ydych chi'n mynd i ddweud. Felly byddwn yn ymddangos gyda'r rhaglenu, gwybod yn ymwneud y ffermau Cymru, ac mae'r rhaglenu eich cyfrifau sydd yn dweud hynny. Rwy'n ei wneud ymddangos eich hyffordd, ymddangos'i ddylemiadau. Mae'r ddylemiadau'r ddylemiadau around the notion of education, so this dilemma of do users know what they're doing, and if they don't know what they're doing, are they incentivised sufficiently to go and sort of educate themselves and make their best effort at it. So that's some of the main problems, and we completely understand why this is such a big issue and such a pain point. But I think it's important to also talk about the opportunities for sort of spending more time on designing transaction states, and hopefully this will convince any teams out there to maybe sort of pick this up as a priority after they leave a sucker. So first up, we're going to talk a little bit about some of the behavioural science sort of justification for doing some of this. So first up is the halo effect. So that's if it's horribly complicated to sell up an account for a service, and that bad user experience will rub off on people's expectations for the rest of the service. Now this quite references account creation, but you can certainly sub in transactions and still have the exact same meaning. So if your user is exposed to some really bad copy like this, for example, it doesn't really explain what to do, what you need to unlock a token to sell it, have this sort of quite confusing approval function in the wallet. It's going to create a bad experience even if, you know, your dad has the coolest tech out there, if it has the smoothest connecting, connecting the wallet experience. I think a great analogy for this is the Kingdom of the Crystal Skull movie, which one bad movie has tarnished the reputation of an entire franchise. The peak end rule is very similar, so this is a cognitive bias that impacts how people remember past events. So these intense positive or negative moments, eating the peaks, and the final moments of the experience at the end are heavy-weighted in our mental calculus. Transactions are doubly important here. They quite often represent the sort of end part of an experience with a DAP. And again, they also have a very high likelihood of being either an intense positive or intense negative experience. So again, this could really sort of, again, if you have the nicest DAP leading up to the transaction, then it's going to really impact the sort of how a user remembers your DAP, and array that sort of trust that you might have fostered up until that point. I'm going to show you on this movie again, but that fridge theme coming at the end of the, what, that movie coming into the franchise has certainly tarnished that for me. Okay, nearly done. Right. Users don't even trust work 2 either. So, in a study conducted by Baymard Institute in 2018 for Anasem, they found that 28% of users abandoned their task because of complicated checkout lists. Now, that study also found that the main reasons for that abandonment was an overuse of jargon and lack of visual design. And I think at the moment, obviously in this experimental phase of Ethereum and DAPs, this is quite often the case in web-free applications as well. So, again, a really good opportunity to sort of spend some more time thinking about the design of transactions and make that reduce that abandonment and increase that trust in your DAP. So, we've spoken about some of the problems and talked about some of the opportunities. We're going to show you a quick demo in a minute. This has sort of come out of the sort of research and the design inspiration I mentioned earlier. We spent the last two months speaking to some savvy blockchain users, not so savvy, to try and understand what a bit of that secret source to transaction UX might be. Just to caveat slightly, we focus mainly on DAPs that might be trying to appeal to a more mainstream audience and trying to reach that sort of outside of this bubble that we're operating. So, the demo is for potentially a DEF CON application where you might be able to purchase your tickets as NFTs. So, Mike's going to talk us through that. So, like Grant said, we build a lot of demos for user testing. For this one, we're using Open Zeppelin's ERC721 contracts. We're using Truffle for the contract management and deployment. And then, on the client side, we're using Drizzle to keep the blockchain data and sync the client side. And we're using our own component system, Rimboli by, and some of my three components that we built just to keep things easy and fast for us to build. And then we're extending Drizzle with third party data that comes from just regular API services. We're using ETH gas stations API to get a gas estimate that we can use to calculate a transaction fee and an estimated wait time based on just like what the average price of gas is going to be right now. So, we're using those two kind of key important pieces of information on the UI here. The transaction fee is what we're calling it instead of talking about gas. And we're estimating that just based on like what method the contract's calling and the average price of gas at the time. And then same for the estimated wait time, we can just kind of see how long transactions are taking at a set gas price. And we're just assuming things and we're just kind of guessing for the most part. Obviously, users can change how much gas you're paying for transaction, but just giving that expectation up front is really helpful. So, walking through like a quick diagram also like another technique that we're using here, which is like trying to keep web free away from the user as long as possible. We don't want to hit somebody right off the bat with a connect dialogue or we don't want to minimize functionality of the data until like they've done some sort of proof that they are on chain or they're connected to blockchain. Once the user has expressed an intention, that's when we start doing our pre-flight checks for making sure they're like a modern browser that they have a connected wallet that they're on the right network. Once we're sure like those things are good, we can check their balance, we can run a simulation on the call that they're doing to get that transaction fee. Then we can check their balance and make sure that they're going to have enough money for what they're trying to buy and the transaction fee. Then we can give them steps right there to prevent them from even starting a transaction that we know is not going to work. Once we have all that, we'll give them not relying on the wallet UX is also like something that we're big believers in. So, we want to show the user before or right at the time of the transaction as much of that information as possible. So, once we've given all that data over to the user, they can make the informed decision to be confident that what they're doing is actually going to work and it's going to work the way that they expect it to. Then they have an idea of how long it's going to take. So, we'll just go through the end and it's basically like they'll get errors along the way if there's any problems that will help with the remedy. Then we can finish it up with a summary of the transaction details that tell them exactly how much it costs and where they can get more information either to either scan or open C or something like that. Thanks. So, I'm going to dive a little bit deeper into some of the more actionable tips that came out of this research in this demo. So, I think the first lesson that we came up with was to not rely too much on wallet UX. A lot of dapps out there sort of think, oh, we know the wallet can handle the transaction. We just need to get the user up to that point. The issue here is that wallets can't be specific. They're naturally designed for lots of different use cases. Within the dapp itself, you can talk much more clearly about the task at hand that the user is trying to achieve. We should help reduce the sort of cognitive load on the user. So, for example, we talked about the fact that once the transaction started, it's the process of the ticket being sent rather than just a sort of generic transaction depending or in progress. This is specifically important for error messages. You might be familiar with seeing sort of just generic insufficient balance messages in some of the wallets you might use. This doesn't really help new users or less confident users actually get back on track of what they're trying to do. That assumes a lot of pre-existing knowledge which not all users are going to have. So, again, within your dapp, you need to make that effort in order to help users get past this obstacle and talk again in context of what the user is trying to do. So, you're not having enough transaction fees in order to pay for your ticket in this instance. The second lesson is around prevention. So, we spoke previously about the irreversibility of blockchain transactions. So, it's super important to be sort of anticipating and designing for these sort of end-user errors that might occur. So, that could be like passive UIs such as the indications in the top right corner about the wallet the user is using, what their balance is so they don't try and transact with an empty wallet. But it also might be, you know, actually intentionally designing some friction into this process. So, it's weird to say this because we're quite often told to be reducing friction, reducing clicks, reducing the nature of irreversibility. We felt it was important to give the user this final opportunity to double check everything written in a language that they understand compared to a wallet which would be more technical and less specific to what they're doing. And we actually feel this is like a super important way that a user can check everything's correct and make it 100% confident transacting. Thirdly is to set user expectations. So, I guess the main places you want to set expectations here are around fees and time. So, again, on this sort of checkout screen, we reference the transaction fee and the time. I think it's important to reference the fee before the wallet. Again, this prevents it from feeling a bit like a hidden fee which might end up eroding trust in your dam. I think a lot of the users we spoke to didn't have really great knowledge of what the transaction fee was. So, again, it gives you an opportunity to sort of give that sort of explanation for users that don't understand. There seems to be quite a general misconception that transaction fees go to the DAP teams themselves and set for the network, which obviously isn't going to help their understanding of what's going on. Also, the estimated wait time. So, Mike explained how we sort of go about providing that to the viewer. I think that's really important, but although users may not mind the wait, they don't like being left in the limbo without not sure how long it's going to take. So, I think it's really important to provide this information up front so they can better plan what they might want to do next, whether that's going off to complete some of the tasks or sit and wait and watch the transaction go through. The most important thing we want to do is give us a ballpark figure at least, so that instead of just a sort of static message or like a spin-up, as we've heard that some users felt or thought that I meant their transaction may be timed out, that's obviously a result in the user trying to initiate the transaction again, which we also don't want to do for what to happen, because that will incur another transaction fee cost or an error. Lesson four is to provide just enough feedback, and I think that the message here mainly is just because you can get that information from the blockchain, just because you can sort of poll and find out in the transactions in the mem pool and to be in mind that doesn't mean that user wants to know that or at least doesn't mean that user doesn't want to know that in that way. So if we liken this experience that we've demoed to like if you've purchased a movie on Amazon or something, you purchase it, it gets downloaded from the cloud into your device. Now you don't get a play by play of exactly where that content is in the journey that it takes down to your device, and that's because the user just wants to know, okay, has that process started? Is it happening as expected and when it's finished essentially? And we found that a lot of users that we sort of put this in front of didn't sit and watch the transactions go through anyway, so it's kind of redundant to waste time crafting those messages about when the transaction is left to the mem pool, et cetera, et cetera. Finally, designed for the next step. So we talk a lot in Word 2 about a post-purchase experience. That's not as applicable in Word 3 necessarily, where we have less moxing channels where you might have success confirmation emails. So I think the transaction success message is a really good opportunity to do that. And in order to design a successful post-purchase experience, you really need to know what the actual end goal that the user has. So, for example, in our demo, the end goal wasn't to just complete that transaction. The end goal was to go to the conference. So this message is crafted in a way that it explains to the user what they need to do, once the ticket has met their wallet. It also anticipates that the user may have been blinded to get on behalf of a friend or colleague. So again, you give this springboard button at the bottom here, which is like, give your ticket. So you're anticipating what the user might want to do next and helping them achieve that problem. Again, assuming that you have the knowledge to be able to go into their wallet, send the NFT to a friend or colleague. I think this is a really good opportunity to support the ecosystem more widely. A lot of DAPs out there help interoperability in mind. So, for example, if you're a DAP about a user to generate a die, for example, let's not just have a message that says, great, you've got your die. Why don't we say, great, you've got your die. Go there and interest on that compound. There's a really good opportunity to cross-pollinate, I guess, users between the DAPs out there that we're all working towards a similar vision there. I'm just going to hand back over to Mike. I'm just going to say... I can't believe you saw my desktop problem. I'm so embarrassed. So, a lot of this doesn't sound too novel. It might all sound quite familiar, and I think that's the case. We don't necessarily need to be reinventing the design of the UX wheel for Web3. I think we might just need a bit of a collective nudge to sort of remember some of the lessons we already familiar with Web2. So, I'm just going to hand over to Mike to talk a bit about what some more technological advancements in space currently might mean for transaction UX. So, we went through traditional transactions, and all that being said, it's great that we have time and energy to figure this stuff out, but honestly, if you can get away with not dealing with these problems, that's the best design solution. So, if you can abstract gas away, if you can get rid of transaction fees, if you can make transactions happen faster, and that's within your capabilities, absolutely do that. So, metatransactions is one example where you can just pay the gas on behalf of your users, something like the gas station network, or the metatransaction relay that lets you pay if your users' gas would get rid of one of the problems and friction points. Layer 2 solutions, sidechains, child plasma chains like Bloom and POA, they're great, they're fast, they have really, really basically free transaction fees. So, again, you're not having to even deal with the whole transaction issue. Design with the developers from the very beginning, so when you're architecting your smart contracts, use a proxy pattern that lets you chain multiple steps together into a single transaction for the end user. There's future things coming, state channels, ZK starts that will also let you do things off-chain. If you have the ability and the time and the skill to get rid of transactions from even happening, that's the best way to deal with transactions. But that doesn't necessarily mean that our advice belongs in the museum. So, just to recap, because I think the overarching heuristics and the sort of foundation behind all these advice is still very much, still very much applies, and that's to always communicate with context, be specific about what the user's doing, the tasks that they're trying to achieve. Plan for errors, anticipate errors, design error states, help users out of the jam, don't just tell them what's happening. Set the user expectations, so always try and keep them in the loop, make sure that they're aware of any sort of nasty or potentially nasty surprises, such as fees or long wait times. Provide just enough information, just because you can provide the content doesn't mean that you should try and think about the actual information the user needs at the time in order to progress through whatever journey of what you're designing. And remember next steps, try and avoid dead ends. We don't want the user to be sort of, very well, but I'm lost, I don't know what to do next. So, consider next steps whenever you're designing a flow, there's probably another step up to this. And that's it again. I think you have a chest in finding more about Rimbol, scan the QR code, there's our Twitter. Thank you.