# Release Notes - Version 1.1.0 **Phạm vi:** Commit `1fb1d579` → `a3ab89e1` **Tổng số commit:** 12 --- ## 1. Tính năng mới ### 1.1 Daily Engagement Notification - Bổ sung thông báo Daily Engagement dạng fullscreen (lock-screen style) nhằm kéo user quay lại app hằng ngày. - Đi kèm 8 ảnh teaser khác nhau cho nội dung thông báo. ### 1.2 App Shortcut & Uninstall Survey - Thêm shortcut "AI Photo Maker" trên launcher để user truy cập nhanh. - Tích hợp Uninstall Feedback Survey khi user gỡ app. ### 1.3 Màn hình chọn ảnh trong app (In-app Photo Picker) - Màn hình picker riêng thay cho system gallery. - Hỗ trợ: chọn album, lưới ảnh tùy chỉnh, yêu cầu permission có UI hướng dẫn riêng. ### 1.4 Dịch vụ Qwen - Image Editing - Tích hợp thêm Qwen làm AI service mới cho image editing, mở rộng nguồn tạo ảnh. ### 1.5 Lịch mới (Neon Calendar) - Component lịch mới phong cách neon dùng cho: - Chọn ngày sinh trong Couple Profile. - Thêm cột mốc (milestone) trong Timeline. --- ## 2. Cải tiến Generation Flow ### 2.1 Flow tạo ảnh đa dịch vụ - Cho phép mỗi style chọn AI service riêng (Face Combine, Image Combine, Qwen). - Cập nhật bộ style (`couple_styles.json`) với nhiều style/dịch vụ mới. - Logic điều phối generation tập trung, đồng nhất giữa các flow (Choose Picture, Future Baby, Generating). ### 2.2 UI Generating mới - Trải nghiệm mới khi đang tạo ảnh: hiệu ứng "scanning" trên ảnh + danh sách các phase rõ ràng để user thấy tiến trình. --- ## 3. UI/UX Updates ### 3.1 Refresh giao diện toàn app - Cập nhật design system: màu, typography, tokens. - Home tab mới: bottom tab bar, category section, profile reminder banner, banner pager mới. - Bộ icon tab mới: Create, Gallery, Profile, Story. ### 3.2 Cải tiến màn Future Baby & Home - Redesign Age Selector, Gender Selector, Face Slot. - Cập nhật Home Header, Home Loading, Style Browser (có loading state mới). --- ## 4. Thư viện & SDK ### 4.1 First Open SDK 4.3.0 + Ads SDK 9.0.4 - Nâng cấp First Open SDK lên **4.3.0**, Ads SDK lên **9.0.4**. - Splash / Language / Onboarding chuyển sang SDK mới quản lý → đồng bộ với chuẩn Apero. ### 4.2 Rate App - thư viện mới - Chuyển sang lib Rate App mới (Apero Module Rate) thay cho implement cũ. --- ## 5. Cập nhật cấu hình ### 5.1 Ad IDs & Strings - Cập nhật bộ Ad IDs production. - Chuẩn hoá & dọn dẹp strings cho 10 ngôn ngữ: DE, ES, FR, HI, JA, KO, PT, TH, VI, ZH. --- ## 6. Mô tả UI các màn hình trong app > **Lưu ý:** 6.1 Splash / 6.2 Language (First Open) / 6.3 Onboarding do **First Open SDK 4.3.0** render — không có Composable trong repo, chỉ có config XML (`fo_config.xml`, `fo_config_color.xml`, `fo_config_ads.xml`). Mockup mang tính tham khảo theo chuẩn template SDK. ### 6.1 Splash (SDK render) - Layout XML: `activity_splash.xml`. - Logo app `fo_ic_logo_app.webp` trung tâm, nền theo brand color. - SDK quản lý load Ad Splash (Resume / Splash Inter) trước khi navigate sang Language hoặc Home theo `FirstOpenNextAction`. ``` ┌──────────────────────────────┐ │ │ │ │ │ ╭─────╮ │ │ │ LOGO│ │ │ ╰─────╯ │ │ AI Couple │ │ │ │ ▓▓▓▓▓▓░░░░░ loading │ │ │ │ (Ad Splash by SDK) │ └──────────────────────────────┘ ``` ### 6.2 Language Có **2 màn Language** khác nhau: **(a) Language (First Open) — SDK render** - Layout do First Open SDK 4.3.0 quản lý, list ngôn ngữ + Native Ad theo config. ``` ┌──────────────────────────────┐ │ Language Next →│ ├──────────────────────────────┤ │ ╔══════════════════════════╗ │ │ ║ English ◉ ║ │ │ ╚══════════════════════════╝ │ │ ┌──────────────────────────┐ │ │ │ Tiếng Việt ○ │ │ │ ├──────────────────────────┤ │ │ │ 日本語 ○ │ │ │ └──────────────────────────┘ │ │ ┌──────────────────────────┐ │ │ │ [Native Ad] │ │ │ └──────────────────────────┘ │ └──────────────────────────────┘ ``` **(b) Language (Settings > Language) — `LanguageScreen.kt` in-app** - Header: back button (trái) + title "LANGUAGE" uppercase, font SpaceGrotesk, canh giữa (không có Next button). - LazyColumn các card `nativeName` ngôn ngữ; card chọn có viền gradient hồng-tím + chữ hồng + icon check tròn gradient bên phải. - Không có cờ, không có Native Ad. ``` ┌──────────────────────────────┐ │ ← LANGUAGE │ ├──────────────────────────────┤ │ ┌──────────────────────────┐ │ │ │ English │ │ │ └──────────────────────────┘ │ │ ╔══════════════════════════╗ │ │ ║ Tiếng Việt (✓) ║ │ ← border gradient + chữ hồng │ ╚══════════════════════════╝ │ │ ┌──────────────────────────┐ │ │ │ 日本語 │ │ │ └──────────────────────────┘ │ │ ┌──────────────────────────┐ │ │ │ 한국어 │ │ │ └──────────────────────────┘ │ └──────────────────────────────┘ ``` ### 6.3 Onboarding (First Open) - 3 trang giới thiệu tính năng chính, ảnh minimal/illustration full-bleed. - Indicator dạng dot dưới cùng, nút Next/Get Started kiểu CTA neon. - Native Ad fullscreen có thể hiển thị giữa các bước theo config. ``` ┌──────────────────────────┐ │ │ │ ┌────────────────────┐ │ │ │ │ │ │ │ [Hero Image] │ │ │ │ couple illustr. │ │ │ │ │ │ │ └────────────────────┘ │ │ │ │ Create magic with │ │ your partner ✨ │ │ │ │ Generate stunning AI │ │ photos together │ │ │ │ ● ○ ○ │ │ ╔════════════════════╗ │ │ ║ Next → ║ │ │ ╚════════════════════╝ │ └──────────────────────────┘ ``` ### 6.4 Home (AI Studio tab) - **Shell:** App shell dùng `HorizontalPager` (swipe disabled) chứa 4 tab, chuyển tab bằng bottom tab bar. - **Header:** - Trái: 2 avatar cặp đôi (chỉ hiện khi đã set up profile) — avatar A border gradient sweep hồng, avatar B gradient tím→cyan. Tap mở Couple Profile. - Phải: icon Crown PRO (mở Paywall) + icon Settings (gear, mở Settings). - Không hiển thị tên cặp đôi trong header. - **Banner Pager (Hero):** Carousel side-peeking, item active scale 1.0, các item bên cạnh scale 0.8 + alpha 0.5 + blur 10px (API 31+). Auto-scroll 3s, pause khi user kéo. Dot indicator neon dưới banner. - **Category Sections:** Mỗi category là 1 section riêng theo style: - **ROW layout:** `LazyRow` các card 130×162 đồng đều, có label đè gradient ở đáy card. - **GROUP layout:** 1 hero card 190×238 bên trái + nhiều cột phụ (2 card 90×113 xếp dọc) scroll ngang. - Header section: title trái + link "See all" hồng bên phải. - **Loading state:** Shimmer skeleton thay cho spinner khi `isLoading` hoặc `categories` rỗng. - **Profile Reminder Banner:** Nằm ngay **trên** bottom tab bar (không phải đầu màn) — chỉ hiện khi `showProfileReminder = true`. - **Bottom Tab Bar:** 4 tab — **AI Studio / Baby Gen / Our Story / Gallery** (không có tab Profile). Tab active: icon + label hồng, font Bold. - **Banner Ad:** Pin **dưới** bottom tab bar, persist qua tất cả các tab. ``` ┌──────────────────────────────┐ │ (◔)(◔) 👑 ⚙ │ ← Header: 2 avatars | PRO + Settings ├──────────────────────────────┤ │ │ │ ┌────────────────────┐ │ │ ░ │ [Hero Banner] │ ░ │ ← side-peek: side cards scale 0.8 + blur │ ░ │ ✨ neon glow ✨ │ ░ │ │ └────────────────────┘ │ │ ● ○ ○ │ ← neon dots indicator ├──────────────────────────────┤ │ Wedding See all│ │ ┌────┐ ┌────┐ ┌────┐ ┌────┐ │ ← ROW: 130×162 cards │ │ img│ │ img│ │ img│ │ img│ →│ │ │name│ │name│ │name│ │name│ │ │ └────┘ └────┘ └────┘ └────┘ │ ├──────────────────────────────┤ │ Travel See all│ │ ┌────────┐ ┌──┐ ┌──┐ ┌──┐ │ ← GROUP: hero 190×238 + cột 2 card │ │ │ │S1│ │S3│ │S5│ │ │ │ Hero │ ├──┤ ├──┤ ├──┤ → │ │ │190×238 │ │S2│ │S4│ │S6│ │ │ │ name │ └──┘ └──┘ └──┘ │ │ └────────┘ │ ├──────────────────────────────┤ │ ⚠ Set up couple profile → │ ← Profile Reminder (sát tab bar) ├──────────────────────────────┤ │ ✨ 👶 💞 🖼│ │AI Studio BabyGen OurStory Gal│ ← 4 tab; active = hồng bold ├──────────────────────────────┤ │ [ Banner Ad ] │ ← pin dưới tab bar, persist └──────────────────────────────┘ ``` ### 6.5 Style Browser - **Header:** Back button (trái) + title (giữa). Nền gradient VoidBlack. - **Tab Chips:** Hàng chip category scroll ngang phía trên — chip active có gradient border neon. - **Content:** `HorizontalPager` hiển thị `StyleGrid` của category đang chọn, vuốt ngang để chuyển category. - **Style Card:** Thumbnail + badge "PRO" overlay (nếu là style premium). - Loading: shimmer card grid. Empty: message khi không có style. ``` ┌──────────────────────────────┐ │ ← Style Browser │ ├──────────────────────────────┤ │ ╔══════╗┌──────┐┌──────┐┌────│ │ ║Weddi.║│Travel││Casual││Date│ → chip tabs │ ╚══════╝└──────┘└──────┘└────│ ├──────────────────────────────┤ │ ┌────────┐ ┌────────┐ │ │ │ img │ │ img │ PRO │ │ │ name │ │ name │ │ │ └────────┘ └────────┘ │ │ ┌────────┐ ┌────────┐ │ │ │ img │ │ img │ │ │ │ name │ │ name │ │ │ └────────┘ └────────┘ │ └──────────────────────────────┘ ``` ### 6.6 Choose Picture - **Header:** Chỉ có back button + title "CHOOSE PHOTOS" (uppercase), không có nút confirm. - **Photo Slots:** Tùy service yêu cầu 1 hay 2 ảnh: - **1 slot:** 1 card lớn 140dp chiếm full width, hiện glyph `+` khi rỗng. - **2 slots:** 2 card 90dp side-by-side label **"YOU"** (accent hồng) + **"PARTNER"** (accent tím). Slot đã có ảnh: thumbnail + icon edit ở góc trên-phải. - **Embedded Cropper:** Vùng crop ảnh lớn ngay trong màn (3:4) với viền màu accent theo slot active. Khi user kéo handle xong, auto-crop debounce. - **Bottom area:** Hint text + counter free-generation còn lại (nếu chưa Premium) + CTA **"GENERATE"** (gradient khi enabled, dark khi disabled). - **Banner Ad:** Dưới CTA. ``` ┌──────────────────────────────┐ │ ← CHOOSE PHOTOS │ ├──────────────────────────────┤ │ ┌─────────┐ ┌─────────┐ │ │ │ + YOU │ │+PARTNER │ │ ← 2 slots (hoặc 1 slot full width) │ │ ♡ pink │ │ ♡ purpl │ │ │ └─────────┘ └─────────┘ │ ├──────────────────────────────┤ │ ╔═════════════════════════╗ │ │ ║ ║ │ │ ║ [Embedded Cropper] ║ │ │ ║ 3:4, accent border ║ │ │ ║ ║ │ │ ╚═════════════════════════╝ │ ├──────────────────────────────┤ │ Crop your photo • 3 left │ │ ╔═════════════════════════╗ │ │ ║ GENERATE ║ │ │ ╚═════════════════════════╝ │ │ [ Banner Ad ] │ └──────────────────────────────┘ ``` ### 6.7 Select Photo (Photo Picker mới) - **Header:** Back button (trái) + title `select_photo_title` (giữa) + icon **Camera** trong card surface tối (phải) — tap mở camera chụp ảnh trực tiếp. - **Album Tab Row:** Hàng `AlbumTabRow` scroll ngang, đồng bộ với `HorizontalPager` bên dưới. - **Content:** `HorizontalPager` mỗi page là 1 `PhotoGrid` của album tương ứng — vuốt ngang để chuyển album. - **Trạng thái permission:** Khi chưa có quyền → `PermissionRequestView` overlay giữa màn với CTA xin quyền. - **Trạng thái loading / empty:** Spinner khi đang load, message khi album rỗng. ``` ┌──────────────────────────────┐ │ ← Select Photo [📷] │ ← back | title | Camera button ├──────────────────────────────┤ │ ╔════╗┌─────┐┌──────┐┌──────┐│ │ ║All ║│Camer││Screen││Saved │ → AlbumTabRow (sync pager) │ ╚════╝└─────┘└──────┘└──────┘│ ├──────────────────────────────┤ │ ┌──┐ ┌──┐ ┌──┐ ┌──┐ │ │ │📷│ │📷│ │📷│ │📷│ │ │ └──┘ └──┘ └──┘ └──┘ │ │ ┌──┐ ┌──┐ ┌──┐ ┌──┐ │ ← swipe ngang để đổi album │ │📷│ │📷│ │📷│ │📷│ │ │ └──┘ └──┘ └──┘ └──┘ │ │ ┌──┐ ┌──┐ ┌──┐ ┌──┐ │ │ │📷│ │📷│ │📷│ │📷│ │ │ └──┘ └──┘ └──┘ └──┘ │ └──────────────────────────────┘ Permission state (overlay): ┌────────────────────┐ │ 🔒 │ │ Allow access to │ │ your photos… │ │ ╔════════════════╗ │ │ ║ Grant Access ║ │ │ ╚════════════════╝ │ └────────────────────┘ ``` ### 6.8 Crop - **Header (CropHeader):** Back button (trái) + nút **"Auto"** (phải) — chỉ hiện khi detect được face. - **Instruction:** Text hint giữa header, đổi nội dung khi đã detect face ("Face detected" variant). - **Cropper Box:** Cropper lớn chính giữa (weight 1f), tỉ lệ **3:4**, handle 20dp. Có placeholder cho các state: loading, analyzing, error, no image. - **Bottom area:** Counter free-generation (nếu chưa Premium) + `CropBottomBar` với nút **"Continue"**. - **Banner Ad:** Dưới cùng. ``` ┌──────────────────────────────┐ │ ← [Auto] │ ← Auto chỉ hiện khi detect face ├──────────────────────────────┤ │ Crop your photo │ ← hint (đổi khi face detected) ├──────────────────────────────┤ │ │ │ ╔══════════════════════╗ │ │ ║ ║ │ │ ║ ║ │ │ ║ [Cropper 3:4] ║ │ │ ║ handles 20dp ║ │ │ ║ ║ │ │ ╚══════════════════════╝ │ │ │ ├──────────────────────────────┤ │ 2 free left │ │ ╔═════════════════════════╗ │ │ ║ Continue ║ │ │ ╚═════════════════════════╝ │ │ [ Banner Ad ] │ └──────────────────────────────┘ ``` ### 6.9 Generating - **Top:** Nút **X** (close) ở góc trái trên — mở `NeonCancelDialog`. - **ScanningImageRow:** Hàng frame ảnh input với hiệu ứng scanning beam (số frame = số ảnh user upload, 1 hoặc 2). - **Progress Display:** - Số phần trăm lớn 44sp bold ở giữa. - Subtitle "please wait" 13sp. - `NeonProgressBar` cao 6dp, fill gradient neon. - **Phase List (`GenerationPhaseList`):** Danh sách phase với icon, nội dung thay đổi theo `serviceType` (FaceCombine / ImageCombine / Qwen). - **Banner Ad:** `GeneratingBannerView` dưới cùng. - **Error overlay:** `NeonErrorDialog` khi sinh ảnh lỗi. ``` ┌──────────────────────────────┐ │ ✕ │ │ │ │ ┌────────┐ ┌────────┐ │ │ │▓scan▓ │ │▓scan▓ │ │ ← ScanningImageRow (1 hoặc 2 frame) │ │ │ │ │ │ │ │ [You] │ │[Partner│ │ │ │ │ │ ] │ │ │ └────────┘ └────────┘ │ │ │ │ 65% │ ← 44sp bold │ please wait │ ← 13sp │ ▓▓▓▓▓▓▓▓▓▓░░░░░░░░░░░ │ ← NeonProgressBar 6dp │ │ │ ✓ Phase 1 │ │ ✓ Phase 2 │ ← GenerationPhaseList │ ● Phase 3 │ (icon theo serviceType) │ ○ Phase 4 │ ├──────────────────────────────┤ │ [ Banner Ad ] │ └──────────────────────────────┘ ``` ### 6.10 Result - **ResultTopBar:** Back button (trái, trong surface card) + tên style (giữa) + spacer cân chỉnh (phải). - **Image Display:** Box giữa màn chứa ảnh kết quả, viền **NeonPink** (alpha 0.15), giữ nguyên aspect ratio. **Watermark** chữ ở góc dưới-phải (chỉ với non-premium). - **Actions Bar:** Tối đa 5 action (hiện theo context): - **Save** (ẩn nếu vào từ Gallery), **Share** (luôn có), **Report** (disable sau khi đã submit), **Discard** (chỉ với kết quả mới), **Delete** (chỉ khi vào từ Gallery). - Mỗi action = column: icon box + label. - **Banner Ad:** `ResultBannerView` dưới cùng. - **Dialogs:** AlertDialog xác nhận delete/discard, overlay spinner khi save, `ReportBottomSheetFragment` khi report. ``` ┌──────────────────────────────┐ │ [←] Sunset Romance │ ← back trong surface | style name ├──────────────────────────────┤ │ │ │ ┌──────────────────────┐ │ │ │ ╔════════════════╗ │ │ │ │ ║ ║ │ │ │ │ ║ [Result Image] ║ │ │ ← NeonPink border 0.15a │ │ ║ ║ │ │ │ │ ║ logo🅰 │ │ │ ← watermark (non-premium) │ │ ╚════════════════╝ │ │ │ └──────────────────────┘ │ │ │ ├──────────────────────────────┤ │ 💾 ↗ ⚠ 🗑 │ ← Save Share Report Discard/Delete │ Save Share Report Discard │ (hiển thị tuỳ context) ├──────────────────────────────┤ │ [ Banner Ad ] │ └──────────────────────────────┘ ``` ### 6.11 Future Baby (Baby Gen tab) - **Header:** Title "FUTURE BABY" canh trái (uppercase) — embedded trong Home tab, **không có back button**. - **2 Face Slot side-by-side:** 150dp height, accent color riêng (1 slot girl tone / 1 slot boy tone). Slot rỗng = `+`, có ảnh = thumbnail + edit. - **Gender Selector:** SectionLabel + 2 button toggle (không phải 3 — không có Random). - **Age Selector:** SectionLabel + control dạng dropdown-like (chọn 1 độ tuổi). - **BabyResultSection:** Khi có kết quả hiển thị ảnh baby + actions. - **Error text:** Inline error (nếu có). - **Free-generation counter** + **CTA Generate**. ``` ┌──────────────────────────────┐ │ FUTURE BABY │ ← title canh trái, no back ├──────────────────────────────┤ │ ┌──────────┐ ┌──────────┐ │ │ │ + Mom │ │ + Dad │ │ ← 2 slot 150dp side-by-side │ │ (girl │ │ (boy │ │ │ │ tone) │ │ tone) │ │ │ └──────────┘ └──────────┘ │ ├──────────────────────────────┤ │ Gender │ │ ┌────────┐ ┌────────┐ │ ← 2 button (không có Random) │ │ 👦 Boy │ │ 👧 Girl│ │ │ └────────┘ └────────┘ │ ├──────────────────────────────┤ │ Age │ │ ┌────────────────────────┐ │ ← dropdown-like │ │ 3 years ▾ │ │ │ └────────────────────────┘ │ ├──────────────────────────────┤ │ 2 free left │ │ ╔═════════════════════════╗ │ │ ║ Generate ║ │ │ ╚═════════════════════════╝ │ └──────────────────────────────┘ ``` ### 6.12 Couple Profile - **Header:** Back button (chỉ hiện khi không phải first launch) + title `set_up_your_duo` canh giữa. - **2 GradientAvatarCircles** side-by-side, cách nhau 40dp: - Avatar A: sweep gradient hồng/tím. - Avatar B: sweep gradient tím/cyan. - **2 NeonLabeledFields:** Tên partner A + tên partner B (lần lượt). - **NeonDateField:** Ngày kỷ niệm (anniversary). Tap mở **NeonCalendarDialog**. - **CoupleProfileContinueButton:** "Continue" hoặc "Skip" tuỳ trạng thái fill. ``` ┌──────────────────────────────┐ │ ← Set up your duo │ ├──────────────────────────────┤ │ │ │ ╭───╮ ╭───╮ │ │ ╱ + ╲ ╱ + ╲ │ ← GradientAvatarCircle A | B │ ╲___╱ ╲___╱ │ (sweep gradient pink/purple/cyan) │ │ ├──────────────────────────────┤ │ Your name │ │ ┌────────────────────────┐ │ │ │ Alex │ │ │ └────────────────────────┘ │ │ Partner's name │ │ ┌────────────────────────┐ │ │ │ Mia │ │ │ └────────────────────────┘ │ │ Anniversary │ │ ┌────────────────────────┐ │ │ │ 📅 Mar 5, 2024 │ │ ← tap → NeonCalendarDialog │ └────────────────────────┘ │ ├──────────────────────────────┤ │ ╔═════════════════════════╗ │ │ ║ Continue ║ │ │ ╚═════════════════════════╝ │ └──────────────────────────────┘ NeonCalendarDialog: ┌─────────────────────┐ │ ‹ May 2026 › │ ├─────────────────────┤ │ Mo Tu We Th Fr Sa Su│ │ 1 2 3 4│ │ 5 6 7 8 9 10 11│ │ 12 13 14 ╔══╗ 17 18 │ │ 19 20 21 ║15║ 24 25 │ │ 26 27 28 ╚══╝ 31 │ ├─────────────────────┤ │ Cancel Confirm │ └─────────────────────┘ ``` ### 6.13 Timeline (Our Story tab) - **Header:** Title "OUR STORY" canh trái, uppercase 18sp bold (không có back button — embedded trong Home tab). - **Timeline:** `LazyColumn` các `TimelineNode` — đường gradient dọc bên trái, dot màu cho từng event. Mỗi node là card hiện title + date + caption + icon thùng rác (xoá). - **Empty state:** `EmptyTimeline` message khi chưa có event. - **FAB:** Góc dưới-phải, tròn 56dp, nền NeonGradient, icon `+`, có bounce animation + soft glow khi press. - **Dialogs:** `AddMilestoneSheet` (modal bottom sheet thêm event) + AlertDialog xác nhận delete. ``` ┌──────────────────────────────┐ │ OUR STORY │ ← title canh trái, uppercase ├──────────────────────────────┤ │ ●─┐ │ │ │ ┌──────────────────┐ │ │ │ │ First Date 🗑 │ │ │ │ │ Feb 14, 2024 │ │ │ │ │ Our first date… │ │ │ │ └──────────────────┘ │ │ ●─┤ │ │ │ ┌──────────────────┐ │ │ │ │ Engagement 🗑 │ │ │ │ │ Dec 24, 2024 │ │ │ │ └──────────────────┘ │ │ ●─┤ │ │ │ ┌──────────────────┐ │ │ │ │ Anniversary 🗑 │ │ │ │ │ Feb 14, 2026 │ │ │ │ └──────────────────┘ │ │ ● │ │ │ │ ┌────┐ │ ← FAB 56dp, glow │ │ + │ │ │ └────┘ │ └──────────────────────────────┘ AddMilestoneSheet (bottom modal): ┌──────────────────────┐ │ ── │ │ Add Milestone │ ├──────────────────────┤ │ Title │ │ ┌────────────────┐ │ │ │ │ │ │ └────────────────┘ │ │ Date │ │ ┌────────────────┐ │ │ │ 📅 Pick date │ │ ← mở NeonCalendarDialog │ └────────────────┘ │ │ Caption (optional) │ │ ┌────────────────┐ │ │ │ │ │ │ └────────────────┘ │ │ ╔════════════════╗ │ │ ║ Save ║ │ │ ╚════════════════╝ │ └──────────────────────┘ ``` ### 6.14 Gallery (Gallery tab) - **Header (động):** Có 2 mode: - **Normal:** title "GALLERY" (uppercase). - **Selection mode** (sau khi long-press): nút close + số item đã chọn + icon delete (đỏ) bên phải. - **Content:** `GalleryGrid` lưới ảnh thumbnail. Long-press → selection mode. - **Empty state:** Message + CTA "Create Now" khi gallery rỗng. - **FAB:** Góc dưới-phải (chỉ hiện khi có item và không ở selection mode), NeonPink, icon `+` → mở Style Browser. ``` Normal mode: ┌──────────────────────────────┐ │ GALLERY │ ├──────────────────────────────┤ │ ┌──────┐ ┌──────┐ ┌──────┐ │ │ │ img │ │ img │ │ img │ │ │ └──────┘ └──────┘ └──────┘ │ │ ┌──────┐ ┌──────┐ ┌──────┐ │ │ │ img │ │ img │ │ img │ │ │ └──────┘ └──────┘ └──────┘ │ │ ┌──────┐ ┌──────┐ │ │ │ img │ │ img │ │ │ └──────┘ └──────┘ │ │ │ │ ┌────┐ │ │ │ + │ │ ← FAB │ └────┘ │ └──────────────────────────────┘ Selection mode: ┌──────────────────────────────┐ │ ✕ 3 selected 🗑 │ ├──────────────────────────────┤ │ ╔══════╗ ┌──────┐ ╔══════╗ │ │ ║ img✓ ║ │ img │ ║ img✓ ║ │ │ ╚══════╝ └──────┘ ╚══════╝ │ │ ┌──────┐ ╔══════╗ ┌──────┐ │ │ │ img │ ║ img✓ ║ │ img │ │ │ └──────┘ ╚══════╝ └──────┘ │ └──────────────────────────────┘ ``` ### 6.15 Saved Result (sau khi save thành công) - **Top:** Emoji 🎉 48sp + success title 26sp bold + subtitle 14sp. - **Image:** Ảnh kết quả ở giữa, crop fit, viền NeonPink 1.5dp, chiếm flex weight. - **Actions:** - Full-width button **"Share"** (NeonPink gradient). - Row 2 button outlined dưới: **"Gallery"** (CyberAqua border) + **"Create Another"** (grey border). - Bottom padding 32dp. ``` ┌──────────────────────────────┐ │ 🎉 │ ← 48sp │ Saved Successfully │ ← 26sp bold │ You can find it in Gallery │ ← 14sp ├──────────────────────────────┤ │ │ │ ┌────────────────────┐ │ │ │ [Result Image] │ │ ← NeonPink border 1.5dp │ │ │ │ │ └────────────────────┘ │ │ │ ├──────────────────────────────┤ │ ╔═════════════════════════╗ │ │ ║ ↗ Share ║ │ ← NeonPink gradient │ ╚═════════════════════════╝ │ │ ┌──────────┐ ┌──────────┐ │ │ │ Gallery │ │ Create │ │ ← outlined │ │ (cyan) │ │ Another │ │ │ └──────────┘ └──────────┘ │ └──────────────────────────────┘ ``` ### 6.16 Settings - **SettingsHeader:** Back button + title "SETTINGS" uppercase. - **ProfileCard:** Card đầu — 2 avatar gradient chồng nhau + tên cặp đôi + badge **PRO** (nếu Premium). Tap → Couple Profile. - **SettingsCard sections:** 1. **Language** (hiện ngôn ngữ hiện tại) + **Notifications** (toggle switch). 2. **Rate** / **Share** / **Terms of Service** / **Privacy Policy** — đều có chevron `>`. 3. **Version footer** (text nhỏ). - Card có nền SurfaceDark, border 1dp. - Rate dùng popup của Apero Module Rate (5 sao + comment). ``` ┌──────────────────────────────┐ │ ← SETTINGS │ ├──────────────────────────────┤ │ ┌──────────────────────────┐ │ │ │ (◔)(◔) Alex & Mia PRO │ │ ← ProfileCard │ │ Tap to edit > │ │ │ └──────────────────────────┘ │ ├──────────────────────────────┤ │ ┌──────────────────────────┐ │ │ │ 🌐 Language EN > │ │ │ │ 🔔 Notifications ⬤── │ │ ← toggle │ └──────────────────────────┘ │ ├──────────────────────────────┤ │ ┌──────────────────────────┐ │ │ │ ⭐ Rate App > │ │ │ │ ↗ Share App > │ │ │ │ 📄 Terms of Service > │ │ │ │ 🔒 Privacy Policy > │ │ │ └──────────────────────────┘ │ │ │ │ Version 1.1.0 │ └──────────────────────────────┘ Rate Popup (Apero Module Rate): ┌────────────────────┐ │ Rate AI Couple │ │ │ │ ☆ ☆ ☆ ☆ ☆ │ │ │ │ ╔════════════════╗ │ │ ║ Submit ║ │ │ ╚════════════════╝ │ │ Later │ └────────────────────┘ ``` ### 6.17 Paywall - **Top Half (50% chiều cao):** Hero image full width, crop. - **Close Button:** Góc trên-phải (36dp circle, nền semi-transparent, border). - **Bottom Half (overlay gradient transparent → VoidBlack):** - Title **"UNLOCK PRO"** 32sp bold. - Subtitle 15sp. - **2 PriceCards** (Weekly + Yearly) — layout ngang: tên gói + chu kỳ trái, giá + per-month phải. Card chọn = NeonGradient border + tinted background. - Badge **"BEST VALUE"** đính trên card Yearly. - **Benefits section:** 4 dòng dấu ✓. - **Continue button:** NeonGradient, có pulsing scale animation. - "Cancel anytime" text nhỏ. - Row link **Terms · Privacy** ở giữa. - Lưu ý: **chỉ có 2 gói** (Weekly + Yearly), không có Monthly. ``` ┌──────────────────────────────┐ │ ┌──────────────────────────┐ │ │ │ ✕ │ │ │ │ [Hero Image] │ │ ← 50% chiều cao │ │ crop │ │ │ │ │ │ │ └──────────────────────────┘ │ │ ░░░░░ gradient overlay ░░░ │ ├──────────────────────────────┤ │ UNLOCK PRO │ ← 32sp bold │ Create unlimited magic │ ← 15sp │ │ │ ┌──────────────────────┐ │ │ │ Weekly $4.99/wk │ │ │ └──────────────────────┘ │ │ ┏━━━━━━━━━━━━━━━━━━━━━━┓BEST│ │ ┃ Yearly $29.99/yr┃VALUE│ ← gradient border │ ┃ ~$2.50/mo┃ │ │ ┗━━━━━━━━━━━━━━━━━━━━━━┛ │ │ │ │ ✓ Unlimited generations │ │ ✓ No ads │ │ ✓ HD download │ │ ✓ Exclusive styles │ │ │ │ ╔═════════════════════════╗ │ │ ║ Continue ║ │ ← pulsing animation │ ╚═════════════════════════╝ │ │ Cancel anytime │ │ Terms · Privacy │ └──────────────────────────────┘ ``` ### 6.18 Daily Engagement Fullscreen Notification - **Layout:** Activity fullscreen kiểu lock-screen (XML layout `activity_daily_engagement_fullscreen`). - **Time Display:** Giờ / phút / ngày hiển thị ở các góc kiểu lock-screen. - **Hero Image:** Ảnh teaser lớn ở giữa (1 trong 8 ảnh `daily_engagement_lock_img_*.webp`). - **Text:** Title + body bên dưới hero. - **Close Button:** Icon X góc trên-phải → dismiss notification + finish activity. - **Tap anywhere else:** Launch `SplashActivity` (mở app). ``` ┌──────────────────────────────┐ │ 20:45 ✕ │ ← time | close │ Mon, 19 May │ │ │ │ ┌────────────────────┐ │ │ │ │ │ │ │ [Hero Teaser] │ │ ← 1/8 webp │ │ daily_engagement │ │ │ │ _lock_img_N.webp │ │ │ │ │ │ │ └────────────────────┘ │ │ │ │ Your daily couple │ │ moment is ready ✨ │ │ Tap to create now │ │ │ │ ───────────────────────── │ │ Tap anywhere → SplashActivity│ └──────────────────────────────┘ ``` --- ## Tổng kết PO quan tâm | Hạng mục | Số lượng / Mô tả | | --------------------- | ------------------------------------------------------------------ | | Tính năng mới | 5 (Daily Notification, Shortcut+Uninstall, Photo Picker, Qwen, Calendar) | | AI service mới | Qwen Editing | | SDK upgrade | First Open 4.3.0, Ads 9.0.4, Rate (Apero Module Rate mới) | | Ngôn ngữ rà soát text | 10 (DE, ES, FR, HI, JA, KO, PT, TH, VI, ZH) | | UI redesign | Home, Future Baby, Style Browser, Generating, Calendar | --- ## Lưu ý cho PO / QA - Cần QA full flow First-Open (Splash → Language → Onboarding) sau khi nâng SDK 4.3.0 trên tất cả locale đã rà soát strings. - Cần verify Daily Engagement Notification hoạt động đúng schedule và có tracking event đầy đủ. - Cần kiểm tra Uninstall Survey trigger đúng khi user gỡ app. - Cần verify Ad IDs production trước khi release. ## Unresolved questions - Có cần viết changelog public (Play Console release notes) song song không? - Daily Engagement Notification đã có analytics event tracking chưa? - Qwen service đã có quota / fallback khi fail chưa?