Removing Friction from Exchange

The biggest hurdle was creating a smooth, responsive experience for users across all devices, especially mobile. Since this was my first Web3 project, adapting to its intricacies added complexity. Beyond mobile responsiveness, we encountered an additional challenge: how to graphically represent complex swap and trade configurations in a way that users could easily share on social media to build interest. Lastly, gas fees were a major barrier to adoption, significantly impacting the user experience and usability of the DEX.

Using the existing tech stack (React, Typescript, Chakra UI, Metamask), I focused on improving mobile responsiveness and creating a clear user journey. Here's how we approached the problem:

• Mobile Responsiveness: I restructured the UI components using Chakra UI to make the DEX screen-width responsive, particularly on mobile devices that handle crypto wallets.
• Social Sharing Representation: For social sharing of trades, I proposed an approach using a DOM-based image generation library. This approach would allow users to share graphical representations of their trades, but we ultimately archived this feature due to the added complexity of storing images in a database.
• Gas Fee Approach: To mitigate the high gas fees that deterred users, we opted to launch the DEX on the Polygon network, which offered lower fees compared to Ethereum, making it more accessible to users.
• Marketing Landing Page: I also built a custom marketing landing page for the DEX on Squarespace to communicate the product's value and features. This involved working within the established design system and extending it for marketing purposes.

As the project's UX lead and the newest team member, I took charge of creating a clean and responsive user experience across all devices. I recommended changes to our API data schemas to improve content delivery and built the custom landing page on Squarespace. I also designed and tested potential solutions for social sharing challenges and was responsible for manually testing the DEX across multiple browsers and devices, documenting bugs and documented and resolved. Lastly, I contributed to the product's walkthrough documentation, making it easier for new users to navigate the platform.

My work drove the alpha release of the DEX, gaining initial traction while the NFT market was peaking. Despite not pursuing further releases, the project provided valuable lessons and is now used internally as a case study for improving our Node API infrastructure. The knowledge gained from scoping the user experience early on has informed future projects, particularly regarding how we can improve the developer experience.