
JPREP - OneSource
Tổng quan
OneSource là hệ thống Quản trị Nội dung và Điều phối Học liệu đa kênh, phục vụ trực tiếp cho các nền tảng như Ouchi Eigo, Juku Kids và CAPS. Trọng tâm của hệ thống là giải quyết bài toán đồng bộ hóa và quản lý khối lượng khổng lồ tài nguyên giáo dục thông qua các phân hệ phức tạp như Authoring, Test Bank và kho Materials bao gồm Multimedia, Learning Item.
Ngày bắt đầu
Khách hàng
JPREP
Khởi động
Thách thức ban đầu: Từ 30 dòng ý tưởng đến một CMS đồ sộ
Khởi đầu của dự án OneSource là một giai đoạn đầy thử thách khi tôi phải tác chiến gần như hoàn toàn độc lập. Ở thời điểm đó, dự án chưa có tài liệu đặc tả (Spec) rõ ràng, vai trò BrSE (kỹ sư cầu nối) ban đầu cũng chưa được thiết lập chính thức, mà chỉ là những trao đổi khá hời hợt để truyền đạt lại ý muốn của khách hàng Nhật. Hành trang duy nhất của tôi là một bản nháp ý tưởng vỏn vẹn khoảng 30 dòng.

Bài toán đặt ra là: Làm sao để biến những ý tưởng lộn xộn, rời rạc đó thành một hệ thống Authoring chuyên nghiệp, có khả năng quản lý khối lượng học liệu khổng lồ với cấu trúc 4 tầng phân cấp từ Material, Unit, Section đến Component? Nếu chỉ thiết kế màn hình đơn thuần, hệ thống sẽ nhanh chóng vỡ vụn khi scale lên các nghiệp vụ phức tạp hơn.
Giải pháp kiến trúc: Tách bạch luồng dữ liệu (Structure Setting & Edit Textbook)
Sau nhiều ngày đào sâu phân tích logic và bóc tách từng luồng nghiệp vụ, tôi nhận ra điểm mấu chốt để hệ thống có thể vận hành trơn tru là phải tách biệt hoàn toàn việc "Định nghĩa bộ khung" và "Thao tác nhập liệu". Từ suy luận đó, tôi đã kiến trúc lại luồng biên soạn (Authoring Workflow) thành hai phân vùng chính:
Structure Setting: Đây là nơi người dùng thiết lập bộ khung tổng thể, quản lý mục lục (Table of Contents) và định nghĩa các template cấu trúc cho Unit. Việc tách riêng phần này giúp quản lý chặt chẽ các Edition Group (nhóm phiên bản) mà không làm rối dữ liệu nội dung.

Edit Textbook: Đây là không gian làm việc (workspace) chính. Dựa trên các template đã được định nghĩa từ Structure Setting, người dùng sẽ tiến hành nhập liệu và liên kết với các module tài nguyên như Free text, Test Bank (TB), hoặc Word Bank (WB).

Sự phân tách logic này đã giải quyết triệt để bài toán chồng chéo dữ liệu, giúp luồng đi từ danh sách giáo trình (Textbook List) qua thiết lập (Structure Setting) và cuối cùng đến chỉnh sửa (Edit Textbook) trở nên cực kỳ mạch lạc và dễ dàng mở rộng.
Kết quả và Tác động: Trở thành nền tảng cho tài liệu Spec chính thức
Bản thiết kế nháp và luồng logic kiến trúc này đã hoàn toàn thuyết phục được khách hàng. Thay vì tôi phải làm theo Spec, chính khách hàng đã sử dụng kiến trúc thiết kế của tôi làm nền tảng để hoàn thiện toàn bộ tài liệu đặc tả chính thức cho dự án. Tuyệt vời hơn, dựa trên bộ khung logic vững chắc mà tôi đã vạch ra, khách hàng sau đó đã sử dụng AI (Claude Sonnet) để sinh ra các bản wireframe HTML mở rộng, bổ sung thêm các tính năng phức tạp một cách chuẩn xác.

