UI/UX challenges of Web3 and Dapps

With the next generation of the web (Web3) we observe a progressive transition of traditional centralized web apps to decentralized apps (Dapps). They can natively interact with blockchain technologies and unlock endless new ideas and innovation. Interacting with Dapps today can often lead to uncertain and frightening actions which lead to frustration and skepticism. We’ll deep-dive into Web3 and Dapps fundamentals and how we got there, clear up confusions and explore how we can improve user experiences to help bringing Dapps closer to people.

Transcript

1. Glenn Reyes @glnnrys UI/UX challenges of 
 Web3 and Dapps Workshop
2. Glenn Reyes @glnnrys 
 
 🇵🇭 living in 🇦🇹 Independent Software Engineer 
 Gotten into Web3 through @enzyme fi nance 🤍 React, GraphQL, Design Systems 
 🚴 Sports & 🎸 Music
3. Agenda 1.Intro to Web3 & Ethereum Virtual Machine (EVM) Blockchain, Dapps & Ethereum 
 2.Intro to Wallets & Native Payments (Transactions) Intro & Setup MetaMask Public & Private Keys 
 3.Interacting with public Dapps Opensea, Uniswap, ParaSwap, Lenster, Enzyme, etc. 
 4.Understanding the tech stack behind Dapps 
 5.Identifying UI/UX challenges 
 6.What can we do today?
4. Questions?
5. What is a blockchain?
7. What is Ethereum?
8. Ethereum is the community-run technology powering the cryptocurrency ether (ETH) and thousands of decentralized applications.
9. What are Smart Contracts?
10. A "smart contract" is simply a program that runs on the Ethereum blockchain.
11. Read — Query a node on the network Write — Send a transaction
12. What is Web3?
13. New iteration of the 
 World Wide Web
14. Web3 Architecture
16. Dapp
17. Decentralized App
18. Questions?
19. Wallets & Transactions
21. Interacting with public Dapps
27. Understanding the tech stack of Dapps
28. Ethereum Data Solidity Logic Hardhat EVM Smart Contracts Ethereum Development Environment Ethereum Tooling MetaMask Wallet Identity
29. Ethereum Data Solidity Logic Hardhat EVM Smart Contracts Ethereum Development Environment Ethereum Tooling MetaMask Wallet Identity Vite React Development Environment Frontend Tooling React User Interfaces Frontend BACKEND FRONTEND
30. github.com/glennreyes/react-dapp
31. Why nobody uses really Web3 yet Identifying UI/UX challenges
32. The entire process is hard to understand Wallets, Setup & Transactions
34. Transactions aren’t instant … yet
35. etherscan.io
38. What can we do today?
39. Work to improve UI/UX of transactions • Sharding • Divide network into smaller independent networks • Allows to process transactions in parallel • Layer 2 Solutions • O ff -chain or side chains - less congestion & better transpaction speed • ✅ Upgrading to Ethereum 2.0 — “The Merge” • September 15, 2022 • Proof of Work 👉 Proof of Stake • Less energy consumption by ~99.95% • Improving network infrastructure • Improve Ethereum network infrastructure • Increase number of nodes • Improve connectivity between nodes
40. https://tinyurl.com/better-web3 Ideas on what we can do today
41. https://tinyurl.com/better-web3 - feedback Please help me improve 
 this workshop 🙏