[推坑] 分享自己寫的英文學習chrome extension

作者: shnovaj30101 (shnovaj30101)   2023-09-14 14:46:41
[專案分享]
在四年前我曾經在 ptt 上面發表了一篇關於單字學習的 side project。
內容是刻一個網頁介面來建立自己的單字學習庫,可以將自己在網路文章學習到的單字和例句輸進單字庫,然後在複習的介面上隨機跳出自己曾經加入的例句進行複習。
https://www.ptt.cc/bbs/Soft_Job/M.1560104666.A.775.html
結果我在版友的留言發現這功能 anki 已經幫我都做掉了,而且比我做的好多了XD
但因為 anki 原本的預設介面比較陽春,並不是我想要從例句複習生字的模式,所以我就想以 anki 為基礎建立一個我自己的單字學習工具。
後來掙扎加耍廢了四年XD,我總算是做出了一個雛形出來,我做了一個可以方便加入例句和生字到 anki 的 chrome extension。
這次專案的介面跟我之前的 project 非常相像,但是完全變成了 anki 的版本,想說對於會在網路上閱讀文章學習英文的人可能有用,就貼上來分享了。
這次專案的 github 連結:
https://github.com/shnovaj30101/shno_word_card_extension
已上架的 chrome extension 連結:
https://tinyurl.com/5at48ujk
(一)什麼是 anki ?
anki 簡單來說就是一個電子化的單字卡,不同的點在於它採用 SRS 演算法來安排每張單字卡出現的時間點,每張單字卡主要根據複習次數來決定下次出現的間隔時間。
一般來說複習越多次,記憶就越鞏固,所以下次出現的時間就會越長,並不會有卡片加越多,複習越繁重的情況出現。
anki 的設計看起來簡單,但卻非常大的提升了我們對於單字的記憶成效,如果用了 anki,記憶就變成了一個選擇,而不是一個模糊的概率事件。
簡單來說就是你要記憶的東西加進 anki,乖乖複習,這個東西一定記得起來,這個記得起來的時間甚至可以用年的單位去計算。
所謂的乖乖複習,也就只是在通勤或是任何的零碎時間,拿起手機點一點順過幾張單字卡就行了,既無腦又能填補人生各種無意義的時間碎片,真的很方便。
至於如何將 anki 應用在單字之外的知識學習,那又是另一個需要精進的課題,關於這方面的實踐,有一篇我覺得目前講的最好的文章,我把連結貼在下面:
https://zhuanlan.zhihu.com/p/65131722
對於系統的支援 anki 在 mac / windows / linux 都有桌面應用程式可以下載,ios / android 也用對應的 app。
在網頁上也有 ankiweb 可以使用,除了 ios 的 app 需要付費(約台幣 800 多),其他的都是免費的,如果免費仔想在 ios 上面用 anki,可以開瀏覽器使用 ankiweb。
但為了支持開發者,而且我會拿 anki 紀錄我從生活或書上所學到的知識,所以我是直接敗下去了,畢竟這是個很有意義的投資。
anki 在不同的裝置上面都能彼此同步,他是統一同步到 ankiweb 的個人帳號,所以要啟用同步功能,要先在 ankiweb 上面辦個帳號。
另外 anki 是 open source,所以有很多有用的 anki plugin 可以使用。
比如說有幫單字卡加入聲音的 AwesomeTTS,或是讓 anki 可以用程式進行操作的 ankiConnect,都是很不錯用的 plugin。
另外也可以用前端語言設計 anki 單字卡的介面 template,我現在開發的 chrome extension 就是搭配我自己設計的介面 template 來新增單字卡。
(二)如何使用這個 extension?
(1) 下載 anki
https://apps.ankiweb.net/
(2) 申請 anki 帳號
https://ankiweb.net/account/signup
(3) 下載 chrome extension 插件
https://tinyurl.com/5at48ujk
(4) 照著以下教學進行設定與使用
https://www.youtube.com/watch?v=hPJ2ZEg-lAc
(三)這個 extension 的優點
稍微研究了一下網友使用 anki 的方式,大部分人會選擇直接手動製卡,有些則是使用另一個我也覺得很好用的 chrome extension 叫做在线词典助手(以下簡稱 ODH):
https://tinyurl.com/bdfd8kcz
ODH 的功能真的很齊全,code 結構也寫得不錯,我在寫這個 side project 的時候也借鏡了很多他的專案架構。
我的 extension 和 ODH 的適用情境都是在網頁上閱讀國外文章的時候,可以針對不熟悉的單字,以例句的形式進行快速的製卡。
但在細節的使用情境還是有一點不一樣,ODH 是以一個單字為單位,也就是一張卡片考一個單字,但我是一個例句為單位,所以一張卡片可能會考多個單字(若例句內包含多個生字)。
雖然很多人提到一張卡片只能包含一個知識點,所以以一張卡片考一個單字是最好的。
但在我的學習經驗中,一個例句才是一個知識點,這些生字和他們共同組成的例句才是一個完整的情境。
況且當一個例句包含三個需要學習的生字,若我們分開製成三個卡,當在複習這個例句的時候,使用者當下只會看到其中一個生字 A 的答案,如果更不熟的是另一個生字 B,沒有辦法即時看到該生字 B 的答案是會降低學習體驗的。
ODH 優勢在於可以快速的查閱單字語發音,但在自由度上,中文翻譯好像只能使用他查閱的結果,不能用手 key。
我的 extension 雖然沒有自動查閱的功能,但單字形式和中文翻譯可以由使用者自己決定。
這裡並沒有說要和 ODH 一爭高下,相反的這兩個 extension 還可以互相輔助使用,查閱單字解釋可以用 ODH,然後用我的 extension 自行決定真正的題目內容。
另外 ODH 還有一個缺點是當生字是某個單字罕見的變體,ODH 就沒辦法顯示出正確的中文翻譯,甚至連浮動畫面都無法出現。
或是當題目是一個片語的時候,ODH 目前的功能好像也不支援,這樣我的 extension 提供的使用者自由度至少能順利的製卡。
(四)未來的開發方向
這個 extension 還有幾個可以持續進步的方向:
(1) 針對例句生成各種口音的語音,可能考慮用 anki 的 plugin 做實現
(2) 目前的 popup 介面只能點擊單個單字增加中文翻譯,沒有辦法選擇片語或是某段文字(雖然還是能手 key 單字的文字框讓他變成片語形式)
但如果能把點擊變成框選的形式,就能學習非空白分隔的語言了(ex. 中文和日文)
(3) 結合 OCR,那就可以將紙本的資料拍成圖片,自動辨識出文字,然後利用這個 extension 加到 anki,但目前還沒想好實際上要怎麼做
感謝大家花時間閱讀,歡迎大家試用看看並提供各種意見
作者: Csongs (西歌)   2023-09-14 18:49:00
先推一個
作者: yc0015139 (YCx)   2023-09-14 22:08:00
推推很好用
作者: mike8469 (mike8469)   2023-09-15 13:52:00
推!

Links booklink

Contact Us: admin [ a t ] ucptt.com