有聲書小小講師空間

[轉錄] 網站使用性介面設計競賽

noreply@blogger.com (小小講師) — Wed, 30 Jun 2010 02:03:00 +0800

同學們，有興趣可以參考一下，畢竟學會在推動無障礙網頁，如能以此比賽為目標，也是不錯的挑戰喔。

一、競賽目的
第二期數位典藏國家型計畫（National Digital Archives Program）主要目標為擴展數位典藏公共資產，促成典藏內容與技術融入教育、研究、產業與社會發展。為達成此目標，針對不同族群與產業層面，協助改善數位落差與近用能力方面，數位典藏資料平台之互動設計良善與否，擔負非常重大的責任。本網頁設計競賽與其他相關競賽之不同，旨在推廣數位互動設計不僅是視覺創意或技術之呈現，更應強調使用性設計(usability design) ，此符合使用者中心設計的主要核心概念。希望藉由本次競賽，圖拋磚引玉，讓相關設計開發人員更瞭解使用性概念之重要性。

二、競賽主題
參賽者可從下列八個數位典藏網站中擇一，針對該網站之介面設計及使用性等網站構成元素進行設計及改版。在網站內容部分，不列入評分標準，參賽者可採用所選定之數位典藏網站內容，但須標明出處；網站介面設計之美感和使用性才是本競賽評選之重點，參賽者可盡情進行創意發想及製作。

三、獎項及名額
(一) 第一名：
獎金新台幣15,000元，得獎作品將公布於《數位典藏與數位學習國家型科技計畫》網站之首頁。
(二) 第二名：
獎金新台幣10,000元，得獎作品將公布於《數位典藏與數位學習國家型科技計畫》網站之首頁。
(三) 佳作2名：
獎金新台幣5000元，得獎作品將公布於《數位典藏與數位學習國家型科技計畫》網站之首頁。

四、參賽資格
舉凡對網站設計有興趣之國內外團體或個人，不限年齡、職業及性別皆可以個人或團體形式報名參加。

五、重要時程
(一) 宣傳報名期間：2010/05/01-2010/07/31
(二) 作品繳交期間：2010/08/01-2010/09/15 ，以郵戳為憑
(三) 得獎公告時間：2010/10/15

六、報名方式
本競賽採 E-mail 報名方式，請在報名期間內E-mail至活動信箱： icsusability@gmail.com，來信請著名所有參賽成員之[姓名]、[聯絡電話]及[E-mail]，待承辦人員回覆即可完成報名作業。

七、繳件方式
(一) 繳件地址
郵寄繳件截止日為2010年09月15日(以郵戳為憑)，請參賽者於繳件期間內將作品以郵寄方式寄至”新竹市大學路1001號人社二館一樓傳播研究所”收，並於信封上註明【數位典藏與數位學習國家型科技計畫─網站使用性介面設計競賽】及【參賽者姓名】。

(二) 繳件內容
1. 作品光碟內容
(1) 完整網站：
> 頁面建議解析度 1024x768。
> 首頁檔名設定為index.htm或index.aspx(小寫)，所有檔案名及資料夾名稱需用英文命名。
> 須在Windows及Mac OS作業系統下正常執行，並可以IE、Firefox等瀏覽器進行瀏覽
(2) 網站企劃書：
> 檔案格式：pdf檔
2. 作品紙本內容 ─ 網站企劃書
網站企劃書內容須包含：
(1) 競賽主題：
> 台灣原住民數位典藏
> 山海文化台灣原住民文學數位典藏
> 國立台灣博物館－原住民數位典藏
> 台灣民族誌數位影音典藏
> 中研院民族所
> 公民行動影音紀錄資料庫
> 台灣外省人生命記憶
> 榮民文化網
(2) 設計理念
(3) 網站架構圖

3. 參賽同意書 & 使用姓名估量表 (紙本)
請至下列網址http://tinyurl.com/2w9768k下載「參賽同意書」及「使用性評估量表」
(1) 參賽同意書
所有參賽成員均須簽名並附上身分證正反面影本。
(2) 使用性評估量表
待網站設計完成，請2-3名使用者實際操作該網站，並填寫此「使用性評估量表」，一位使用者填寫一份「使用
性評估量表」，最後將所有「使用性評估量表」一併繳交。

八、評選標準
(一) 網站視覺美感呈現 30%
1. 版面安排
(1) 接近(proximity)
接近原則的基本目的是組織，一旦版面經過組織化，能產生更多吸引人且適當的留白美感。
(2) 對齊(alignment)
對齊原則強調，將每個項目並列對齊在頁面上，成為一個結合性單位，目的是整體性與組織化，利用一視覺上
線條，將版面每個部分連結一起，產生所謂的整體性美感。
(3) 重複(repetition)
重複某些部份以貫穿整個作品，可以視為一致性的概念，其目的是達到整體化與增加視覺趣味性。
(4) 對比(contract)
對比原則指兩個不太相同的項目，應該盡量讓他們產生差異化，其目的是產生版面的趣味性吸引人及組織性。

