hanzi slogan

介面設計說明

  在漢字設計上,本研究中所使用的漢字僅以象形、指事與會意三類造字法做選擇,因此在前期擇字階段中研究者首先以此三類造字法為方向發想。

  廖文豪(2012)曾提到「雖然古字的字數不多,但是基本上所有的部首或基本符號都已經含括在裡面了,在古字之後的漢字都是由這些基本符號所拼湊出來的。」因此在挑選漢字時首先從圖像概念最顯著且部首字量較多的象形著手;將象形類別字群擬定後,指事與會意皆是從象形的基礎演變出來,例如指事中「刃」是從「刀」演變而來,會意中「森」是由三棵「木」組合而成。

  挑選適當的漢字後則進一步在漢字中設計出不同的趣味線索,這些線索包括漢字結構的部分改變與全部改變,研究者在這些改變中加入三大類不同的元素分別為第一類甲骨文、第二類圖片以及第三類創意、抽象的設計,下圖為漢字設計流程圖:

design

一、象形類造字─藉真實的形體描繪出不同的文字

  在設計漢字時,首先選擇的是象形類漢字。將象形造字法追朔回甲骨文時能發現古時的字意與現今的漢字意義相去不遠,且象形造字法是以萬物的輪廓、形體描繪而成,因此學習者在直接觀察甲骨文的圖形後即可立刻與自身周遭經驗作聯想並理解該漢字的大意。因此在象形類漢字的設計上多以原甲骨文或與本意接近的圖片做為改變的規則。

  在象形設計上,「牛」字的甲骨文看起來是一個牛頭的圖像,如圖21所示。對於學習者來說就是很直覺能夠從圖像中得出這是一個動物的頭像,再經由甲骨文中所描繪出來的牛角能繼續分析出有角的動物或直接得出牛字的答案。辨識圖卡後,學習者看到簡單的演變以後能確定所看到的圖像即為「牛」字。

cow

牛字變化

(圖片來源:研究者自製)

  而「刀」字在古代甲骨文當中是以刀子的圖像出現,除了像牛字的全部改變以外,研究者也設計了刀這一類部分改變的設計,研究者在「刀」字上面加上甲骨文刀字的刀柄,如圖22所示。學習者可以瞭解到這是一個有柄的物品,再經由辨識過後了解到這是刀子的意思。

knife

刀字變化

(圖片來源:研究者自製)

二、指事類造字─延伸象形造字法,標記無法描繪的抽象事物

  指事類漢字需要說明的是較為抽象的漢字,在這一類漢字當中重點皆在於標記的部分,一豎一橫中都有其特別的意義,例如「上」與「下」、「刀」與「刃」,這些漢字在結構上只相差了一點,那這一點的意義是什麼?剛開始學習漢字的學習者都會有混淆的現象產生。

  因此在這一類漢字當中,除了以圖片隱藏線索外,研究者更著重在標記符號上,除了強調該筆畫在漢字當中的重要性,更能夠使學習者在尋找線索的過程中對這些標記符號的意義無形地加深印象。如下圖所示,在「刃」字上,刀子最鋒利的地方在於哪裡?自然是刀鋒、刀刃處,但是既然已經有刀的象形字了,古人該如何表是鋒利之處呢,這時候指事標記就派上用場了,在刀子的刀鋒處標記即可表示出抽象概念的「刃」字了,如下圖所示。

knife2

刃字變化

(圖片來源:研究者自製)

三、會意類造字─以不同的形體(漢字)組合出新意義

  會意類漢字將各種不同的形體(漢字)運用一種類似說故事的方式,將漢字的情境呈現出來。在設計的步驟則靈活地運用了此一特性,在各個部件中無論是將其轉換成圖片、甲骨文皆可以讓學習者看到漢字的場景並自行去構思出此漢字情境表達的是什麼意思。

  因為部件組合與富含故事性的特性,會意類造字在設計上可以呈現非常多樣的變化,如下圖所示,「旱」字分成上「日」下「干」呈現乾旱的景象,漢字本意為太陽高高掛在空中,一直曝曬萬物,久不下雨造成樹木都枯了,原為曬乾的樹枝後引申為乾旱。簡單的一個字卻可以用一段小故事敘述出來,這也就是會意類造字的特色。

hot

旱字變化

(圖片來源:研究者自製)
  

  探討完上述三種造字變化後,研究前期將若干常見漢字選出,在設計的階段研究者關注在漢字結構中各部件的關係,除了重要的部首外,部件與部件之間所呈現的畫面也能有助於學習者理解。

  基於上述所說的想法,一開始研究者將較能夠理解的象形字做全部改變的設計,例如「木」即使用樹木的圖片或甲骨文代替,「水」、「火」、「云」等等亦是用相同的想法設計,然後在廣大漢字族群中,這種以單一部件部首呈現的漢字畢竟為少數,因此研究者同時間開始著手將多數部件組合而成的漢字分開來看並分開設計,而這也符合論文初始想法,「從漢字內部結構的部分改變,引發學習者對於不完整漢字的好奇並進一步從線索部分思考尋求答案,進而了解原漢字正確結構以及意義」。改變範例如下圖所示。

  