Đó là giai đoạn tiêu tốn nhiều trí lực nhất, nhưng cũng khẳng định rõ nhất vai trò dẫn dắt sản phẩm của tôi, vượt ra khỏi giới hạn của một UI/UX Designer thông thường để thực sự trở thành người thiết kế hệ thống.
Quy trình thiết kế
Làm việc trong một dự án lớn nhưng lại thiếu vắng tài liệu đặc tả từ đầu là một phép thử lớn về khả năng tự chủ.
Ở giai đoạn đầu, cấu trúc team chưa định hình rõ ràng, các thông tin tôi nhận được chủ yếu thông qua những cuộc trao đổi ngắn ngủi với BrSE Tam.
Vai trò của cô ấy lúc bấy giờ thiên về việc nỗ lực truyền đạt lại các ý tưởng thô từ phía khách hàng Nhật Bản, nên chưa thể hỗ trợ sâu về mặt phân tích hệ thống. Đứng trước sự thiếu hụt thông tin này, tôi buộc phải linh hoạt thay đổi phương pháp làm việc.
Tôi không thụ động chờ đợi một bản yêu cầu hoàn chỉnh mà chủ động sử dụng các bản thiết kế nháp và sơ đồ logic như một công cụ để giao tiếp ngược lại với khách hàng.
Kiến tạo tiếng nói chung qua ngôn ngữ thiết kế
Thay vì cố gắng làm rõ những đoạn văn bản mơ hồ, tôi biến các ý tưởng rời rạc thành những luồng tương tác trực quan. Khi khách hàng nhìn vào cách tôi phân tách hệ thống thành "Structure Setting" và "Edit Textbook", họ lập tức nắm bắt được vấn đề cốt lõi.
Thiết kế của tôi lúc này đóng vai trò như một ngôn ngữ chung, giúp BrSE Tam dễ dàng giải thích các rủi ro hệ thống với đội ngũ Nhật Bản, đồng thời thuyết phục họ đồng thuận với hướng đi mới. Sự chủ động này đã giúp tôi chuyển đổi vị thế từ một người thực thi đơn thuần thành người trực tiếp dẫn dắt luồng nghiệp vụ của sản phẩm.
Quy trình bàn giao kỹ thuật và Tối ưu hóa cộng tác
Sự chủ động của tôi không chỉ dừng lại ở khâu định hình kiến trúc thông tin mà còn trải dài đến tận bước cuối cùng của quy trình thiết kế là bàn giao sản phẩm cho đội ngũ lập trình. Nhận thức được rằng OneSource là một hệ thống CMS có logic vận hành vô cùng phức tạp, việc chỉ chuyển giao các bản thiết kế giao diện đơn thuần sẽ rất dễ dẫn đến những cách hiểu sai lệch hoặc làm sót các tính năng ẩn.
Để quy trình phối hợp diễn ra hiệu quả, tôi đã thiết lập một hệ thống ghi chú toàn diện và chặt chẽ trực tiếp trên không gian thiết kế. Tại mọi vị trí có phát sinh tương tác phức tạp hoặc có logic nghiệp vụ đặc thù, tôi đều để lại các chỉ dẫn chi tiết về hành vi của UI, các trạng thái thay đổi của dữ liệu và luồng phản hồi của hệ thống.
Đặc biệt, đối với từng cấu phần và màn hình cụ thể, tôi chủ động nhúng trực tiếp đường link dẫn đến tài liệu đặc tả liên quan cùng mã ticket Redmine tương ứng của khách hàng. Cách làm này giúp các kỹ sư lập trình có thể vừa quan sát trực quan giao diện, vừa ngay lập tức đối chiếu được với yêu cầu nghiệp vụ gốc mà không mất thời gian tìm kiếm thủ công giữa các nền tảng quản lý khác nhau.
Sự kỹ lưỡng này đã giúp giảm thiểu đáng kể các cuộc họp giải thích không cần thiết, hỗ trợ đội ngũ phát triển nắm bắt chính xác ý đồ thiết kế và giảm thiểu các sai sót trong giai đoạn triển khai kỹ thuật.

