Projects

Project Overview

Zurf is a mobile Social-Fi application built on the Lens Protocol, acting as the conceptual and technical precursor to Vibra. It was designed to bridge the gap between complex blockchain social interactions and an aggressively playful, engaging user experience.

Targeting a Web3-native community of builders, artists, and "meme-lords," Zurf transforms the typically dry, technical Social-Fi environment into a highly animated, vibrant playground. The platform successfully facilitated digital engagement and served as the focal point for Lens Protocol-sponsored IRL community launch events.

The Challenge

  • Aggressive Go-to-Market: The entire app—including complex UI interactions and a cross-platform design system—had to be designed and handed off within a 1-month sprint.
  • Content Adaptation: Forcing varied, traditionally horizontal or static content (like plain text posts and multi-ratio images) into a strict, full-screen vertical scrolling feed.
  • Wallet Gamification: Reimagining the traditional, spreadsheet-like crypto wallet interface into a community-driven "Social Wallet."

UX Strategy & Design Decisions

1. Adaptive Vertical Feed & Ambient Motion

To deliver the high sensory stimulation users expect from mainstream giants like TikTok, I designed an adaptive vertical layout system.

  • Content-Specific Logic: Rather than forcing all media into one box, the UI employs distinct architectural rules for images, videos, and text—all unified within the same scrollable vertical container and reaction overlay.
  • Dynamic Text Posts: To prevent plain text from feeling static in a video-first environment, I implemented ambient motion backgrounds. This ensured the interface remained constantly "alive," maximizing continuous visual engagement even when the content itself was static.

2. The Social Wallet

To integrate social dynamics into DeFi mechanics, I redesigned the standard token asset list by injecting social proof directly into the UI. By seamlessly blending financial balances with community rankings, leaderboards, and friends' token activity, the wallet interface became a tool for speculation, discovery, and community-driven virality rather than just a storage utility.

Technical Execution & Animation Handoff

Designing an animation-heavy interface for a React Native cross-platform app required a highly structured, developer-friendly handoff pipeline. As the sole designer collaborating with the frontend lead, I tailored the delivery of every micro-interaction to its specific technical requirement:

  • High-Complexity Animations: Prototyped in After Effects and exported via Rive and Lottie for lightweight, seamless native integration.
  • Micro-Interactions & UI Motion: Prototyped in Figma and Jitter, then translated directly into purely coded animations using CSS or Moti to maintain app performance.
  • Static Fallbacks: Extremely complex visual loops were exported as highly optimized media files to guarantee performance on lower-end devices.
Zurf compositions in Figma
Zurf compositions in Figma

Outcomes

The application successfully launched within the 1-month sprint, serving as the foundational community hub for a series of IRL events sponsored directly by Lens Protocol. The design system established in Zurf successfully laid the groundwork for the subsequent development of Vibra.

Links & Documentation