利用 Demofuse 製作電腦玩物站內導覽幻燈片

demofuse00.png

看到 TechCrunch 的「Demofuse: Embedded Website Tours」一文中介紹了 Demofuse 這個網路服務,它可以讓你為自己的網站製作一個動態導覽,這個導覽流程運用 Ajax 技術內建在你的網站當中,可以讓導覽元件更活潑的與你的網站作即時互動,而不是像一般 Flash 那樣的預錄影片。感覺 Demofuse 應該可以運用創意玩出一些變化,或許可以有教學流程之外的應用,所以馬上想去註冊一個帳號,卻發現目前還需要輸入邀請碼才能註冊,於是利用首頁上的「Don't have an invite code? Request one here.」寄出一封申請郵件,沒想到不到一天就收到了回函,裡面除了提供一個我個人專用的邀請碼外,也附上一個通用邀請碼「731125」,所以有興趣玩玩看的朋友,可以將這個邀請碼輸入到首頁的「Enter Code」欄位中,應該就可以開始註冊。

Demofuse 在你填寫完基本註冊資料後就可以開始試用,首先它會給你一段偵測你網站結構的 Code,你必須將它複製貼上到 </body> 之前,當你完成這個動作後,按下網頁下方的「Verifty The Code」就可以讓 Demofuse 認證你的網站,等到這些步驟完成後,就可以開始進行導覽的製作了。

你可以為已經加入上述 Code 的網站製作導覽,每個帳號似乎可以製作許多個不同的導覽,當正式開始製作後,會連結到網站頁面,並且會出現一個編輯工具列,裡面提供了像是動態箭頭、高亮框線、滑鼠游標動畫等功能,讓你可以利用這些工具來標註你的網站重點,目前 Demofuse 可能因為剛剛開始測試,所以提供的工具還滿少變化的,稍微摸索一下就可以熟悉操作。

demofuse07.png

 

製作導覽的過程基本上是一張一張幻燈片的方式來製作,每一張幻燈片有一個導覽說明對話盒,可以讓你輸入說明內容。當製作完一張幻燈片後,可以新增另一張幻燈片,不同的幻燈片之間可以切換網址,但是必須是在你當初設定的主站的網址下層才行。每次執行完一個段落,可以選擇工具列最左方的「Preview」來預覽,全部製作完成後,記得點選「Save」儲存。

demofuse08.png

 

製作完成的導覽幻燈片會出現在你的帳號資料下,你可以從這裡取得這份導覽的「Button Code」,讓你可以放置導覽按鈕到網站中,按鈕有兩種,一種是連結,一種是 JavaScript 。下方這個導覽按鈕是連結型,按下它你就可以看看我臨時為電腦玩物製作的導覽幻燈片。有時候幻燈片切換間的速度會稍慢,因為如果有更換網址的話,就會要載入一次完整的網頁,請讀者們耐心等待。而看的比說的明白,關於 Demofuse 的優缺點,從這份導覽實例中,或許也比較容易理解

 

 

歡迎留言寫下你對 Demofuse 或這份電腦玩物導覽的感想,大家一起交流討論喔!

留言

  1. 這是個真正的好東西,我一直再煩惱該怎麼做一個好的導覽,現在有這東西就太棒了。

    回覆刪除
  2. 4日註冊時, 已開放給"everyone". 不需要邀請碼了! :)

    回覆刪除
  3. 哇~這個服務似乎掛了~????

    回覆刪除

張貼留言

為了避免垃圾廣告留言過多,開始測試「留言管理」機制,讓我可以更容易回應讀者留言,並更簡單過濾掉廣告,但只要不是廣告留言都會通過審核。

這個網誌中的熱門文章

全家沖印、 7-11 列印照片誰好用?立可得與 ibon教學+比較表

Google Maps 我的地圖完全教學!規劃自助旅行攻略

Slack 完整教學與上手心得:找到正確的團隊溝通之道

Google NotebookLM 免費中文 AI 筆記實例教學,老師、學生、創作者利器

畫張圖說得更清楚! Napkin 用 AI 幫你的簡報文章手繪視覺思考圖

Google 表單自動關閉回覆教學:時間人數到達就過期

會議記錄不麻煩!我常用兩個 Evernote AI 功能整理錄音、手寫筆記

Excalidraw 免費 AI 生成流程圖,一鍵畫出知識圖表、專案流程、寫作大綱

微軟 Bing AI 繪圖工具 Image Creator 免費開放,30秒輕鬆生成圖片

Miro 遠距工作開視覺會議的免費強大白板,專案圖解實例教學