Kết quả & Sự trưởng thành tư duy
Từ ý tưởng thô đến nền tảng kiến trúc vững chắc
Nhìn lại toàn bộ chặng đường, thành quả lớn nhất mà tôi mang lại cho dự án không chỉ dừng lại ở những màn hình thiết kế đẹp mắt. Giá trị cốt lõi nằm ở việc tôi đã đặt được một nền móng kiến trúc thông tin vững chãi cho toàn bộ phân hệ Authoring. Từ một bản yêu cầu nháp mờ nhạt ban đầu, hệ thống đã được định hình cấu trúc rõ ràng với các phân vùng chức năng mạch lạc như Textbook List, Structure Setting, Edit Textbook và Style Set.
Việc khách hàng Nhật Bản sau đó sử dụng chính bộ khung logic của tôi, kết hợp với AI Claude Sonnet để mở rộng ra bộ HTML wireframe chi tiết và hoàn thiện tài liệu đặc tả là minh chứng mạnh mẽ nhất. Họ đã hoàn toàn bị thuyết phục và tin tưởng vào luồng nghiệp vụ mà tôi vạch ra. Tôi đã thành công trong việc biến 30 dòng ý tưởng rời rạc thành một bộ khung dữ liệu có khả năng mở rộng thực sự cho một CMS đồ sộ.
Bài học về Tư duy hệ thống (Systems Thinking)
Dự án OneSource là một bệ phóng giúp tôi mài giũa thứ vũ khí sắc bén hơn mọi công cụ thiết kế: Tư duy hệ thống. Trong một môi trường thiếu hụt thông tin trầm trọng ở giai đoạn đầu, tôi nhận ra vai trò của một Lead UI/UX không phải là cắm cúi vẽ giao diện. Trách nhiệm thực sự là khả năng bóc tách logic, cấu trúc thông tin và phân định rạch ròi các luồng dữ liệu trước khi đặt bất kỳ một pixel nào lên màn hình.
Sự thiếu vắng đặc tả ban đầu và những rào cản giao tiếp không làm tôi chùn bước, ngược lại, nó dạy tôi cách dùng chính bản thiết kế kiến trúc làm ngôn ngữ giao tiếp chung. Nó ép các bên liên quan, từ BrSE đến khách hàng, phải nhìn trực diện vào vấn đề, đánh giá rủi ro và đưa ra quyết định dựa trên nền tảng tôi đã xây dựng.
JPREP - OneSource
Tổng quan
OneSource là hệ thống Quản trị Nội dung và Điều phối Học liệu đa kênh, phục vụ trực tiếp cho các nền tảng như Ouchi Eigo, Juku Kids và CAPS. Trọng tâm của hệ thống là giải quyết bài toán đồng bộ hóa và quản lý khối lượng khổng lồ tài nguyên giáo dục thông qua các phân hệ phức tạp như Authoring, Test Bank và kho Materials bao gồm Multimedia, Learning Item.
Ngày bắt đầu
Khách hàng
JPREP
Khởi động
Thách thức ban đầu: Từ 30 dòng ý tưởng đến một CMS đồ sộ
Khởi đầu của dự án OneSource là một giai đoạn đầy thử thách khi tôi phải tác chiến gần như hoàn toàn độc lập. Ở thời điểm đó, dự án chưa có tài liệu đặc tả (Spec) rõ ràng, vai trò BrSE (kỹ sư cầu nối) ban đầu cũng chưa được thiết lập chính thức, mà chỉ là những trao đổi khá hời hợt để truyền đạt lại ý muốn của khách hàng Nhật. Hành trang duy nhất của tôi là một bản nháp ý tưởng vỏn vẹn khoảng 30 dòng.

Bài toán đặt ra là: Làm sao để biến những ý tưởng lộn xộn, rời rạc đó thành một hệ thống Authoring chuyên nghiệp, có khả năng quản lý khối lượng học liệu khổng lồ với cấu trúc 4 tầng phân cấp từ Material, Unit, Section đến Component? Nếu chỉ thiết kế màn hình đơn thuần, hệ thống sẽ nhanh chóng vỡ vụn khi scale lên các nghiệp vụ phức tạp hơn.
Giải pháp kiến trúc: Tách bạch luồng dữ liệu (Structure Setting & Edit Textbook)
Sau nhiều ngày đào sâu phân tích logic và bóc tách từng luồng nghiệp vụ, tôi nhận ra điểm mấu chốt để hệ thống có thể vận hành trơn tru là phải tách biệt hoàn toàn việc "Định nghĩa bộ khung" và "Thao tác nhập liệu". Từ suy luận đó, tôi đã kiến trúc lại luồng biên soạn (Authoring Workflow) thành hai phân vùng chính:
Structure Setting: Đây là nơi người dùng thiết lập bộ khung tổng thể, quản lý mục lục (Table of Contents) và định nghĩa các template cấu trúc cho Unit. Việc tách riêng phần này giúp quản lý chặt chẽ các Edition Group (nhóm phiên bản) mà không làm rối dữ liệu nội dung.