change

漢字改變示意圖

(圖片來源:研究者自製)

四、歸納設計─甲骨文取代、圖片取代、創意設計

  設計想法三大類中的第一種方式,以半文半圖概念的甲骨文融入在漢字中,在設計上除了少數幾個全部轉換成甲骨文以外,大部分是以部分改變設計線索。全部改變方面,研究者將漢字完全以甲骨文代替,還原其最原始的樣貌再經由圖片的連結幫助學習,如下圖左邊為「左」的甲骨文,描繪向右邊抓取東西的左手,而「虫」原意為小蛇,因此以小蛇的形狀取代「虫」字。

bug

甲骨文全部改變示意圖

  部分改變方面,研究者將漢字部件中某一部件以甲骨文取代,如下圖所示,「家」字上面的「宀」原意為房屋、居住地的意思,因此將「宀」的甲骨文,房屋的形狀取代原本部件。「張」字旁邊的弓字亦是相同的應用方式,以弓的甲骨文取代部件。

甲骨文部分改變示意圖

  圖片取代中,主要希望藉由意義明確的圖片來引導學習者思考。前面所提到的甲骨文雖然已經可以取代大多部件,但是當有些字形需要較為明確的引導時,相較之下圖片的意義傳達會優於甲骨文。造成這種現象產生的原因主要是甲骨文在古時常以一個圖像就能表達大多數的意思,為了避免意義混淆的現象產生,因此加入圖片的設計改變。全部改變方面,研究者將漢字中的部件全部以圖像代替,如下圖所示,「巫」字原意是兩手將祭祀時的器具舉起向天祈求,因此以圖片呈現兩手舉起工具的景象。而「森」字則是依照部件,將三個木字改變成三棵樹木,中國人以三代替很多的意思,因此以三棵樹木帶出森林的感覺。

tree

圖片全部改變示意圖

  部分改變方面主要以漢字中較具代表性的部件做設計,如下圖「情」字以心為部首,感情、心情等詞都與心息息相關,藉此讓學習者連結情字與心的概念。「葉」字為艸部,為了讓加強草字頭與葉字的關係,研究者將其改變成草地的圖像。

leaf

圖片部分改變示意圖

  最後的創意設計則是研究者從前面的經驗中,自行創造出的漢字變化。在設計這些漢字的同時,研究者不禁思考即使是學習漢字多年的本國人在於書寫時,常常會遇到一些容易造成混淆的漢字,例如而且的「且」中間是幾橫?真假難辨的「真」中間又是幾橫?是不是能夠透過本研究所開發出來的學習方式加深學習者對於這些部件結構的印象。

  如下圖所示,全部改變方面,「波」字容易使人聯想到波浪、水波、音波等字詞,因此研究者扭曲波字營造出水波的樣貌,加強連結波字與其意義。「呂」字則是以一點、一小口與一大口三個部件組成,將三個部件距離稍微拉大並轉變角度,讓學習者以拼圖的方式將原字組合出來,經由此過程對此字的結構加深記憶。

bo

創意全部改變示意圖

  部分改變方面,漢字中存在著許多相似的字體,「且」字與「真」字裡面的部件只相差了一橫,對於剛接觸這些生字的學習者來說,很容易就會多寫一畫或少寫一畫,因此使用符號或者一些小提示設計線索,讓學習者一目了然並直接聯想到筆畫的數量,以此加強學習者對結構的印象,如圖所示,將「且」字裡面的兩橫直接以數字2做代替,而「真」字則是以三個小圓點代替三橫呈現,如下圖所示。

and

創意部分改變示意圖

五、LAYAR內容設計

  設計漢字後,第二階段則是要將這些完成的漢字上傳至LAYAR的網路空間中。由於完成作品後學習者需要精準地辨識圖片才能獲得虛擬資訊,因此LAYAR對於上傳圖片的要求極為嚴苛,以下為LAYAR對於圖片的四項要求:

1. 圖片中不得有過多空白處

2.底圖不得有過多的文字

3.圖片內容過於相似(上下對稱、左右對稱等)

4.過大或過小的圖形

  以上四種因素皆會導致圖片辨識混淆甚至是無法辨識的結果。一開始設計上,研究者單純將主要辨識的漢字設計置於圖片中央,這也造成了能辨識的部分不足,因此研究者開始構思並進一步在畫面中加入其他的辨識部位。

  在第一階段將圖片上傳至網路空間時,原本的圖片(下圖左側)無法準確進行辨識,因此研究者開始思考如何在畫面中增加辨識部位。首先研究者在圖像主體周邊加入簡單的圖形與線條(下圖中右側),但是對於LAYAR軟體的圖片限制,此設計亦會造成對稱與相似的圖形。

第一階段設計圖

  設計第二階段,研究者改變前面加入圖形的想法,轉而在圖片中標記此研究的兩項主題「漢字學習」與「AR」,除了融入更多漢字以外,英文字體的增加能有效的幫助LAYAR辨識圖片,如下圖

完成版設計圖