1. 首頁
  2. 圖形影象/多媒體

多媒體教學網頁的製作過程

多媒體教學網頁的製作過程

摘要: 本文以實際經驗為依據,比較詳細地論述了多媒體教學網頁的製作過程、技術要點和注意事項,包括立題、素材的蒐集、多媒體制作和網頁的製作等內容。

關鍵詞:多媒體、教學網頁、製作

前言

計算機網路技術的飛速發展,使網路逐漸滲透到了人類生活的方方面面。特別是國際網際網路的日益普及,越來越多的人們投入到網路這個無限的空間中去。在教育領域,將網路運用於教學,已越來越得到人們的重視。目前,各類多媒體軟體很多。但一般的多媒體軟體動輒兩、三百兆,由於網路傳輸速率的限制,這樣的龐然大物根本無法在網上應用;況且,就算網路速度跟得上,這些並非為網路量身定做的軟體,其形式和連結關係也不適合在網路上使用。如何在現有條件下,把網路的快捷、方便、可共享等特性應用到教學中去,就成為一個關鍵而迫切的現實問題。

一個好的辦法就是將教學內容製成多媒體網頁(教學網站或網校),使學習者可以不受時間和空間的限制自由訪問,並且在直接訪問中瞭解和學習知識。本文以某一小型電源系統的調壓器為例,對多媒體教學網頁的製作過程和技術做一探討。

一、前期準備工作

(一)教學內容的準備

主要是對教學內容進行選取,確定各部分內容的媒體形式。對字幕表述進行推敲,對其它形式定出表現方案,最後還是要形成一個指令碼。

(二)圖片素材的收集

1、背景圖的取得

背景圖的來源主要是書報資料和素材庫光碟中的一些圖片,如果圖片效果不太理想,可以用photoshop進行必要的修飾。

2、實物圖片的取得

一般沒有現成的實物圖片,我們可以找了一個比較完好的實物,從多個角度進行拍攝,分解後,再對各個部件進行拍攝。最後,選擇出效果好的圖片,利用掃描器掃描得到數字檔案,當然也可以直接使用數碼相機拍攝。必要時,也要用photoshop處理。

二、多媒體制作過程

(一)三維動畫製作

用3DMAX3.0製作三維動畫的過程大致分為三部分,一是製作物體模型,二是設計動畫效果,三是渲染與輸出。