Edit Textbook: Đây là không gian làm việc (workspace) chính. Dựa trên các template đã được định nghĩa từ Structure Setting, người dùng sẽ tiến hành nhập liệu và liên kết với các module tài nguyên như Free text, Test Bank (TB), hoặc Word Bank (WB).

Sự phân tách logic này đã giải quyết triệt để bài toán chồng chéo dữ liệu, giúp luồng đi từ danh sách giáo trình (Textbook List) qua thiết lập (Structure Setting) và cuối cùng đến chỉnh sửa (Edit Textbook) trở nên cực kỳ mạch lạc và dễ dàng mở rộng.
Kết quả và Tác động: Trở thành nền tảng cho tài liệu Spec chính thức
Bản thiết kế nháp và luồng logic kiến trúc này đã hoàn toàn thuyết phục được khách hàng. Thay vì tôi phải làm theo Spec, chính khách hàng đã sử dụng kiến trúc thiết kế của tôi làm nền tảng để hoàn thiện toàn bộ tài liệu đặc tả chính thức cho dự án. Tuyệt vời hơn, dựa trên bộ khung logic vững chắc mà tôi đã vạch ra, khách hàng sau đó đã sử dụng AI (Claude Sonnet) để sinh ra các bản wireframe HTML mở rộng, bổ sung thêm các tính năng phức tạp một cách chuẩn xác.

Đó là giai đoạn tiêu tốn nhiều trí lực nhất, nhưng cũng khẳng định rõ nhất vai trò dẫn dắt sản phẩm của tôi, vượt ra khỏi giới hạn của một UI/UX Designer thông thường để thực sự trở thành người thiết kế hệ thống.
Quy trình thiết kế
Làm việc trong một dự án lớn nhưng lại thiếu vắng tài liệu đặc tả từ đầu là một phép thử lớn về khả năng tự chủ.
Ở giai đoạn đầu, cấu trúc team chưa định hình rõ ràng, các thông tin tôi nhận được chủ yếu thông qua những cuộc trao đổi ngắn ngủi với BrSE Tam.
Vai trò của cô ấy lúc bấy giờ thiên về việc nỗ lực truyền đạt lại các ý tưởng thô từ phía khách hàng Nhật Bản, nên chưa thể hỗ trợ sâu về mặt phân tích hệ thống. Đứng trước sự thiếu hụt thông tin này, tôi buộc phải linh hoạt thay đổi phương pháp làm việc.
Tôi không thụ động chờ đợi một bản yêu cầu hoàn chỉnh mà chủ động sử dụng các bản thiết kế nháp và sơ đồ logic như một công cụ để giao tiếp ngược lại với khách hàng.
Kiến tạo tiếng nói chung qua ngôn ngữ thiết kế
Thay vì cố gắng làm rõ những đoạn văn bản mơ hồ, tôi biến các ý tưởng rời rạc thành những luồng tương tác trực quan. Khi khách hàng nhìn vào cách tôi phân tách hệ thống thành "Structure Setting" và "Edit Textbook", họ lập tức nắm bắt được vấn đề cốt lõi.
Thiết kế của tôi lúc này đóng vai trò như một ngôn ngữ chung, giúp BrSE Tam dễ dàng giải thích các rủi ro hệ thống với đội ngũ Nhật Bản, đồng thời thuyết phục họ đồng thuận với hướng đi mới. Sự chủ động này đã giúp tôi chuyển đổi vị thế từ một người thực thi đơn thuần thành người trực tiếp dẫn dắt luồng nghiệp vụ của sản phẩm.
Quy trình bàn giao kỹ thuật và Tối ưu hóa cộng tác
Sự chủ động của tôi không chỉ dừng lại ở khâu định hình kiến trúc thông tin mà còn trải dài đến tận bước cuối cùng của quy trình thiết kế là bàn giao sản phẩm cho đội ngũ lập trình. Nhận thức được rằng OneSource là một hệ thống CMS có logic vận hành vô cùng phức tạp, việc chỉ chuyển giao các bản thiết kế giao diện đơn thuần sẽ rất dễ dẫn đến những cách hiểu sai lệch hoặc làm sót các tính năng ẩn.
Để quy trình phối hợp diễn ra hiệu quả, tôi đã thiết lập một hệ thống ghi chú toàn diện và chặt chẽ trực tiếp trên không gian thiết kế. Tại mọi vị trí có phát sinh tương tác phức tạp hoặc có logic nghiệp vụ đặc thù, tôi đều để lại các chỉ dẫn chi tiết về hành vi của UI, các trạng thái thay đổi của dữ liệu và luồng phản hồi của hệ thống.
Đặc biệt, đối với từng cấu phần và màn hình cụ thể, tôi chủ động nhúng trực tiếp đường link dẫn đến tài liệu đặc tả liên quan cùng mã ticket Redmine tương ứng của khách hàng. Cách làm này giúp các kỹ sư lập trình có thể vừa quan sát trực quan giao diện, vừa ngay lập tức đối chiếu được với yêu cầu nghiệp vụ gốc mà không mất thời gian tìm kiếm thủ công giữa các nền tảng quản lý khác nhau.
Sự kỹ lưỡng này đã giúp giảm thiểu đáng kể các cuộc họp giải thích không cần thiết, hỗ trợ đội ngũ phát triển nắm bắt chính xác ý đồ thiết kế và giảm thiểu các sai sót trong giai đoạn triển khai kỹ thuật.

