# Zero-Friction, Mobile-First Onboarding for MetaNet-Enabled Apps

Crumbs (<op@rarepepe.club>)

## Abstract

A zero-friction onboarding protocol optimized for mobile-first metanet enabled user experiences. Temporary key generation enables instant access without sign-up; standardized UI components facilitate seamless export of keys and cross-app communication while preserving usability across devices. Secondly it mandates clear contextual communication of the benefits of uniquely blockchain enabled features, so users understand *why* persistence matters at the right moments during their learning curve.

***

## Motivation

MetaNet-enabled applications fail if users cannot immediately perceive utility. Conventional onboarding flows (downloads, signups, verification) create friction and deter adoption. Allowing immediate engagement via temporary keys, mobile-first UX, and contextual communication of blockchain value improves retention and adoption of wallets, encourages certification over multiple sessions, and through it long-term participation.

***

## Specification

### 1. Temporary Key Generation

* On initial visit, apps **MUST** generate temporary keys asynchronously.
* Key generation **MUST** complete within **0.5 s**; otherwise, users **MUST** be allowed to browse placeholder data until ready.
* Delays beyond 0.1 s interrupt flow; beyond 1 s break task continuity ([NN/g: Response Times](https://www.nngroup.com/articles/response-times-3-important-limits/)).

### 2. Immediate Access and Deferred Onboarding

* Users **MUST** access core features without sign-up, download, or authentication.
* Users typically leave within 10–20 s unless value is instantly clear ([NN/g: How Long Do Users Stay on Web Pages?](https://www.nngroup.com/articles/how-long-do-users-stay-on-web-pages/)).
* Temporary keys **MUST** unlock a subset of functionality.
* Apps **MUST NOT** enforce explicit onboarding (tutorials, forced walkthroughs) before core functionality is visible ([NN/g: Mobile App Onboarding](https://www.nngroup.com/articles/mobile-app-onboarding/)).

### 3. Mobile-First, Responsive Design

* Apps **MUST** be designed mobile-first: prioritize small-screen usability (touch targets, minimal UI) before adapting for desktop.
* Responsive design **MUST** prevent content dispersion or degraded usability on larger devices ([NN/g: Content Dispersion](https://www.nngroup.com/articles/content-dispersion/), [Baymard: Mobile UX](https://baymard.com/blog/mobile-ux-ecommerce)).

### 4. Optional Persistence via Standard Banner

* Apps **MUST NOT** force key saving during first sessions.
* Apps **MUST** display a standardized, dismissible banner (configurable top/bottom).
* Banner **MUST** include:
  * A link/button to export or onboard.
  * A permanent **"What is this?"** link.
* The **"What is this?"** link **MUST** open a drawer with a one-paragraph explanation of:
  * What MetaNet is.
  * How this app uses it.
  * Which features require persistence, and why.
  * Which features do not.

### 5. Standardized Export Screen

* Accessible via the banner, this screen **MUST**:
  * Provide clear export instructions.
  * Enable one-click export to supported MetaNet wallets.
  * Show a neutral, curated list of compliant wallets.
* Wallets **MUST** implement compatible import functionality.

### 6. Feature Disclosure and Blockchain Value Communication

* Apps **MUST** clearly indicate which features require persistent keys, MetaNet certificates, or social certificates.
* Apps **MUST** communicate the **unique benefits of blockchain usage** *in context*:
  * When identity persistence enables social reputation, explain that benefit at the point of use.
  * When immutability or micropayments enable a feature, explain it where the user invokes that feature.
* Explanations **MUST** emphasize user benefit over technical detail in maximum two lines of paragraph text.
* Research shows abstract explanations fail; users only retain information when given at the moment of relevance ([NN/g: Contextual Help](https://www.nngroup.com/articles/contextual-help/), [Baymard: Accounts & Self-Service](https://baymard.com/blog/current-state-accounts-selfservice)).

### 7. Cross-App Communication

* Temporary users **MUST** be able to communicate across MetaNet apps with other temporary and certified users in real time.
* Apps **MUST** show total network-wide online users.
* Identified users (with social certs) **MUST** be distinguishable.
* Identified users **MUST** be able to mute or apply a "trolltoll" to unidentified users or opt-out from being visible across metanet apps.

***

## Implementations

* Standardized banner guidelines. (placement, style, dismissibility, "What is this?" drawer).
* Mobile-first design approach strongly encouraged for all metanet enabled apps, validated with NN/g and Baymard heuristics.
* IRC-style communication overlay that allows temporary and certified users to communicate and troubleshoot across metanet enabled apps.
* Export/import flows tested across multiple wallets.
* Contextual tooltips and inline hints that describe blockchain-backed benefits in plain language at the point of use.
* Emphasize in-app value unlocked via persistence at the right moment of the user journey.

***

## References

* [NN/g: Response Times: The 3 Important Limits](https://www.nngroup.com/articles/response-times-3-important-limits/)
* [NN/g: How Long Do Users Stay on Web Pages?](https://www.nngroup.com/articles/how-long-do-users-stay-on-web-pages/)
* [NN/g: Mobile App Onboarding](https://www.nngroup.com/articles/mobile-app-onboarding/)
* [NN/g: Content Dispersion in Responsive Design](https://www.nngroup.com/articles/content-dispersion/)
* [NN/g: Contextual Help Improves UX](https://www.nngroup.com/articles/contextual-help/)
* [Baymard: Mobile UX E-commerce](https://baymard.com/blog/mobile-ux-ecommerce)
* [Baymard: Current State of Accounts & Self-Service UX](https://baymard.com/blog/current-state-accounts-selfservice)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://bsv.brc.dev/opinions/0110.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