首先,將調壓器可分為三個塊:支架(包括與散熱器連線的彈簧),散熱器和底板,每塊又可分為若干個子物體,如散熱器中就包括有散熱片、碳柱、螺桿、端蓋、鐵心、線圈、彈簧片,單就一個螺桿來說也是分為六邊形杆,螺帽和帶有螺紋的一段圓形杆。三部分一一完成後再連線為一體,在這一製作過程中主要用到了3DMAX命令面板中的Create(建立)面板和Modify(修改)面板,開始用Standard primitives(原始幾何物件),像Box,Cone等透過對Parameters(引數欄)中的引數的`調整來完成所建物件的長,寬,高,半徑,變數(平滑度)等的調整以完成所要求的基本物體形狀。需要合併兩個分別做出的物體時,先點取檔案選單中的Xref Objects選項,在彈出的對話方塊中點取右上角的新增命令按鈕(Add)隨後在出現的開啟檔案對話方塊中開啟需要加入的物體檔案。即可完成匯入操作。將兩物體透過託以旋轉,使其位置配合好之後可同時選中並結合成組以後便可以當成一個物體操作。另外各物體在製作完成時一般給它指定材質。對有關材質與貼圖的操作都集中在材質編輯器中,可以在工具條中單擊Material Editor按鈕將材質編輯器開啟,另外也可以直接在鍵盤上按”M”鍵。3DMAX中有一部分自帶的現成材質,也可以在材質樣本框中修改後用Assign Material to selection可將其指定給所選中的物體。其實碳調各部件大都是外表塗了油漆或金屬表面,所以也可以直接在材質編輯面板中,透過自行調整引數獲得與真實部件相似的外觀,主要是選擇好材質型別,在調整其反光特性等引數。

各個部件基本完成後就要將其做成動畫,更清楚的表示出調壓器的結構和各部件的安裝位置。主要的動畫就是旋轉和移動。

如果要實現一個物體的旋轉,比如支架和散熱器部分都有轉動的展示。可以單擊工具欄中選擇並旋轉工具(Select and Rotate)將時間滑塊拖到50幀,開啟動畫記錄按鈕,在透檢視中以Y軸為中心將物體旋轉180度完成了部件轉動展示的動畫。

要是需要讓某個或某些部件移動位置,像散熱器拆解動畫,磁鐵拆解動畫等就需要為其設一條路徑,也就是移動的路線,選擇型建模工具中的Line命令,在左檢視中建立一條合適的路徑曲線,路徑曲線設好了再把要移動的部件匯入,單擊File選單中的Merge命令,在Merge file對話方塊中,可設定渲染的幀數段。最後輸出時一般選Active Time Segment,在Output size中選320*240。在下面的Options中的選項,可以用其預設設定。Reder Output區中需設定要儲存輸出檔案的位置,名稱及格式,這裡選AVI檔案,在Reder scene對話方塊中第二個卷質欄是MAX Default Scanline A-Buffer(MAX預設線掃描渲染器A緩衝區)這裡的設定也很重要但一般情況下取預設設定也可以輸出較好的效果。

(二)三維文字製作

在小的GIF字型動畫及立體文字的製作中,用Ulead公司的Cool3D是很方便的,這個軟體雖然不大但功能並不少,操作也很簡單。比如,主頁的標題文字就可以做成一個GIF動畫,在Cool3D中的製作過程如下:

先建立一個新檔案,調整尺度為384*58畫素,再點選輸入文字按鈕在彈出的對話方塊內輸入“********”,然後將其選中改為方正行楷字型,可以透過移動、旋轉、縮放等操作配合新增關鍵幀來完成動畫的製作,當然還要增加一些Cool3D提供的光線、紋理、傾斜等效果,使文字更加飽滿圓潤,並悅目的紋理和光澤,還可以選擇漂亮的背景。各項工作做完後再按需要調整動畫的幀數來控制播放時間的長短,透過調整物體(文字)屬性工具蘭中的環境、光源、表面、反光等各項的亮度、飽和度和色調來達到最佳視覺效果。另外在整個過程中隨時可以用編輯文字按鈕對所輸入的文字進行修改最後一步就是匯出動畫(GIF或AVI)檔案或匯出JPEG影象,並且可以自行確定影像的輸出質量,比如外場維護中的“工作點的調整”、“外場維護”兩個按鈕的製作就是這樣完成的。當然,質量越高渲染起來就越耗時,著很大程度上也取決於計算機的硬體配置。

在對一些GIF格式的動畫進行簡單的修改以及繪製平面圖是我們選擇了Macromedia公司的Flash4.0中文版,他提供了影片岩石,修改及刪除、新增幀等操作,還可以自行配音,Flash4.0支援很多格式的聲音檔案,而且提供了比較齊全的繪圖工具,如鋼筆、鉛筆、吸管、筆刷、墨水瓶等十幾種再配合圖層工具用起來很方便,操作也更加靈活多樣。

(三)圖片、背景的處理

在對圖片的處理以及按鈕的製作中主要用到了Photoshop5.0CS,如所用到的背景圖片大都在Photoshop5.0中經過亮度、對比度以及色相、飽和度、色彩均衡等的調整,使之和頁面色調相配合,達到最令人滿意的效果,另外對一些過大的圖片還要進行裁切,調整大小等操作。例如,對真實碳片電壓調節器進行拍照,掃描得到的通常解析度高達3400*4600以上,其檔案也有1M甚至3—4M大,而網頁頁面預設解析度只有800*600,所以必須對掃描得到的圖片進行縮放,裁切,旋轉等處理,使其大小和角度均達到要求。

像碳調的調壓原理中,就有“必要性”、“方法”和“原理”三部分它們是透過三個按鈕來連線的,又如調節誤差中有“準確性”及“穩定性”兩個按鈕,碳調結構中有“支架”、“主體”、“配置”三個按鈕,用作這些按鈕的圖片都是透過Photoshop5.0製作完成的。例如“準確性”和“穩定性”兩個按鈕,是先選擇了一副木紋的材質圖作為底圖,然後叢中剪下280*110畫素大小的一部分成一新檔案(假設命名為P1然後選取左側工具欄中的文字工具,在P1視窗中單擊滑鼠左鍵,在文字工具對話方塊內輸入“穩定性”,並將大小定為90畫素字型採用方正行楷顏色為黑色,其他各項取預設設定。然後為其新增圖層蒙版,對文字進行處理,選取濾鏡選單中的藝術效果—壁畫濾鏡工具。可將畫筆大小,細節,紋理等引數定為2,8,1。單擊“好”確認操作,再應用斜面和浮雕效果,使字型具有一定的立體感。為了使按鈕更有層次感,可以選取背景圖層加入光照效果再合併圖層並匯出為JPEG格式的圖片檔案,完成操作。而“支架”、“主體”、“配置”按鈕的製作則稍微複雜些,選取背景後,建立一新通道,再輸入“支架”兩字選中宋黑色字型,然後再複製一個新通道Alpha2,將第一通道載入選區開啟濾鏡選單中的模糊工具選取“高斯模糊”濾鏡對話方塊,設半徑為5畫素,然後再選擇反選再一次使用高斯模糊,設半徑為8畫素,這樣字型不在稜角分明而有一種朦朧感,然後應用風格化中的“查詢邊緣”濾鏡對文字進行描邊處理,再經調整亮度/對比度後整體再應用一次輕度的高斯模糊,然後開啟燈光效果對話方塊,選擇“Default”型別燈光,適當設定引數,如強度15,光澤10,材料60,曝光度0,環繞7,紋理通道選擇複製的通道Alpha2,再將Alpha1載入選區調整色相/飽和度為色相140,飽和度30,亮度25,並選中著色複選框。最後合併圖層剪下調整大小即得到我們用來做按鈕的原始圖片。調壓原理中用到的三個按鈕製作過程相對來說比較簡單,主要是應用了圖層蒙版和斜面浮雕效果,具體過程就不再詳述。

上面提到在對掃描得到的圖片的處理中,需要換成比較美觀的背景,所以較多用到選取操作,選取工具很多,如套索或磁性套索工具,魔棒工具以及自由鋼筆工具。在被選物與背景色差較大時用魔棒工具是可以得到事半功倍的效果的,不管使用那一種工具再把物體選中後再選擇反選,剪下圖象後把背景複製為一新圖層調整其大小至與邊框相配合,然後把物體設為最上層就完成了製作。

(四)平面圖、文字、聲音和音樂的製作

平面圖、文字、聲音和音樂等幾種媒體形式的製作、錄入、合成以及連線都比較簡單,不再詳述。