Brook Preloader

Portfolio

讓聰明的UI設計幫助語言學習

Woodpecker
Share
Woodpecker UI CS_Pic02_1920x1080

背景

Woodpecker是為了幫助想要提升外語能力的進階學習者,所開發的一款語言學習應用程式。CRE8被賦予的任務,是要重新設計程式的UI策略與視覺元素,讓這款應用程式,能夠在其他類似的語言工具中脫穎而出,並替使用者打造出能夠方便跨設備,且更沉浸式的學習體驗。

Woodpecker UI CS_Pic07_1920x1080

挑戰

程式的開發者希望可以整合各種功能,並提供大量豐富的閱讀和串流媒體學習素材;為了應對海量的內容,設計師必須先消化、過濾所有資訊,挑出重點,並有系統地將功能進行分類,才能提供使用者友善的瀏覽與操作體驗。

Woodpecker UI CS_Video03_1920x1080

解決方法

影片

其中一個最主要的功能,即是透過觀看為母語使用者所製作的影片來學習語言。為了要充分利用Woodpecker豐富的影片資源,設計師使用底部導航工具列以及清楚的圖示,讓學習者可以在不同的主題和頻道之間輕鬆切換,並選擇合適的輔助工具來理解影片內容。

Woodpecker UI CS_Video04_1920x1080

網頁瀏覽器

學習者還可以透過程式的網頁瀏覽器功能來閱讀文章,並同步查找單字的意思。操作簡易的下拉式選單,方便使用者自定義最喜歡的新聞平台列表;更進一步,還可以收藏或分享選定的文章,並回溯閱讀紀錄。

Woodpecker UI CS_Video05_1920x1080

字典

聰明的互動式字典功能設計,讓使用者在觀看影片或閱讀文章時,能夠非常直覺並即時地查找字詞的意義與發音,讓詞彙學習更有效率。為了讓體驗更全面,並新增了圖卡功能,讓練習與複習的過程都更加輕鬆。

Woodpecker UI CS_Pic06_1920x1080