Chương 3. Nghiên cứu, xây dựng phần mềm hỗ trợ giảng dạy theo mô hình “vai mẫu” đối với kịch hát dân tộc
3.4 Nghiên cứu, xây dựng hệ thống
3.4.2 Xây dựng hệ thống
Từ những nguyên mẫu đã được xây dựng và đánh giá, học viên tiến hành xây dựng hệ thống.
Học viên lựa chọn công nghệ phát triển hệ thống ứng dụng trên nền tảng web, dùng ngôn ngữ lập trình C# .Net Framework, sử dụng cơ sở dữ liệu SQL Server để lưu trữ dữ liệu, sử dụng các thư viện Java Script cụ thể ở đây là thư viện Three.js để xử lý và biểu diễn dữ liệu 3D lên trình duyệt web, giao diện hệ thống sử dụng Bootstrap v3.3.2,…
Hệ thống hỗ trợ giảng dạy này được xây dựng có đặc điểm khác biệt so với những hệ thống khác ở đặc điểm như: với các hệ thống khác thì mới chỉ dừng ở mức cho phép người dùng nhúng nội dung video 3D từ một hệ thống khác vào bài giảng. Còn đối hệ thống hỗ trợ giảng dạy này được xây dựng cung cấp chức năng cho phép người dùng chủ động quản lý được thư viện nội dung video 3D, cho phép nhúng các video 3D từ thư viện vào bài giảng, chức năng so sánh giữa các video 3D cùng vai diễn nhưng khác người diễn, chức năng so sánh giữa vai diễn trong video 2D với video 3D, các tiện ích xem – dừng – tua – đổi góc nhìn khi xem vở diễn video 3D, đặc biệt là chức năng hỗ trợ biên tập nội dung 3D (đóng gói dữ liệu từ các video 3D khác nhau kết hợp với nhạc nền thành một vở diễn và biểu diễn đồng thời các video 3D đó tại cùng thời điểm trên nền web). Tôi sẽ nói rõ hơn về ý tưởng và cách xử lý trong nội dung trình bày tiếp theo.
Trong quá trình xây dựng hệ thống, mục tiêu của hệ thống là sẽ ứng dụng được công nghệ đa phương tiện đặc biệt là công nghệ 3D vào giảng dạy, vì vậy nội dung 3D sẽ là một phần của hệ thống.
Tuy nhiên việc thu thập và biên tập dữ liệu video 3D là quá trình tốn nhiều thời gian và công sức. Để hiểu rõ hơn về việc biên tập dữ liệu video 3D, tôi xin phác thảo tóm tắt quy trình xây dựng một video 3D vai mẫu.
Bước 1: Thu thập dữ liệu, trích xuất chuyển động của khung xương bằng các thiết bị như sence, kinec.
33
Đầu vào của bước này là diễn viên mặc bộ trang phục có gắn các cảm biến, có kết nối với máy tính. Khi diễn viên chuyển động thì cảm biển sẽ gửi các chuyển
động của diễn viên về máy tính. Đầu ra của bước này là tệp tin dữ liệu khung xương chuyển động với định dạng .bvh, các hình ảnh diễn viên thực tế cùng trang phục, tệp tin dữ liệu âm thanh của quá trình ghi, hình ảnh sân khấu
Bước 2: Sử dụng Human Maker để dựng mô hình người, ở bước này có thể sử dụng những mô hình người có sẵn. Đầu ra của bước này là mô hình người với định dạng .obj
Bước 3: Xây dựng sân khấu, ở bước này dùng các hình ảnh sân khẩu đã thu thập được ở bước 1 và các hình ảnh sân khấu thực tế tham khảo để dựng lên cảnh sân khấu 3D
Bước 4: Sử dụng Blender gắn mô hình người tạo ở bước 2 vào khung xương chuyển động thu được ở bước 1, kết hợp dựng trang phục theo nhân vật cùng với các kỹ thuật phủ da cho mô hình người – (skinning), chỉnh sửa – (modifies), chuyển động vật lý – (physics simulations), để mô hình người và trang phục của nhân vật chuyển động theo khung xương. Kết quả của bước 4 là xuất được ra mô hình vai mẫu 3D chuyển động
Bước 5: Ghép mô hình vai mẫu 3D chuyển động ở bước 4 với sân khấu 3D xây dựng ở bước 3. Kết quả của bước này là xuất ra được vở diễn 3D với định dạng .glb
Khi theo dõi quy trình biên tập nội dung video 3D tôi thấy vấn đề hạn chế ở quy trình này đó là sẽ rất mất thời gian cho việc dựng video 3D, câu hỏi đặt ra là làm thế nào để tiết kiệm được thời gian của người biên tập nội dung, tái sử dụng được các đoạn video 3D đã xây dựng, chuyên biệt hóa từng công đoạn, hệ thống xây dựng lên sẽ giải quyết và hỗ trợ được vấn đề gì cho người biên tập nội dung video 3D?
Ý tưởng chia nhỏ công đọan dựng video 3D thành các cảnh khác nhau, tách các nội dung ra làm các cảnh trong đó mỗi người biên tập nội dung sẽ phụ trách làm một cảnh khác nhau, kết hợp với xử lý nhạc nền của cảnh diễn. Ví dụ: một người làm cảnh sân khấu, những người khác sẽ phân chia việc dựng các nhân vật trong vở diễn, và kết quả cuối cùng là các cảnh diễn 3D của mỗi người sẽ được tải lên hệ thống hỗ trợ giảng dạy, hệ thống sẽ ghép các cảnh diễn lại và biểu diễn thành một video 3D trên nền web. Việc này sẽ giải quyết được vấn đề như giúp tiết kiệm được thời gian xây dựng nội dung 3D, giúp tái sử dụng được các cảnh.
Từ ý tưởng trên, tôi nghiên cứu cách làm sao để hệ thống có thể thực hiện được ý tưởng đó, thể hiện cùng một lúc nhiều đoạn diễn video 3D trên nền web. Qua tìm hiểu tôi thấy hầu như các hệ thống và thư viện hiện tại chỉ hỗ trợ biểu diễn được một tệp tin dữ liệu 3D định dạng .glb tại một thời điểm (giống như khi chúng ta mở một tệp tin video trên chương trình chơi nhạc Windows media player), chưa có hệ thống nào cho phép mở đồng thời nhiều tệp tin video 3D.
Để thực hiện được ý tưởng của hệ thống, tôi cần xử lý việc tổng hợp, đóng gói thông tin của vở diễn và biểu diễn tất cả các cảnh video 3D đó cùng một thời điểm. Đầu tiên tôi nghiên cứu xây dựng chức năng upload tệp tin, chức năng này cho phép khi người dùng upload tệp tin lên hệ thống, hệ thống sẽ tự động phân tích và phân loại kiểu dữ liệu là dữ liệu âm thanh hay dữ liệu các cảnh video 3D - dữ liệu âm thanh ở đây là tệp tin nhạc và tiếng hát của người diễn viên đã được thu lại ở bước 1 trong quy trình xây dựng nội dung video 3D, sau đó đóng gói các thông tin đó lại thành một tệp tin lưu trữ trên máy chủ đồng thời lưu trong cơ sở dữ liệu.
34
Chức năng này hoạt động và xử lý dữ liệu theo luồng sau: khi người dùng nhập các thông tin mô tả như tiêu đề của vở diễn, chọn các tệp dữ liệu của vở diễn (dữ liệu hình ảnh, dữ liệu âm thanh, dữ liệu các cảnh diễn 3D kết quả của quy trình biên tập nội dung video 3D) và chọn lưu, hệ thống sẽ phân tích dữ liệu đầu vào các tệp được chọn có kiểu dữ liệu gì, sau đó tải các tệp tin đó lên thư mục lưu trữ trên máy chủ đồng thời ghi và đóng gói lại thông tin (tên tệp tin, vị trí lưu tệp tin) của các tệp tin đó vào một tệp tin dưới dạng json, tệp tin này sẽ đồng thời được tải lên thư mục lưu trữ trên máy chủ và hệ thống lưu tên tệp tin vào cơ sở dữ liệu, tệp tin json có cấu trúc như sau:
{
"bgm": "<audio_url>",
"gltf": [ "[ <gltf_url> * ]" ] }
Ví dụ:
{
"bgm": "files/3d/suyvan/suyvan.mp3",
"gltf": ["files/3d/suyvan/scene.glb","files/3d/suyvan/scene1.glb"]
}
Trong đó:
bgm: tham số truyền vào là đường dẫn đến tệp tin nhạc nền
gltf: tham số truyền vào là đường dẫn đến các tệp tin video 3D
* : thể hiện là tham số đường dẫn có thể nhiều hơn 1 tệp tin
Sau khi tải dữ liệu lên hệ thống thành công, cấu trúc lưu trữ các tệp tin video 3D được lưu như cây thư mục dưới đây.
Bước tiếp theo là cách biểu diễn các tệp tin cảnh video 3D đã được đóng gói đó ra nền web cùng một thời điểm.
Chức năng này hoạt động và xử lý dữ liệu theo luồng sau: khi người dùng chọn xem video 3D từ thư viện video 3D, hệ thống sẽ lấy thông tin video 3D mà người dùng chọn từ cơ sở dữ liệu, và đưa thông tin tệp tin đã đóng gói vào đoạn script.
<script>
var clip3D = new h3r.Clip(document.getElementById("main"));
let jsonURL = 'files/3d/<%= json%>';
let prog = clip3D.appendJson(jsonURL);
prog.onFinishAll = function () {
totalTime.textContent = formatTime(clip3D.duration);
}
</script>
<script>
function appendJson(url) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) { var serverResponse = this.responseText;
var h3r = JSON.parse(serverResponse);
/** sence video 3d */
35
progress.needDone = h3r.gltf.length;
h3r.gltf.forEach(function (gltf) { appendGLTF(gltf);
});
/** audio */
if (h3r.bgm) {
audio = new Audio(h3r.bgm);
}
console.log(audio);
} }
xhttp.open("GET", url, true);
xhttp.send();
return progress;
}
</script>
Trong đó:
clip: là khai báo mới đối tượng video 3D
h3rURL : là đường dẫn đến tệp tin đóng gói trong chức năng upload tệp tin video 3D
prog: là quá tiến trình mà hệ thống tải các tệp tin lên
Hệ thống sử dụng thư viện Three.js và các hàm mở rộng để biểu diễn tất cả các cảnh trong tệp tin json đã đóng gói. Tệp tin json sẽ được đọc để lấy ra các thông tin của tệp tin nhạc, video 3D sau đó hàm mở rộng sẽ nối chúng vào thành một video 3D đầy đủ và biểu diễn lên trình duyệt web.
Với các chức năng trên, hệ thống đã hiện thực hóa được ý tưởng tổng hợp các cảnh diễn vào một vở diễn và thể hiện cùng lúc các cảnh diễn, giúp giảm được thời gian biên tập nội dung 3D, giúp tái sử dụng được các cảnh diễn.
Ngoài các chức năng hỗ trợ việc biên tập nội dung và biểu diễn cùng lúc nhiều nội dung 3D trên nền web, hệ thống cũng đã cung cấp các chức năng biên soạn bài giảng có hỗ trợ việc nhúng nội dung đa phương tiện và nội dung video 3D vào bài giảng, chức năng biên tập nội dung bài giảng có so sánh giữa các vai diễn trong video 3D với video 3D và giữa video 2D với video 3D, chức năng xem nội dung bài giảng,… dưới đây là một số hình ảnh chụp từ hệ thống.