yumi-flutter/design-qa.md

2.3 KiB

Design QA

  • Source visual truth: Figma 3351:5626 and /var/folders/pb/pgzxbnfd2jd8nmtbykd31h2h0000gn/T/codex-clipboard-5ea92794-9b5a-469e-bf5c-7eec4b63206d.png
  • Implementation screenshots: /tmp/yumi_party_after_closed.png and /tmp/yumi_tab_after_wait.png
  • Combined comparison: /tmp/yumi_party_design_comparison.png
  • Viewport: Pixel 6a, 1080 x 2400, Android 16
  • State: logged-in Home/Party and Me screens with live API data

Full-view comparison evidence

  • The supplied 375 x 727 moon background begins at the top of the app content and continues to the bottom navigation on Home and Me.
  • Wealth uses the 172 x 172 transparent treasure artwork clipped inside the 172 x 130 card instead of stretching it as a full background.
  • Charm and Room use 66 x 66 artwork at the Figma offsets.
  • All leaderboard avatars are circular cover crops and retain a visible gold, silver, or bronze frame.

Focused region comparison evidence

  • Compared the 355 x 130 leaderboard region in Figma with the same region from the Pixel 6a screenshot.
  • Dynamic banner, avatar, country, and room API content differs from Figma sample content as expected; layout geometry and image treatment match the requested surfaces.

Findings

  • No actionable P0, P1, or P2 mismatch remains for the requested background, leaderboard artwork placement, avatar cover mode, or avatar frames.
  • P3: live banner and room content cannot be pixel-identical to Figma placeholder content.

Comparison history

  • Initial: square decoration assets were stretched or mispositioned, and leaderboard avatars had no rank frames.
  • Fix: applied Figma layer dimensions and offsets, added frame assets, and forced static and GIF avatars to BoxFit.cover.
  • Post-fix: the combined comparison and device screenshots show correct artwork placement, framed avatars, and no visible overflow.

Verification

  • flutter analyze --no-fatal-infos --no-fatal-warnings completed with exit code 0 for the six affected Dart files.
  • Android debug APK built, installed, and launched successfully on the Pixel 6a.
  • No load failure from the new local background/rank-frame assets and no RenderFlex overflow was observed. An existing empty network-image exception was emitted while navigating outside the leaderboard flow; it is not produced by the guarded leaderboard avatar builder.

final result: passed