Projects

Project Overview

Vibra is a disruptive social application built on the Farcaster protocol. It was conceptualized to break the monotony of traditional, text-heavy Web3 feeds by introducing a highly engaging, vertical scrolling experience inspired by TikTok.

Targeting a core audience of Farcaster builders, founders, and creators, the platform merges cultural nostalgia with cutting-edge Social-Fi features—proving that blockchain interactions can be intuitive, visual, and highly dynamic.

The Challenge

  • Aggressive Go-to-Market: The startup required a fully functional MVP ready for user testing within a strict one-month timeline.
  • Complex Feature Integration: Seamlessly integrating heavy Web3 mechanics—like native crypto wallets and tradable Fan Tokens—without interrupting the fast-paced, vertical video consumption experience.
  • Cross-Platform Constraints: Designing a cohesive experience that navigated the distinct technical limitations of both iOS and Android simultaneously using React Native.

UX Strategy & Design Decisions

1. Compartmentalized Navigation Architecture

To prevent the cognitive overload of blending DeFi mechanics with social scrolling, I designed a segmented navigation model. Each primary feature (the video feed, the wallet, the token trading ecosystem) operates as its own distinct "world" within the app. This isolates complex financial interactions from the primary content loop, ensuring the user's viewing experience remains entirely frictionless.

2. "Controlled Brutalism" & Nostalgic UI

The brand identity draws heavily from early 2000s music television and old-school operating systems, targeting a specific millennial, tech-forward demographic. To ensure this aesthetic didn't compromise usability:

  • Foundation: The core UI relies on minimalist, standardized design principles to ensure accessibility and clear wayfinding.
  • Impact: The bold, brutalist visual elements are strategically "exploded" only during specific user interaction peaks, delivering emotional engagement without sacrificing everyday functionality.
Vibra wallet views and token trading interface
Vibra wallet views and token trading interface

Technical Execution & Developer Handoff

Designing for React Native Agnosticism

As the sole designer working alongside a frontend developer, I built a comprehensive Design System in Figma optimized for rapid implementation. Because we were building simultaneously for iOS and Android, I had to continuously adapt the UI and UX logic to accommodate React Native constraints. I unified the component behavior to create a generalized, cross-platform design language that minimized development friction while preserving the core aesthetic.

We utilized Expo to facilitate rapid, real-time testing in production environments, allowing for immediate UX iterations based on technical feedback.

Vibra design system and component library in Figma
Vibra design system and component library in Figma

Outcomes

The one-month sprint successfully resulted in a functional MVP that allowed for immediate user testing and iteration. Vibra achieved early adoption and maintains an active presence within the Farcaster developer and creator community.

Links & Documentation