Aura / Redesign v4 / Midnight

Midnight.
Your concept, systemized.

Built to match your concept shots: one deep-navy material world, starfield atmosphere, a lit crystal mascot, a recurring sparkle mark, and icons doing the labeling. Onboarding chrome is step counter + Skip only (no top bar), every onboarding CTA is the same indigo gradient, and the gauge language from the opener demo carries into the profile score. Kept from before: fixed dock, SF Pro, one loud moment per screen, and your .99 pricing.

Material

One surface family. Navy fills at two intensities with luminous indigo borders. Emphasis = border glow, never a different material.

Atmosphere

Starfield + radial glow on every screen. The world persists across onboarding and the app, so screens feel like rooms in one place.

Carry-over

Four recurring elements: the crystal, the sparkle mark, the 270° gauge, and the gradient CTA. Each appears on 2+ screens.

Color

Indigo is the product. Gold sparkle = delight beats. Green = positive verdicts only. Nothing else gets color.

The screens

#080A16 midnight #141934 surface #6C7BFF indigo #E8C979 gold spark #4ADE80 positive

TYPE: SF Pro (system), large-title 700 once per screen. CTA gradient #5A6BFF to #7C6CFF, identical on every onboarding screen.

Onboarding · 3 steps, no top bar, one CTA color
Say the
right thing.

Trained on millions of real conversations, Aura knows what gets replies before you hit send.

Get started
Step 1 · lit crystal on a glow platform
motion: crystal floats, base glow breathes in sync, stars twinkle, copy staggers in
Opener
"Are you a parking ticket? Because you've got fine written all over you."
Aura score
0.0 /10 Needs work
Bottom 10% of the millions of openers Aura has studied. Open with something from her bio instead.
See what Aura can do
Step 2 · opener analysis, gauge is born here
motion: gauge sweeps to 31% over 1.5s, count-up in sync, verdict fades in last
Aura Pro
Get replies that get replies.
Trained on millions of conversations and profiles. On your side every time you text.
Unlimited reply help
Honest profile ratings
Everything unlocked
MonthlyBEST VALUE
$19.99/mo · 3 days free
Weekly
$6.99 /week
Yearly
$79.99 /year · Save 67%
Try 3 days free, then $19.99/mo
Cancel anytime · Restore · Terms · Privacy
Step 3 · paywall, same CTA gradient as steps 1 and 2
motion: plans cascade in, selection ring morphs between rows, CTA text crossfades per plan
The app · Coach tab, Replies and Profile
Hi, Ethan
RepliesProfile
+
Drop a screenshot
We'll suggest what to say next.
Choose a tone
Flirty
Funny
Chill
Direct
Suggested reply
That looks unreal. What's your go-to trail?
Generate reply
Coach
History
Insights
You
Coach · Replies · sparkle mark recurs 4 times, on purpose
motion: dropzone glow breathes, tone selection ring slides between tiles, reply card slides up
Hi, Ethan
RepliesProfile
+
Upload profile
Photos, bio, and prompts.
Profile score ● Strong start
0.0 /10
Top improvements
Lead with your hiking photo
Shorten prompt two
Swap the mirror selfie
Improve profile
Coach
History
Insights
You
Coach · Profile · same gauge language as onboarding step 2
motion: score counts up, meter fills to 74%, improvements stagger in one by one

Why your concept works

Worth naming precisely, because these are the rules the build must protect:

One material world

Every surface is the same navy at two intensities. Hierarchy comes from border luminance and glow, not from swapping materials. v3's white-card-on-dark contrast was still two worlds; this is one.

Atmosphere is the brand

The starfield and radial glow make screens feel like a place, not a panel. Because the atmosphere persists from onboarding into the app, moving through the product feels continuous.

A rendered mascot

The crystal is lit, faceted, translucent, and standing on a glow platform. Light implies craft. Flat shapes read as clip art; lit objects read as a team with a 3D artist.

Recurring motifs

The sparkle mark appears in the wordmark, the PRO pill, feature bullets, the suggested-reply label, the CTA, and the tab bar. Repetition with variation is what cohesion literally is.

Icons label, text breathes

Tone tiles, feature lists, and improvement rows all lead with a small icon, so almost no caps labels are needed. The one big number per screen keeps its authority.

Scores have opinions

"Needs work." "Strong start." A verdict under a number turns data into coaching, which is the product's whole personality, and it recurs identically in onboarding and the app.

Motion + carry-over spec

Same Reanimated + moti stack as before, plus shared-element continuity between onboarding steps:

Shared elements

Step 1's crystal shrinks and morphs into the sparkle wordmark as onboarding completes (scale + position transition, 450ms). The gauge born on step 2 is the same component that renders the profile score, so the user has already learned it.

Onboarding steps

No top progress bar. The step counter increments with a vertical digit roll (01 to 02, 200ms), screens push with a 250ms slide + fade, and the CTA (identical gradient throughout) never moves or changes color.

Ambient layer

Stars twinkle on a 6s loop, the crystal's platform glow breathes with its float, and hot cards' borders pulse subtly. All ambient motion is opacity-only and respects reduced-motion.

Gauges + numbers

270° gauge sweeps to the true value fraction over 1.5s with the count-up in sync; the verdict label fades in only after the number lands, so the opinion is a punchline.

Selection morphs

Paywall selection ring and tone-tile highlight slide between positions (layout animation) instead of toggling, and the paywall CTA text crossfades to quote the selected plan.

Docks + loading

Unchanged contract: fixed-height CTA dock on every screen, skeleton shimmer instead of spinners, results always slide up from below.