如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

1 評論 2616 瀏覽 4 收藏 11 分鐘

編輯導語:當今很多成年人不能很好地處理財務問題,更不必說理財,因此當代社會對于孩子的金融教育也一直缺失的。除此之外,家庭矛盾也是不可避免地一個話題。作者通過一款兒童銀行 APP 的設計嘗試解決這一問題,并為我們帶來了整個設計過程的案例分析。通過上中下三篇文章,讓我們一起跟隨作者感受整個設計流程,從中學習,一定會有非常大的收獲!

一、設計

有了線框圖以后,我們覺得是時候開始深入這一兒童銀行 APP 的概念設計了。首先要明確設計的目的是讓銀行這一對孩子們來說枯燥無味的行業變得更加有趣和友好,讓孩子們想要玩耍愛上這款 APP。

兒童銀行概念設計師 Rihards 在工作中在第一版的設計中缺失了孩子們與 APP 之間的情感聯系,很難讓孩子們擁有情緒板中描繪的情感。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

第一版設計稿

我們需要整合一種兒童可以理解的視覺語言,讓他們感覺理財就像游戲一樣,并在孩子們心中喚起那些娛樂,沉浸參與和愉悅的情感。

目的是給孩子帶來一種進入玩具店或糖果店時的感覺:他們非常開心,所有的東西都想試一下,而父母則聽到:”媽媽,爸爸,快過來! 這個好好玩!”

“多彩誘人的糖果店” 攝影:吉姆-拉里森。

情緒板里的這張圖生動的展現了我們想在 APP 中營造的氛圍。

1. 設計調研

我們的團隊開始發散新的設計方向,思考如何鼓勵兒童使用 APP,我們知道這是一個艱巨的任務,因為我們只擁有成年人的視角。我們必須喚醒內心的童真,潛心研究充滿了手游、動漫和動畫片的兒童內心世界。我們仔細研究了他們是如何設計的,突出了哪些元素,以及為什么孩子們會喜歡它們。

我們需要喚起孩子心中那種探險的好奇心,就像他們進到游樂園里一樣對嘗試新事物非常興奮。

在最初的概念中,配色偏冷色調,會導致用戶聯想到孤獨、安靜的氛圍。

我們必須讓其充滿激情和樂趣,使用更明亮的色彩來設計頁面。為了讓 APP 有 “活的” 的感覺,我們必須在背景中加入動畫、一些特效和動態的元素,就像游戲一樣,這樣孩子們就不會感到無聊。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

藝術作品:Jared MacPherson

例如,《農場英雄超級傳奇》 這款游戲的場景插畫非常好看,用戶可以在其中幾乎無邊界地瀏覽地圖中的風景,就像是在旅行一樣。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

藝術作品:Jared MacPherson

每一步要點擊的地方很清楚,玩家一步一步跟隨指引沒有任何困惑,同時還可以欣賞美麗的風景~ 讓他們甚至有 “我想去這個地方” 的想法。

《Numberblocks》 是一部關于數字的動畫片,它循循善誘地引導孩子們學習數學,它傳遞的情緒是動態和有趣的,并且在動畫片中使用 3D 的形式已經成為標準。

孩子們和家長們都喜歡 3D 動畫節目,因為 3D 的效果在視覺上更能吸引用戶的注意力,看起來更有趣更真實,對動作的描繪也很到位。我們喜歡這個創意,因為孩子們可以感覺到他們是動畫片的參與者,并以更愿意接受引導和學習。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

Numberblocks 是由藍色動物園工作室創作的系列動畫,由 CBeebies 播出。

在我們的團隊中,每個人都分享了他們對設計的想法,對冒險的聯想和對童年的回憶。例如,我們的一位同事分享了一本童話書,”Martha B. Rabbit and Daphne the Forgetful Duck”,作者 Shirley Barber,這本書包含了她小時候看的所有童話故事。書里的每一頁都充滿了小細節,而這正是講故事的關鍵。例如:如果畫了一個房子,那它就必須要看起來像是有人住在里面。

2. 設計草圖

在收集了所有的參考資料后,我們確定團隊的主要目標是設計一個動態的童話故事般的場景,讓孩子們有探險的感覺,在這里能感受到風,能觸摸到草坪和云朵。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

場景構建概念稿第一版

主要場景完成后,我們設立了第一批任務,是父母們經常分配給孩子們的家務 ── 鋪床、倒垃圾、上音樂課,當完成所有任務的時候,他們還會得到一份禮包,這將激勵孩子們完成他們的任務,賺取他們的零花錢以及其他父母承諾的獎勵。

我們希望孩子們能積極參與到家務中,并更好地了解家務,為自己賺取零花錢。

這樣他們就能理解錢不是憑空而來的,他們必須付出努力才能賺到錢。這讓整個家庭對日常任務的價值達成共識,同時還能幫助兒童建立正確的價值觀。

然后,我們補充了一些樹,并在草地上增加了更多的細節,使設計更加逼真和豐富──讓孩子們感覺像在玩游戲或身處動漫的世界中。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

帶有 UI 元素的主頁

我們還想要加一些 UI 元素,他們不僅僅是疊加在界面上,而是融入到場景中,比如散落在路上而不是很突兀地漂浮在空中的任務,孩子們也會因此有更流暢的體驗,一天的旅程也會更加有趣。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

第二版設計稿

當我們在界面上進行了越來越多的設計時,它已經并不像我們最初設想的那樣簡潔。主要是因為最開始的設計太沉悶,有太多的色彩,屏幕上沒有焦點,孩子們不知道要點擊哪里。我們不得不重新審視為孩子們定義的 JTBD[1] 清單,并對其進行優先排序,以確保該 APP 能夠引導孩子們實現他們的目標。

([1] JTBD 全稱是“Jobs to be done”,這個概念由哈佛大學教授 Clay Christensen 在 2003 年左右逐漸提出形成的,是指待完成的任務,而對于我們做用戶需求分析時最本質的思考,就是迫使我們去關注結果,也就是用戶要用這款產品去完成什么任務,而不是具體的功能,亦或是細枝末節的體驗。)

3. 轉變為 3D 場景

在收集了團隊的反饋后,我們知道應該回到設計調研階段,需要跳出傳統做設計的方式去思考。

我們知道這不是一件容易的事,需要付出努力去實現它。我們相信,3D 的效果可以給孩子們提供之前缺少的情感氛圍和動態的場景。而且,更加現代化的場景更易使兒童接受。

在用 Blender 制作的第一個測試場景中,我們的目標是弄清楚如何制作植被,如何使草和樹更有細節,但又不像照片那樣真實。我們想保持一種獨特的風格,而只有手繪能實現我們想要的感覺。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

帶有樹木和手繪道路的第一個測試場景

我們搜索了一些例子,并在 Carlos Cavalcante 的 Twitter 頁面上發現了驚艷的作品。Carlos 發表過一些關于他用 Blender 制作 3D 島嶼的教程,這對我們理解如何實現卡通般的風格和感覺有很大幫助。

原創精選|如何幫助兒童學習金融知識?這款銀行游戲設計一定可以給你啟發(下)

 

作者:UXDA

原文:https://uxplanet.org/ui-ux-case-study-banking-as-a-game-saving-childrens-financial-future-135fada0680

譯者:吳鵬飛;審核:張聿彤;編輯:劉麗

本文由 @三分設 原創發布于人人都是產品經理,未經許可,禁止轉載

題圖來自 Unsplash,基于 CC0 協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. App 叫什么?

    來自福建 回復