跳到主要內容區塊

 

103 網頁視差滾動效果之編輯系統開發

出版年度:103

 

論文名稱:網頁視差滾動效果之編輯系統開發

 

研究生:王崧年   指導教授:徐豐明

 


論文簡介:

  視差滾動(Paral lax Scroll ing) 是近年來網頁設計流行的特效之 一, 透過滑鼠滾輪滾動捲軸, 多層網頁內容以不同速度移動所產生出 的立體效果, 視差滾動能夠提升網頁視覺體驗, 比起單純的文字與圖 片, 更吸引使用者, 也可以透過動畫表現, 提升了解網頁傳達訊息的 效率。許多市面上設計視差滾動網頁都是全新製作, 開發視差滾動效 果網頁的方法有許多種, 可以自行編寫程式碼, 不過多數仍然使用開 放原始碼製作視差滾動網站, 設計視差滾動網頁使用開放原始碼後設 計師仍然需要編寫程式。 本研究開發網頁視差滾動程式編輯系統, 設計師只要透過簡單的 介面點選與輸入數值的動作, 即可輸出有視差滾動效果的網頁檔, 降 低設計師撰寫視差網頁程式的負擔, 除了方便開發新的視差滾動網 頁, 還能夠套用舊有的網頁加入視差滾動效果。由於視差滾動有許多 開放原始碼,本研究選擇配合skrol lr 開放原始碼作為本研究系統開發 系統的編輯規則。 研究結果顯示使用介面化的編輯系統比起文字編輯器, 能夠加快 編輯的時間,並且降低編輯錯誤率,經由SUS 系統易用性分析,使用 者認為本研究開發之系統的易用性是很好的。 Since Parallax scrol ling is a recent one of popular effects in web design via mouse wheel scroll whi le web content of mult i -layer is move wi th different speed to make three-dimensional effect . Paral lax scrol ling can enhance experience of web vision that is more attract ive user than only text and picture, and can also show through animat ion to enhance efficiency of understanding web informat ion. Many web pages wi th paral lax scroll ing are from scratch production in the market , and there are several methods for development parallax scroll ing web page, al though developer can code program by himself , but most paral lax scrol ling web pages are made by open source. Developer st il l code program after design web page wi th parallax scrol ling use open source. This study developed edit ing tool for web page wi th parallax scroll ing, through the tool of simply enter interface, and developer only needs to enter parameter value of scrol l posit ion and attribute of visual presentat ion that can output web file with parallax scroll ing and r educe the web developer burden. In addit ion to conveniently developing new web, i t can apply to old web for addi t ion parallax scroll ing effect . Because there are many open sources of parallax scroll ing, this study chooses skrol lr open source as our tool development . The results showed that interface of the system lead to more time-saving to edit than a text editor and reduce error rate of edi t . According to the analysis , system usabi l ity scale (SUS) is good about usability of this study develop system.

瀏覽數