Skip to main content

Progress Notes

Date: 2026-04-05

Mobile Menu X Button + CTA Button Refinements​

Fixed two critical mobile UX issues and refined all CTA buttons across the site:

Mobile menu close button​

  • Added a header bar to the mobile menu overlay with "Menu" label and X close button
  • X button uses consistent h-10 w-10 icon button sizing
  • Menu now properly closable on mobile devices

CTA button refinements (all pages)​

  • Support page: Dark gradient CTA card with icon buttons (email + user guide)
  • Checkout success/cancel: Icon buttons with gap-2, py-3.5, font-semibold, hover lift
  • Returns/Shipping: Gradient card CTA with icon buttons, consistent sizing
  • All buttons standardized to: inline-flex items-center justify-center gap-2 rounded-full px-8 py-3.5 text-sm font-semibold hover:-translate-y-0.5 hover:shadow-lg

Verification and deployment​

  • Local npm run build passed.
  • Committed as fc3c47c on main.
  • SOP followed: deploy:preflight → deploy:scope-check → commit/push → VM deploy → deploy:verify.
  • npm run deploy:verify passed: 7/7 checks passed, 0 failed.

Date: 2026-04-05

Full-Site UI Refinement (Design System Convergence)​

This round delivered a comprehensive visual refinement across all public-facing pages, elevating the site to a polished, professional consumer electronics brand standard. All changes are presentation-only — no auth, API, payment, or business logic modified.

Design system upgrades​

  • tailwind.config.ts: Added semantic colors (success/warning/danger/info), shadow tiers (card-hover, elevated, glow-teal), 8 animation keyframes (shimmer, float, pulse-soft, scale-in, checkmark)
  • globals.css: Added global CSS utilities — .reveal scroll-triggered fade-in, .card-hover-lift hover lift, .nav-link-hover underline animation, .btn-shimmer button shine effect
  • components/commerce.tsx: FeatureCard with gradient icon backgrounds + hover glow, FaqList with +/× rotation animation, SpecGrid with hover border highlight
  • components/site-footer.tsx: Refined spacing, hover transitions, simplified link labels

CommerceShell header (Apple-inspired)​

  • Compact h-22 (88px) frosted glass header
  • Apple-style two-line hamburger icon with X animation on mobile
  • Full-screen search overlay with magnifying glass icon — indexes 15 site entries (products, services, support, docs, policies)
  • Icon-only action buttons (search, cart, account) with consistent h-10 w-10 sizing
  • User avatar circle with initial for signed-in state
  • Mobile menu: full-screen overlay with list-style nav and border separators

Page-by-page refinements​

  • Homepage: Gradient title text, shimmer CTA button, floating badge animation, card hover lift, service cards with SVG icons, CTA gradient background
  • Product page: Image zoom on hover, trust indicators with icons, deployment scenario cards with hover scale, Who it is/isn't for with check/X icons, service cards with SVG icons
  • Services (4 pages): Standardized rounded-2xl, font-bold instead of font-black, tracking-[0.2em], card-hover-lift, shadow tiers
  • Account center (7 pages): Stats as cards instead of border-l, personal details wrapped in card, empty states refined, order cards with hover lift
  • Support/Contact/Cart/Checkout (10 pages): Unified visual language, button transitions, rounded-2xl standardization
  • Shipping/Returns/Technology (5 pages): Policy page refinement, consistent spacing and typography

Global standardization​

  • rounded-[2rem] → rounded-2xl (standardized corner radius)
  • font-black → font-bold/semibold (refined font weight)
  • tracking-[0.4em] → tracking-[0.2em] (consistent letter-spacing)
  • All interactive elements: transition-all duration-200
  • Cards: card-hover-lift + hover:shadow-card-hover

Verification and deployment​

  • Local npm run build passed.
  • Committed as 3e3859a on main.
  • Deployed to VM via gcloud compute ssh.
  • npm run deploy:verify passed: 7/7 checks passed, 0 failed.

Date: 2026-04-05 (Icon Accuracy Fix)

Icon Accuracy Fix​

Fixed mismatched icons reported after the UI refinement round:

  • 4G LTE icon: Was using Wi-Fi arcs icon → replaced with phone/cellular tower icon
  • Support page icons: Order Tracking (clipboard), Technical Support (lightning bolt), Returns & Policy (sync arrows)
  • Applied to both product page connectivity section and service cards section

Verification and deployment​

  • Local npm run build passed.
  • Committed as 9cebb29 on main.
  • Deployed to VM via gcloud compute ssh.
  • npm run deploy:verify passed: 7/7 checks passed, 0 failed.

Date: 2026-04-05 (Apple-Style Navigation + Site Search)

Apple-Style Navigation Bar + Site Search​

Replaced the previous three-line hamburger with an Apple-inspired compact navigation:

  • Header: h-22 (88px) frosted glass bar, Apple-style layout (logo left, nav center, actions right)
  • Mobile menu: Two-line icon → X animation, full-screen overlay with list-style nav
  • Site search: Magnifying glass icon, fullscreen search overlay with 15-entry index covering products, services, support, docs, and policies
  • Action buttons: Consistent h-10 w-10 icon buttons for search, cart, account
  • Desktop nav: Centered links with subtle hover, Apple-style spacing

