Jump ahead to
📋 Taipei Blockchain Week
Taipei Blockchain Week stands as a prominent event within the blockchain landscape in Taipei. Among its notable features, the 2-day hackathons, offers a dynamic platform for innovative developers to converge, fostering the exchange of forward-thinking ideas. Participants collaborate on the creation of cutting-edge projects, delving into the realms of web3 and AI.
Our Team
Joining the first hackathon marked a new chapter for me, and it was also my debut as a designer collaborating with a group of engineers in person. The team formation process was similar to speed dating - and it took place a week before the hackathon via a Discord channel. It turned out to be a fantastic approach!
I want to give a big shoutout to my incredible teammates – Steffen, Eric, Andy, and Brian. Working with them was a pleasure, and our collaboration was nothing short of amazing!
Kudos to Andy, our algorithm guru 🧙🏻
Selected among 56 teams, our product shined on demo day—a truly wonderful experience!
Demo day presentation
🌟 In the end, we clinched 3rd place—a perfect cherry on top of our success!🌟
The Product (in 2 days!)
In just two intense days, we crafted an MVP—meet Gasolina: a simple, yet powerful, multi-chain gas price prediction product.
The Challenge
As a UX/UI Designer…
Before building the product, we faced a few key challenges:
I.
II.
III.
IV.
V.
Given the infrastructure nature of our product, my primary focus as a UX/UI designer was understanding the problems we aimed to solve, identifying potential users, and executing a solution.
Superrr-rapid Research
As a UX/UI designer, I spent half a day engaging with 5-7 participants in hackathons and Taipei Blockchain Week. The quick chats yielded valuable insights:
Users struggle to find one-stop gas fee index platforms
Interchain traders would benefit from multi-chian gas price calculation
High-volume transaction entities like dApps, wallets and custodians stand to gain the most
Additionally, I researched challenges related to trading and gas fees, uncovering the following:
News on people spending too much on gas price
📰
“Worth it? Trader spends $120K on gas buying $155K worth of a memecoin”
- May 2023, Cointelgraph
📰
”Bitcoin user overpays $3 million in fees for a single transaction”
- Nov 2023, the Block
The Design
Task Flow
I quickly created two task flows centered around key user actions on our platform: finding gas fees and locating the API.
From sketch to low and mid-fi wireframes
On day 1, I swiftly sketched and crafted low-fi wireframes, enabling our front-end engineer to kickstart building Gasolina's skeleton:
Sketch
Low to mid-fi wireframe
Brand Identity - Name, Logo and UI Kit
A catchy name and a cool logo make a project memorable. That's why I chose "Gasolina"—linked to a famous Spanish gas fee song and meaning gas in Spanish.
The primary colors, red and yellow, symbolize fire and gas.
High-fi Wireframes
After gathering feedback from teammates, I incorporated UI kit elements into the wireframes. Here are the refined results:
☝️ Click to view on Figma
The Pitch
During the hackathon, creating a compelling pitch deck was crucial for our proposal. I used a Canva template to swiftly put together a presentation covering why we did it, what we did, how it works, our target audience, and who we are.
The aim was to make it easily digestible and attractive.
☝️ Click to view on Canva