#11 App Navigation Flow — SYNITY BSC 2026

Section 1

1. Thanh điều hướng Desktop

Top navigation bar chung cho toàn app

synity-bsc.app/wizard/step/4

Home Builder Bước 4: Mục tiêu chiến lược

Tiến trình xây dựng BSC

Hồ sơ DN

Chiến lược

Chủ đề CL

Mục tiêu

Bản đồ

KPIs

Sáng kiến

Tổng kết

→ Active mode

Active mode có background highlight màu xanh. Click để chuyển chế độ; trạng thái lưu khi quay lại.

→ Completed steps

Steps 1–3 có icon ✓ màu xanh lá, clickable để quay lại chỉnh sửa bất kỳ lúc nào.

→ Locked steps

Steps 5–8 disabled cho đến khi hoàn thành step trước đó. Hover hiện tooltip giải thích.

Section 2

2. Chuyển đổi Builder ↔ Dashboard

Luồng chuyển từ xây dựng sang theo dõi

📊 Builder — Bước 8: Tổng kết

8/8

BSC của bạn đã sẵn sàng!

Xem lại toàn bộ cấu trúc trước khi chuyển sang theo dõi.

14 mục tiêu 30 KPIs 6 sáng kiến

BSC của bạn đã sẵn sàng theo dõi

Chuyển

chế độ

📈 Dashboard — CEO War Room

Hiệu suất

78%

KPIs xanh

18/30

Cảnh báo

4

FIN — Tài chính82%

CUS — Khách hàng65%

Chỉnh sửa mục tiêu, KPI, sáng kiến

→ Khi chuyển sang Dashboard

Builder lưu trạng thái. URL thay đổi từ /wizard/step/8 → /dashboard. Dữ liệu BSC tự động load.

→ Quay lại Builder

Từ Dashboard có thể quay về Builder để chỉnh sửa. Sau khi lưu, Dashboard tự refresh dữ liệu.

Section 3

3. Điều hướng Mobile

Hamburger menu + drawer cho màn hình nhỏ

Trạng thái thu gọn

S

SYNITY BSC

📊 Builder — Đang thực hiện

Bước 4: Mục tiêu chiến lược

Thêm mục tiêu chiến lược

Phối cảnh: Tài chính

Nhập mục tiêu...

✓

FIN1: Tăng doanh thu

✓

FIN2: Giảm chi phí

●

CUS1: Tăng NPS

4 / 8

Tap ☰ để mở drawer
điều hướng đầy đủ

Drawer đã mở

S

SYNITY BSC Expert

📊 Builder Đang dùng

✓ Bước 1: Hồ sơ DN

✓ Bước 2: Chiến lược

✓ Bước 3: Xây dựng CL

● Bước 4: Mục tiêu hiện tại

🔒 Bước 5: Bản đồ

🔒 Bước 6: KPIs

🔒 Bước 7: Sáng kiến

🔒 Bước 8: Tổng kết

📈 Dashboard

⚙️ Cài đặt

CD

Chinh D.

SYNITY Technology

SYNITY BSC

Tap ✕ hoặc overlay
để đóng drawer

→ Slide animation

Drawer trượt từ trái vào (translateX), có overlay backdrop. Duration 300ms ease-in-out.

→ Bottom step navigation

Mobile có thêm Prev/Next bar ở cuối trang để điều hướng nhanh giữa các bước mà không cần mở drawer.

Section 4

4. Liên kết chéo Dashboard ↔ Builder

Click từ Dashboard về đúng bước trong Builder để chỉnh sửa

📊 🔴 63%

Doanh thu hàng tháng

126tr / 200tr

Owner: Chinh D.

Cập nhật: 09/03/2026

Chỉnh sửa trong Builder → Bước 6: KPIs

🎯 ✅ Đúng tiến độ

FIN1: Tăng doanh thu lên 2.4 tỷ

3 KPIs 2 Sáng kiến Tăng trưởng

Phối cảnh: Tài chính (FIN)

72%

Xem trên Bản đồ Chiến lược → Bước 5

🚀 ⏳ 25%

Triển khai CRM Bitrix24

Sáng kiến Q1/2026

Budget 50tr / 200tr

Tiến độ 25%

Owner: Team IT

Chỉnh sửa trong Builder → Bước 7: Sáng kiến

→ Deep-linking vào Builder

Mỗi element trên Dashboard có link trực tiếp đến bước tương ứng trong Builder. URL pattern: /wizard/step/6?focus=kpi_id_123. Builder tự scroll đến item cần chỉnh sửa.

Section 5

5. Tóm tắt trạng thái điều hướng

Ma trận trạng thái theo ngữ cảnh người dùng

Trạng thái người dùng	📊 Builder	📈 Dashboard	⚙️ Settings	URL Pattern
BSC chưa tạo Lần đầu đăng nhập	Active (default) Mở step 1	Disabled Hiển thị tooltip hướng dẫn	Accessible	/wizard/step/1
Đang xây dựng BSC Steps 1–7 chưa hoàn thành	Active, step X/8 Tiếp tục từ step hiện tại	Preview mode Xem được, không đủ dữ liệu	Accessible	/wizard/step/:id
BSC hoàn thành Step 8 đã submit	Accessible (edit) Có thể quay lại chỉnh sửa	Active (default) Trang chủ mặc định	Accessible	/dashboard
Chỉnh sửa từ Dashboard Deep-link từ Dashboard item	Active, step cụ thể Scroll đến item đích	Background Quay lại sau khi lưu	Accessible	/wizard/step/:id?focus=:itemId

URL Patterns

/wizard/step/:id Builder, step 1–8

/dashboard CEO War Room

/dashboard/perspective/:key Dashboard theo phối cảnh

/settings Cài đặt hệ thống

Navigation Guards

⚠

Rời Builder với thay đổi chưa lưu → Hiện dialog xác nhận

🔒

Truy cập Dashboard khi BSC chưa có → Redirect về Builder step 1

↩

Back button từ Dashboard → Restore vị trí cuối cùng trong Builder

✓

Settings accessible từ mọi chế độ, không cần BSC hoàn thành