Blocklock

Description

My first-ever ETH hackathon experience — where I joined a team mid-way and designed BlockLock, a decentralized password manager. While we didn’t win a bounty, our work stood out: we were selected to present onstage as one of the Top 10 out of 60+ teams at ETHDam 2024. Later, we placed Top 5 in the Quadratic Funding round, receiving 18,454 community votes.

Client

ETHDam w/ Studio Little Nice Things

ETHDam w/ Studio Little Nice Things

Project

Hackathon

Hackathon

DELIVERABLES

DELIVERABLES

Branding Prototype Pitch deck design Video demo

Branding Prototype Pitch deck design Video demo

Branding Prototype Pitch deck design Video demo

Credits

Credits

Lead dev by Charlie Full-stack dev by Jack Front-end dev by Jordan Design/film by Vikrant

Lead dev by Charlie Full-stack dev by Jack Front-end dev by Jordan Design/film by Vikrant

Lead dev by Charlie Full-stack dev by Jack Front-end dev by Jordan Design/film by Vikrant

Presenting Blocklock onstage on the final day of the ETHDam hackathon in Amsterdam.

Why a Decentralized Password Manager?

Problem

Traditional password managers are centralized honeypots. The 2022 LastPass breach exposed data from over 30 million users. At the same time, Web3 users face increasing friction managing credentials securely across dApps.

Hypothesis

Could we combine the UX smoothness of Chrome’s built-in autofill with the cryptographic guarantees of on-chain storage?

Challenge

Design a password manager that feels familiar to Web2 users, while staying trustless, permissionless, and user-sovereign.

Our Goal
  • Minimize trust assumptions

  • Eliminate central points of failure

  • Offer native crypto interactions (e.g., wallet signatures) in a non-technical, friendly way

  • Stand out visually in a sea of “techy-blue” products

My Role & Design Process

Team Formation & Kickoff

I joined the team mid-hackathon through the ETHDam speed-dating session. The developers had a compelling prototype idea — BlockLock — but no designer. I jumped in as the sole designer to help shape both product and brand.

UX/UI Design

Sketched quick wireframes referencing Chrome’s password prompt and 1Password’s inline menu

Designed primary flows:

  • Inline password prompt when a user hits a password field

  • Save on-chain interaction with MetaMask

  • Feedback UI: progress loaders, estimated time, and confirmation messages

  • Management dashboard: update, delete, share credentials

Created a dark, minimal UI with highlights of turquoise — signaling clarity and safety

Design Highlights
  • Inline Interaction: UI sits inside the form itself, no modal disruption

  • CTA transforms dynamically from “Save on-chain” to “Processing…” after signature

  • Subtle microcopy below menu shows time estimate and adds trust

  • Vault logic designed around domain-specific keys — no need for manual folder structures

Branding & Visual Design
  • Designed the logo using Diamond Grote, chosen for its keyhole-like ink traps

  • Created a unique turquoise palette to move away from cold, fintech blues

  • Animated the logo reveal in After Effects for the live on-stage demo

Marketing Site

Designed and built a single-page website in Framer, complete with:

  • Problem framing

  • Demo video

  • Team section

  • On-chain storage explainer

All done within the 36-hour hackathon timeframe

Results, Feedback & Learnings

Recognition
  • Selected as one of Top 10 teams out of 60+ at ETHDam 2024

  • Presented live on stage to judges and participants

  • Ranked Top 5 in the Quadratic Funding round, receiving 18,454 votes

Key Takeaways
  • Design can build trust faster than whitepapers — especially in Web3

  • Designing in-line, minimal interactions makes unfamiliar flows (like MetaMask popups) feel native

  • Great brand design pays off: many attendees remembered us as “that turquoise password tool”

  • Collaborating with engineers in real-time pushed me to prototype faster than usual — focusing more on clarity than perfection

Do check out the video demo


I have written a thorough blog post on Little Nice Thing's substack: READ HERE


Also checkout the live presentation 👇

Curious to See the Real Work?

See how I actually design — not just the pretty screens. Book a walkthrough of my Figma files, UX flows, and strategic thinking.

Contact

Let’s bring your ideas to life—through pixels or stories.

Drop me a line via email or X, or book a free call… to explore my Figma designs or chat about film, design, or something in between.

Contact

Let’s bring your ideas to life—through pixels or stories.

Drop me a line via email or X, or book a free call… to explore my Figma designs or chat about film, design, or something in between.

Contact

Let’s bring your ideas to life—through pixels or stories.

Drop me a line via email or X, or book a free call… to explore my Figma designs or chat about film, design, or something in between.