​
Mobile-first

  • Use legible font sizes, line heights, and adequate contrast for small screens.
  • Help people concentrate on primary tasks and content by limiting the number of onscreen controls while making secondary details and actions discoverable with minimal interaction.
  • Use tab navigation to simplify movement within the app.
  • Ensure layouts adjust smoothly to various screen sizes and orientations.
  • Design for vertical scrolling rather than horizontal, as it’s more natural on mobile.
Metadata Guidelines

​
Onboarding and guest experiences

  • Your app metadata will be the first thing a new user will see, and is what they’ll base their first impression on. Aim for your metadata to provide helpful context, and properly set expectations with new users on what your app does. Consider the experience for new users opening your app for the first time. Include your value props, a light onboarding flow, or easy access to guides / FAQs from your homepage to help new users orient themselves
  • No technical jargon - language is user-friendly
  • Value is immediately apparent to new users
  • Defer auth until needed. Triggering the auth tray as the first thing a user sees on app open can create a jarring experience, and asks users to take an action they may not be confident in before demonstrating the value of your app.
  • Include a splash page for sign-in if needed.
  • Consider adding a “guest” mode, allowing users to explore your app before asking them to sign in.
Metadata Guidelines

​
Gasless transactions

Enable users to transact on your apps without needing gas by using wallet solutions that support gas sponsorship like Base Account and Paymaster.

​
Legible identity

Never use wallet addresses. Instead, leverage identity solutions like ENS and Basenames.

​
Localization

Many of our users are located around the world. Apps that are localised for each region will perform significantly better. For next.js apps, you can use Next.js Internationalization to localize your app.