2. 字體設計
(1) 大小
運用字體大小產生對比，增加視覺上的美感
(2) 重量
利用畫筆的粗細產生變化美感
(3) 結構
利用不同字體家族的結構差異產生對比
(4) 形式
不同的字母形狀會產生不同的視覺效果
(5) 方向
字體傾斜的角度產生對比的美感及趣味性
(6) 顏色
適當運用冷暖色系組合，吸引人視覺的注意力

3. 圖像
(1) 視覺化程度高
(2) 視覺效果的一致性
(3) 圖片完整性
(4) 在單獨的頁面上不要包含過多的大型圖片
(5) 不要讓背景顏色或圖片模糊了文字的內容

(二) 網站使用性 50%
1. 系統狀態是可見的
使用過程中系統應讓使用者清楚了解目前系統狀態，在合理時間範圍內給予適當回應。
2. 系統與實際使用情況是相近的
系統中用詞、概念與呈現方式應呼應使用者實際使用情形。
3. 系統給予使用者極大自主權
系統給予使用者極大的自主權，在選擇錯誤的當下可立即回復原始狀態或重新開始。
4. 系統設計一致且符合標準
系統中的使用辭彙、狀態與動作所代表之意涵應具有一致性。
5. 系統中的錯誤是可預防的
降低錯誤發生率或系統提供使用者送出指令前再確認的機制，有助於降低錯誤發生率。
6. 使用過程中可辨識而非依靠記憶
介面設計是容易識別的，使用者不需特別記憶。系統使用說明應隨時可見且方便查詢。
7. 使用上具彈性且有效率
無論是首次使用者或有經驗的使用者皆可在網站上找到符合其需求之使用方式。
8. 設計具美感且簡潔
畫面應簡潔，避免不必要資訊的出現干擾使用者。
9. 協助使用者了解、診斷並修正錯誤
所顯示之錯誤訊息應已使用者易於了解的方式呈現，清楚地指出錯誤之處並提供修正方法。
10.線上輔助與文件
提供線上協助，供使用者在任務進行過程中查詢。

(三) 企劃書內容：20%

九、評審陣容
本競賽之評審陣容是由國內UI Gathering推舉3位資深專家，及學界推派3位優秀學者，所共同組成的6人評選小組。