Kết quả & Sự trưởng thành tư duy
Từ ý tưởng thô đến nền tảng kiến trúc vững chắc
Nhìn lại toàn bộ chặng đường, thành quả lớn nhất mà tôi mang lại cho dự án không chỉ dừng lại ở những màn hình thiết kế đẹp mắt. Giá trị cốt lõi nằm ở việc tôi đã đặt được một nền móng kiến trúc thông tin vững chãi cho toàn bộ phân hệ Authoring. Từ một bản yêu cầu nháp mờ nhạt ban đầu, hệ thống đã được định hình cấu trúc rõ ràng với các phân vùng chức năng mạch lạc như Textbook List, Structure Setting, Edit Textbook và Style Set.
Việc khách hàng Nhật Bản sau đó sử dụng chính bộ khung logic của tôi, kết hợp với AI Claude Sonnet để mở rộng ra bộ HTML wireframe chi tiết và hoàn thiện tài liệu đặc tả là minh chứng mạnh mẽ nhất. Họ đã hoàn toàn bị thuyết phục và tin tưởng vào luồng nghiệp vụ mà tôi vạch ra. Tôi đã thành công trong việc biến 30 dòng ý tưởng rời rạc thành một bộ khung dữ liệu có khả năng mở rộng thực sự cho một CMS đồ sộ.
Bài học về Tư duy hệ thống (Systems Thinking)
Dự án OneSource là một bệ phóng giúp tôi mài giũa thứ vũ khí sắc bén hơn mọi công cụ thiết kế: Tư duy hệ thống. Trong một môi trường thiếu hụt thông tin trầm trọng ở giai đoạn đầu, tôi nhận ra vai trò của một Lead UI/UX không phải là cắm cúi vẽ giao diện. Trách nhiệm thực sự là khả năng bóc tách logic, cấu trúc thông tin và phân định rạch ròi các luồng dữ liệu trước khi đặt bất kỳ một pixel nào lên màn hình.
Sự thiếu vắng đặc tả ban đầu và những rào cản giao tiếp không làm tôi chùn bước, ngược lại, nó dạy tôi cách dùng chính bản thiết kế kiến trúc làm ngôn ngữ giao tiếp chung. Nó ép các bên liên quan, từ BrSE đến khách hàng, phải nhìn trực diện vào vấn đề, đánh giá rủi ro và đưa ra quyết định dựa trên nền tảng tôi đã xây dựng.
