← Onboarding

Mirrativ

Mirrativ, Inc. · Social Networking · $900K/mo · 9K downloads · ★ 4.3

App Store ↗

Screens31

6Profile setup

Colors

  • #19B9B3Teal Background · Full screen backdrop
  • #FFFFFFCard Outline Selection · Avatar item selected circular border · Headers · CTA button background
  • #1CA7A3CTA Button Teal Text · Primary action text label

Type

  • Header TitleHiragino Sans · 44px · 800 · #FFFFFF
  • Header SubtitleHiragino Sans · 28px · 700 · #FFFFFF
  • CTA Button LabelHiragino Sans · 32px · 700 · #1CA7A3

Elements

  • Avatar 3D Preview · Illustration / 3D Model Render

    Upper center of the screen, extending from roughly y=250 to y=700. · Anime-styled 3D female avatar character gesturing toward the user.

  • Avatar Preset Thumbnails Grid · Carousel / Selector

    Two rows of 4 circular avatar thumbnails positioned across the lower third, y=650 to y=850. · Circular icons; currently selected avatar (top left) has a prominent thick white circular ring border.

  • Start CTA Button · Button

    Bottom pill button centered, y=880 to y=940. · Solid white pill shape with teal typography 'このエモモ(アバター)ではじめる!!'.

Layout

Character selection screen featuring top copy instructions, large central interactive preview model, bottom 2x4 grid selector of presets, and persistent CTA at the footer.

Notes

Thumbnails in the bottom row cut off partially at the horizontal edges indicating horizontal scrolling or grid layout.

Store