(參考網址:http://icsusability.blogspot.com/)

[心得] 還不睡的小小講師

noreply@blogger.com (小小講師) — Tue, 29 Jun 2010 01:36:00 +0800

連著幾天教學下來，

發現自己對於教學充滿熱忱，

很喜歡班上學員與自己的互動，

一直很希望自己能夠將所學教給他們，

但又害怕大家會因此卻步

(OS:為什麼每個老師都要多教那麼多課啊...)

於是，總是讓我陷入矛盾啊...

我一直覺得上課前備課、寫些講義給學生很重要，

但從學生時代的我就不是那種會先把書讀完的乖小孩，

一定要等到了考試前一天，

才開始有讀書的FU，才會乖乖地拿起課本開始念，

雖然不代表我平常都沒在看書，

只是，就是要到緊急的時間點，才能夠"發揮潛能"啊!!!

夜半兩點了，

還捨不得睡，想再測試一下明天的教學課程示範，

(雖然我晚上有睡了一個多小時吧...)

好!!!

一鼓作氣來完成吧，希望我可以三點前上床(理想是兩點半)

即使是最後一堂課，都要當做是第一堂課，

熱情與衝勁，是人生的不敗法則。

[教學] 將聲音檔（MP3）放置Archive.org操作步驟

noreply@blogger.com (小小講師) — Tue, 29 Jun 2010 01:28:00 +0800

1. 註冊Archive.org(http://www.archive.org/)

2. 將聲音檔（mp3）上傳至Archive.org

3. 從Archive.org找出該檔的URL(VBR MP3)

4. 回到blogger文章中貼上MP3的超連結

1. 註冊Archive.org(http://www.archive.org/)

點選 “Join us”進入畫面

建立一個新帳號(Create an account)，依序填入以下資料:

Enter a valid email address(輸入一個有效的電子郵件地址):

Enter a screen name (輸入一個在頁面顯示名稱):

Choose one of the following(選擇下列之一):

Enter desired password(輸入想要的密碼):

Confirm password(確認密碼):

Verify(驗證):

Finalize(最後確定):

2. 將聲音檔（mp3）上傳至Archive.org

登入帳號後，選擇upload，再點選share，開始選擇檔案上傳，

並依序填入下方表格內容：

Title(標題)

Description(說明)

Keyword(s) separated by commas(關鍵字，以逗號分隔)

送出資料(share my files)，成功後會出現一頁面：Your Page is Ready!

點選下方的網址

3. 從Archive.org找出該檔的URL(VBR MP3)

找出後，複製連結網址

格式為：http://www.archive.org/download/bigcat/xxx.mp3(XXX為檔案名稱)

4. 回到blogger文章中貼上MP3的超連結

語法如下

＜a href="http://www.archive.org/download/SeedForLive/seed.mp3"＞＜b＞留住幸福的種子2.mp3＜/b＞＜/a＞(請將＜、＞改為半型符號)

[podcast] 留住幸福的種子(上課示範)

noreply@blogger.com (小小講師) — Mon, 28 Jun 2010 11:20:00 +0800

幸福的種子.mp3

資料來源:tdtb

[備註一]
發現tindeck.com的下載載點會亂跳，下載一次後就會再導回原官網頁面，

這讓我考慮教第二個免費上傳空間...archive.org，測試中...

[Podcast] 留住幸福的種子

noreply@blogger.com (小小講師) — Mon, 28 Jun 2010 06:25:00 +0800

留住幸福的種子.mp3

(這是用Tindeck 上傳的音檔載點)

留住幸福的種子2.mp3
(這是用archive.org上傳的音檔載點)

留住幸福的種子

作者：網路流傳

錄音：沈香君

配樂：陳怡蓁

2010/6/19

從前有個孤兒，過著貧窮的日子。

這年，剛剛進入初冬，他的全部口糧只剩下父母生前為他留下的一小袋豆子了。

但是，他強忍飢餓，把那一小袋豆子藏了起來。

之後，他全靠著撿破爛，勉強糊口。

儘管如此，但在他心中總有一株株綠油油的誘人豆苗，在旺盛的生長。

他在夢中，也似乎真的看見了來年那些可愛的豆莢。

因此，在那個浪漫而寒冷的冬季裡，他雖然多次險些餓昏過去，卻一直不願去觸摸那一袋豆子。

因為他知道，那是希望的種子、生命的種子啊！

苦日子就這樣過了一整個冬天。

第二年，春天來了，孤兒把那一小袋豆子，播種到田地裡，在經過一個夏天的辛勤耕耘，到了秋天，他果然收穫了數十倍的種子。豐收過後的孤兒，並沒有就此滿足，他還想獲得更多更多的豆子、更多更多的幸褔！

於是，他把收穫的豆子，又留下來繼續播種、耕耘、收穫。

就這樣日復一日，年復一年，種了又收、收了又種。

幾年過去了，孤兒房'前屋後、田邊、地角，到處長滿了豆苗，屋裡囤滿了成包的豆子，孤兒告別了貧困並且成為遠近聞明的富人。

不久，他娶妻生子，過著人人羨慕的幸福生活。

後來,他和妻子一面繼續種豆，一面學作豆製品，王到四十歲便成為聲名顯赫的大富豪。

人生有了幸福，還須要什麼--還須要留住幸福。

人生沒有了幸福，還須要什麼--還須要留住幸福的種子。

資料來源：有聲書學會

[心得] 關於教書-那個曾是夢想的職業

noreply@blogger.com (小小講師) — Fri, 25 Jun 2010 15:55:00 +0800

以前總希望自己的職業是老師，可以把所學教授給學生，可以在辦公室跟自己欣賞的老師交換教學心得。

總是在每個求學階段，選了與教書漸行遠去的路，選了只能讓自己甘願當一個上班族，至少，就現階段而言。

人生，總是會有很多的機緣。

雖然無法真正地站在講台前，手持著粉筆，在黑板上揮舞著文字，然後看著台下的學生，似懂非懂的樣貌，而回想到當年的自己。

我目前的身份是個兼任講師，在職業訓練課程中擔任電腦講師，教授的學生有大半是視覺障礙的朋友，但他們對於學習更加地努力。

雖然也有幾次是教授志工單次的課程，像這樣六次上課，共三十六堂課，一系列的課程，還是我第一次的接觸。

第一次上課，一整個時間抓不準，一下子就講完了自己的講義，然後在實作的地方，軟體的操作不夠Friendly,當下決定換一套軟體測試，也許是自己之前也有嘗試，所以當下轉換並沒有造成太大的困擾，只是希望學生們能真的學習到什麼。

也許我們都在學習，你們加油，我也會努力成為丁老師的。

大家好!!!

noreply@blogger.com (小小講師) — Thu, 24 Jun 2010 11:16:00 +0800

大家好!!! 我是有聲書學會的小小講師-丁丁，
這是第一篇部落格文章測試!!!!