Zing

A minimalist, interactive quote experience that brings together creator discovery, expressive typography, and personal curation in a carefully crafted mobile interface.

Comment

Inspiration

Zing started with a simple idea: memorable words deserve a better home than an endless scroll of content. Quotes from creators, streamers, and cultural figures can be funny, motivating, thoughtful, or unexpectedly meaningful. I wanted to build an experience centred on those moments.

Design approach

Zing is designed around a restrained, monochromatic visual language. Rather than relying on decorative elements, the interface uses contrast, whitespace, and carefully selected typography to give each quote room to breathe.

The experience is organized around three primary destinations: Home, Discover, and Settings. Home provides a focused quote-reading experience, Discover introduces a playful quote-identification interaction, and Settings allows users to personalize their experience through creator selection and typography choices.

Onboarding introduces creator selection early, helping users shape the content they encounter. The interface is intentionally mobile-first, with portrait-oriented layouts, clear navigation, and lightweight interactions.

Building the experience

Zing is built with Flutter and Dart. Its architecture separates presentation, data models, and services, while local storage supports creator preferences, quotes, and other user settings.

The web demo extends the existing mobile application into an interactive browser experience. A portrait phone presentation lets visitors explore the actual interface without installing the Android application.

Design challenges and learnings

One of the main challenges was maintaining a consistent interaction language across different screens. Quote navigation, reveal interactions, creator profiles, and category filters need to feel like parts of one coherent experience rather than isolated features.

Another challenge was adapting a mobile-first application to a desktop demonstration without compromising its intended form factor. The phone presentation preserves the portrait experience while the surrounding page provides context for the interface and its design decisions.

What comes next

The current project is a prototype. Further work will focus on refining interaction consistency, validating accessibility, testing across devices, and ensuring browser-specific behavior remains reliable while preserving the native mobile experience.

Built With

Share this project:

Updates

Submission history