文/安一飛

1　前言

先進(jìn)的3D圖形越來越多地用于各種領(lǐng)域的網(wǎng)絡(luò)應(yīng)用，如手術(shù)培訓(xùn)和博物館展覽。 與此同時(shí)，Web技術(shù)的創(chuàng)新（例如HTML5和WebGL）允許將高級(jí)3D圖形直接集成到網(wǎng)頁中，而不需額外的插件。雖然，現(xiàn)代圖形硬件的可用性越來越高，但目前仍沒有標(biāo)準(zhǔn)的方法來有效地將傳統(tǒng)的2D網(wǎng)頁內(nèi)容（例如文本和圖像）與交互式3D環(huán)境相結(jié)合。

通常，3D應(yīng)用程序?qū)Ｗ⒂趫D形，沉浸式和交互性，而不是傳統(tǒng)的Web任務(wù)（如定位和查看信息）；3D圖形提供更逼真和更豐富的用戶體驗(yàn)；但是，3D環(huán)境往往需要用戶借助一個(gè)視角與相關(guān)內(nèi)容進(jìn)行交互，并且通常需要用戶導(dǎo)航到某個(gè)位置才能檢索信息，從而降低了用戶完成常見Web任務(wù)的能力（如檢索文本信息）。在本文中，我們采用了一個(gè)WebGL 3D圖形JavaScript庫——Three.js，給出了一個(gè)雙模式方法的原型實(shí)現(xiàn)，用于在交互式3D環(huán)境中進(jìn)行信息傳播的接口設(shè)計(jì)，通過創(chuàng)建web交互式應(yīng)用程序，允許用戶在2D和3D用戶界面之間瞬間切換。與單獨(dú)的超文本或者3D模式相比，雙模式用戶界面具有總體任務(wù)性能最佳的優(yōu)勢(shì)，且在實(shí)踐上，美學(xué)上更受用戶青睞。

2　系統(tǒng)描述

原型系統(tǒng)以博物館形式實(shí)施應(yīng)用。該應(yīng)用程序允許用戶探索博物館參觀者的活動(dòng)，以及可能在這個(gè)博物館中找到的陳列品。原型系統(tǒng)通過Three.js JavaScript庫使用HTML5，CSS3，JavaScript和WebGL實(shí)現(xiàn)。創(chuàng)建了三個(gè)應(yīng)用程序，即“2D網(wǎng)站”，它是一個(gè)“平面”網(wǎng)頁，其中包含參觀者對(duì)象的3D呈現(xiàn)。第二個(gè)應(yīng)用程序是一個(gè)使用Three.js實(shí)現(xiàn)的“3D網(wǎng)站”。它包含一個(gè)3D對(duì)象，用戶可以探索特定物體并與之互動(dòng)。當(dāng)用戶在對(duì)象附近時(shí)，呈現(xiàn)2D文本信息。最后，實(shí)現(xiàn)了將“2D網(wǎng)站”和“3D網(wǎng)站”組合在一起的“雙模式網(wǎng)站”，使用戶能夠通過分別按下鍵盤上的“2”和“3”鍵在兩個(gè)網(wǎng)站之間切換。雙模式網(wǎng)站具有模式之間無縫轉(zhuǎn)換的附加功能。

3　測(cè)試方法

原型測(cè)試側(cè)重于測(cè)量使用三個(gè)應(yīng)用程序來檢索信息的速度，以評(píng)估用戶界面的有效性。在2D模式中，參與者需要使用標(biāo)準(zhǔn)超文本和鼠標(biāo)點(diǎn)擊交互來檢索答案。在3D界面中，參與者必須導(dǎo)航3D環(huán)境才能從信息板上檢索信息。在雙模式下，用戶可以在任何時(shí)候在用戶界面之間切換;然而，“雙模式”中的問題鼓勵(lì)用戶回到3D模式，以避免它們停留在2D模式。每個(gè)問題都是在用戶在閱讀問題后與應(yīng)用程序進(jìn)行交互的那一刻開始計(jì)時(shí)的，計(jì)時(shí)器在參與者完成了答案寫作的那一刻就停止了。一旦速度測(cè)試完成，參與者被要求填寫一份調(diào)查問卷，用于衡量他們對(duì)每個(gè)應(yīng)用程序的滿意程度，以及他們對(duì)李克特量表上一系列關(guān)于用戶界面，美學(xué)，表現(xiàn)，易用性，獲取信息的快捷程度和切換的簡(jiǎn)易性的認(rèn)可程度。

為了測(cè)試原型，我們招募了11名參與者。在測(cè)試之前，對(duì)每位參與者都被給予了實(shí)驗(yàn)的簡(jiǎn)要說明，同意書和一份簡(jiǎn)短的預(yù)先研究問卷，以確定參與者的資料。在測(cè)試后，參與者被給予研究后調(diào)查問卷。調(diào)查問卷詢問每位參與者對(duì)于與用戶界面，獲得信息的難易程度，美觀性以及網(wǎng)站性能表現(xiàn)的滿意程度。評(píng)分計(jì)算方法為：“非常不滿意”評(píng)分為1，“不滿意”評(píng)分為2，“中性”評(píng)分為3，“滿意”評(píng)分為4，對(duì)于“非常滿意”評(píng)分為5。

4　測(cè)試結(jié)果

原型測(cè)試的結(jié)果表明，2D網(wǎng)站獲得了用戶界面的最高評(píng)價(jià)，雙模網(wǎng)站只降低了一個(gè)點(diǎn)。 信息的易用性在雙模網(wǎng)站上被評(píng)為最高，而2D網(wǎng)站緊隨其后。3D網(wǎng)站被認(rèn)為是最美觀的，2D網(wǎng)站被認(rèn)為是最好的表現(xiàn)。 這些結(jié)果將為研究和開發(fā)過程的進(jìn)展提供信息。很明顯，2D和雙模網(wǎng)站在每次測(cè)試中都很接近，以及對(duì)它們提供的反饋，并且很明顯，3D網(wǎng)站除了一個(gè)區(qū)域外都缺乏，獲得的滿意度較低，以及較低的測(cè)試速度。 這些測(cè)試結(jié)果說明，雙模式應(yīng)用比單獨(dú)的2D或3D接口更直觀和更有效。

5　結(jié)論

在與3D虛擬環(huán)境結(jié)合使用時(shí)，本文提出了雙模式用戶界面，以增強(qiáng)用戶與網(wǎng)絡(luò)內(nèi)容的交互。 這項(xiàng)先導(dǎo)性研究表明了3D虛擬環(huán)境的雙模接口的前景。未來的工作將通過將3D視圖與2D視圖更密切地結(jié)合，并在3D內(nèi)容中擴(kuò)展2D注釋來改進(jìn)雙模式界面。 我們還將擴(kuò)大研究范圍從而充分挖掘雙模接口的優(yōu)勢(shì)。