關於國泰世華銀行

從1971年成立的「台中第七信用合作社」開始，經歷了五十年的行業整併與擴張，形成了如今我們所熟知的國泰世華銀行。

國泰世華銀行約在2013年時開始進行海外擴張，分行與ATM遍佈東南亞，包括許多新興商業市場，例如泰國、越南等，近年來也積極發展網路銀行以及綠色投資。

客戶需求調查…

近年來「全人共好」、「環保」」意識抬頭，國泰銀行希望藉由本網站，推廣ESG、SDGs，做出ESG小學堂，為常見問題與投資誤區做出解答，但ESG的舉例及解釋以文字居多，因此希望規劃「人格分析測驗」，利用測驗的趣味、活潑的特性中和純文字的沈重感，同時連結永續投資商品，近一步推廣地球永續的理念。

提案之初，夏木樂對於ESG、SDGs的想法是：

「地球永續就像一部列車，科技的進步會帶者大家不斷往前，回首時看看我們走了哪些里程碑，不斷的前進與修正。」

但是，「列車」的形象要如何與台灣的受眾連結呢？

答案就是「捷運」，捷運通車至今已經過去了27年，每天不斷前進的意象深植人心，我們希望將每個停靠站打造成SDGs的一項指標，象徵人類社會共好前行。

延續捷運概念，我們將「列車」與「前進」的意象提取出，做成了首頁動畫的「環境列車」，並將無數小動畫安插在頁面中，這些小動畫就像環保一樣，一刻不曾停下。更透過「因為您點進這個網頁，樹木、花草開始生長」的概念，暗示「因為有您的參與，世界更美好」。

| 從首頁開始

載入頁面後地球上，許許多多的生物與植物開始慢慢浮現，最後變成一顆欣欣向榮的地球。

動畫跑完之後就停了嗎？沒有喔！地球後面的背景顏色仍不斷地在變化，像房間裡的呼吸燈一樣，象徵地球的循環不斷。

| ESG部分

「永續超級任務」的這個部分，為E（Environment環境）、S（Social社會）、G（Governance治理）的解析與實際案例敘述，內容以文字居多，像一個ESG小百科，為了不讓畫面太過嚴肅，我們選擇使用動態插畫來呈現。

| ESG人格天賦測試

首圖的北極熊，站在不斷縮小的冰上，提示人們全球暖化的急迫性威脅。

點進測驗後，會在按下答案跳下一題時，變更背景的明暗部分，如果題目回答得快，就會有出現一閃一閃的背景畫面，是一個隱藏的小彩蛋。

既然你誠心誠意的發問了，那夏木樂就超級友善（沒有大發慈悲）地告訴你！

我們在先前的許多文章中提過，網站的載入速度除了會影響SEO外，更會在數秒之間決定觀眾的去留，但Lazy Load這個技術是我們好朋友！

簡而言之就是在編輯網站的時候寫入code，讓網站只會載入目前我們所見畫面中的圖片或動畫，在點擊或下滑的時候才會繼續載入剩餘畫面，藉此減少一次載入的量體，讓載入更有效率。

本次測驗以近年來網路上非常流行的「16型人格測驗（MBTI）」為範本，針對投資人做分析，在測試結果中讓投資人更瞭解其自身的投資類型，也會針對短處給予投資心法與建議，在結尾時附上的ESG商品連結，也可以讓聰明的投資人快速地學以致用。

16種測驗結果也與16種瀕臨絕種的動物連結，動物則是以插畫呈現，緊貼網站概念與外觀，讓人更有帶入感。

此外，在做題目時有進度提示，不會做到天荒地老，是友善受試者貼心設計，在測試完成後還可以分享到社群平台，發揮社群影響力，使網站更有機會被看見。

這個網站為國泰ESG地球永續任務提供了一個生動的平台，讓投資人更深入地了解永續投資的價值和影響，並透過動畫、ESG資訊和天賦人格測驗，將投資和環保連結起來，鼓勵人們參與全球的永續發展目標，也讓夏木樂有機會用網頁設計的方式，參與地球永續發展的進程。

如果你也想做ESG相關網頁或心理測驗，歡迎您與夏木樂聯絡，讓我們為您量身打造最適合您的網頁，也歡迎點擊這裡，看看更多我們的作品喔！