Verification and deployment​

  • Local npm run build passed.
  • Committed as 91f30e3 on main.
  • Deployed to VM via gcloud compute ssh.
  • npm run deploy:verify passed: 7/7 checks passed, 0 failed.

Date: 2026-04-05 (Header Unification Across Signed-In/Out States)

Unified Header Height (h-22) and Font Styles​

Fixed the inconsistency where signed-in and signed-out states had different navigation bar sizes and font styles:

  • CommerceShell (signed-out): h-22, text-[13px] font-medium nav links
  • AccountLayoutShell (new component): Created unified account layout matching CommerceShell
    • Mobile: h-22 header + h-22 sub-nav bar, text-[13px] font-medium tabs
    • Desktop: h-22 logo bar, text-[13px] font-medium sidebar nav
    • Consistent logo size (h-7), icon buttons (h-10 w-10)
  • Fixed double-shell bug: /account/orders/[id] was wrapping in both CommerceShell and AccountLayoutShell — removed CommerceShell wrapper
  • tailwind.config.ts: Added h-22 = 5.5rem custom height

Verification and deployment​

  • Local npm run build passed.
  • Committed as 5e61d34 on main.
  • SOP followed: deploy:preflight → deploy:scope-check → commit/push → VM deploy → deploy:verify.
  • npm run deploy:verify passed: 7/7 checks passed, 0 failed.

Date: 2026-04-05

Cloudflare-Layer 301 Redirects & SEO Domain Migration​

Implemented a production-grade redirection strategy for legacy/regional domains at the Cloudflare edge, ensuring zero-latency jumps and 100% path/query preservation without touching application code.

Redirection Implementation (Cloudflare Rules)​

  • Domains affected: aovis.us and aovis.uk (including www subdomains).
  • Target: https://aovis.app (Primary SEO Domain).
  • Method: Cloudflare Dynamic Redirect Rules (HTTP Request Dynamic Redirect).
  • Logic: concat("https://aovis.app", http.request.uri.path) with preserve_query_string: true.
  • Status Code: 301 Moved Permanently.
  • Edge Bypass: These redirects occur at the Cloudflare global edge, bypassing the Origin VM entirely to improve speed and SEO signal strength.

DNS Infrastructure Adjustments​

  • aovis.us / aovis.uk: Added Proxied (Orange-clouded) A records for @ (pointing to 192.0.2.1 placeholder) and CNAME for www.
  • Mail Integrity: Audited all MX, SPF, DKIM, and DMARC records for aovis.us. Confirmed 100% intact and unaffected (NetEase Mail system remains primary).
  • Internal Subdomains: Confirmed aitest.aovis.us, internal.aovis.us, monitor.aovis.us, and news.aovis.us are untouched and operational.

SEO & Sitemap Audit (Non-Destructive)​

  • Sitemap Verification: https://aovis.app/sitemap.xml returns 200, contains 18 cleaned URLs, and correctly excludes all legacy domains (.us/.uk).
  • Canonical Audit: Sampled HTML of key pages (Home, Technology, Products, FAQ). Confirmed <link rel="canonical"> correctly points to the https://aovis.app version of each page.
  • Robots.txt: Verified sitemap declaration and crawler directives are correctly configured for the .app domain.

Verification Results​

  • curl -I https://aovis.us/path?q=1 → 301 to https://aovis.app/path?q=1 (Success)
  • curl -I https://aovis.uk/ → 301 to https://aovis.app/ (Success)
  • curl -I https://aovis.app/ → 200 OK (Primary Site Stable)

Company / Brand / Domain / Service Architecture Record​

This block records the stable legal and operational hierarchy currently used by AOVIS so future content, legal, payment, and support changes stay aligned.

  • Fifth Key Element Co., Limited
  • Jurisdiction: Hong Kong

Brand​

  • AOVIS

Domain System​

  • aovis.app — official main site, service platform, account system, and legal pages
  • aovis.us — United States regional domain and email domain
  • aovis.uk — United Kingdom regional domain

Email System​

Service System​

  • Hardware — camera products
  • Cloud Storage — subscription service
  • Cellular Data — subscription service
  • AI Video — future service tier

Platform Integrations​

  • Stripe
  • Google Sign-In
  • Apple Sign-In
  • DMCA handling
  • Amazon

Naming Clarification​

  • account-staging-test is the local workspace / repository name and is historical in nature.
  • aovis-store-staging-vm, aovis-db-staging-vm, and /opt/aovis/aovis-store-staging are current infrastructure identifiers and are kept for operational stability.
  • store-staging.aovis.app and similar old staging domains are historical references only.
  • Product-facing and support-facing language should default to aovis.app as the official platform, with aovis.us / aovis.uk as regional domains.
  • In admin UI copy, prefer internal / 内部 over staging when the label is meant to describe console scope rather than deployment history.