![Artboard 2.png](https://static.wixstatic.com/media/fcbba6_a217ce9282fd480eae3a3bec011e6b0b~mv2.png/v1/fill/w_765,h_399,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Artboard%202.png)
COCA COLA CRM
Overview
Coca Cola Hong Kong would like to pitch for developing a new CRM app, and attract more coca-cola lovers to join the membership. Client suggested the style to be clean and think of some fun ways to attract people download and register the app, and focus on F&B collaboration with restaurants in Hong kong.
香港可口可樂公司想要製作一個會員手機程式,令更多可口可樂的粉絲成為會員。可口可樂公司建議整個手機程式的風格行簡約路線,並且嘗試思考一些有趣的方法吸引大家下載和註冊,還有加強宣傳與可口可樂合作的餐廳。
Research and Challenge
![coca-cola-smartphone-vending-machine-cok](https://static.wixstatic.com/media/fcbba6_7e666d7f3f33425486024bdfdf0706ab~mv2.jpg/v1/fill/w_348,h_349,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/coca-cola-smartphone-vending-machine-cok.jpg)
![Screen Shot 2018-08-09 at 12.27.40 PM.pn](https://static.wixstatic.com/media/fcbba6_6fd58374c5cc4278a42a9a37864d1a14~mv2.png/v1/fill/w_154,h_171,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screen%20Shot%202018-08-09%20at%2012_27_40%20PM_pn.png)
![Screen Shot 2018-08-09 at 12.27.54 PM.pn](https://static.wixstatic.com/media/fcbba6_d14b538516a34352a2858bffdb75992c~mv2.png/v1/fill/w_155,h_171,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screen%20Shot%202018-08-09%20at%2012_27_54%20PM_pn.png)
ref: create your character/ vita lucky draw mini-site campaign
![CMS Logo.jpg](https://static.wixstatic.com/media/fcbba6_4ec1a84569064ccabeb274554fde2912~mv2.jpg/v1/fill/w_156,h_160,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/CMS%20Logo.jpg)
ref: japan cokeon app
ref: Myx Philippines X coca cola
"Open happiness" is one of the branding values to Coca Cola. To match with the branding, the app can be more playful.
We studied Japan coca-cola app "Coke on". It collaborated with the vending machines in Japan, to show the locations of vending machines and users can collect stamps from buying. We also found that there were several campaigns relating Coca-cola with music. "Vita", one of the Coca-cola competitors in Hong Kong also launched a mini-site at that time. The mini-site asked people to create their own character and get the chance to win a prize in lucky draw.
在開始製作ui之前,我們參考了日本的可口可樂手機程式「coke on」,發現它主要標示出日本的自動販賣機,並且每次買可樂都可以儲存印花。另外也有一些廣告會將可口可樂和音樂結合在一起。而當時「維他」(其中一個與可口可樂競爭的公司)發起活動網站,讓大家創建自己的角色,並且手持維他飲料,就有機會參與抽獎、贏取獎品。
![Screen Shot 2020-12-18 at 6.59.46 PM.png](https://static.wixstatic.com/media/fcbba6_40092329152d4877aa5a6b5648fa2f71~mv2.png/v1/fill/w_599,h_253,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screen%20Shot%202020-12-18%20at%206_59_46%20PM.png)
After research, our initial thoughts on the key points of the app
![IMG_3260-1.JPG](https://static.wixstatic.com/media/fcbba6_fbe6667f430d43cda48c0a0c642044b8~mv2.jpg/v1/fill/w_366,h_366,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/IMG_3260-1_JPG.jpg)
draft
![IMG_3264.JPG](https://static.wixstatic.com/media/fcbba6_8c9a55d6d7634b9f81402d8880a43078~mv2.jpg/v1/fill/w_275,h_367,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/IMG_3264_JPG.jpg)
This is my first time handling UXUI project. After research, based on the past experiences on design project, I thought it was essential to make the app layout fancy and attractive. After the first regroup with account serving team, they commented on the app layout in the aspect of user-friendly.
這是我第一次參與uxui的project。經過資料搜集,一開始想要把程式介面做得很美觀,以為這樣能夠更有吸引力。後來第一次開會的時候,他們覺得可以更加以使用者為中心,設計得更加簡約、容易操作。
The concept of Coca-Coland
![Artboard 3.png](https://static.wixstatic.com/media/fcbba6_c2d35e339e30470292d40e923ae4df6e~mv2.png/v1/fill/w_783,h_410,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Artboard%203.png)
Registration page -
answer questions on drinking behaviour
like " how often do you drink Coca-cola" and "when will you drink Coca-cola"
![Artboard 4.png](https://static.wixstatic.com/media/fcbba6_ebe912e9a32d4f7bbae06b4a6debdcfe~mv2.png/v1/fill/w_468,h_468,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Artboard%204.png)
Profile page -
showing the "blood type" and points get by drinking coke
Many app games was popular due to it allowed people to create a virtual character, which creates a self-identity in the virtual world. Therefore, we created a coca-cola world called "Coca-coland", representing a community gathering all Coca-cola lovers in this world. We want to create unique relationship through an interactive fun way.
In Coca-coland, they have their own characteristics based on their drinking habit. After answering a few questions, the system will generate some data, showing on profile. People who often drink original coke, would be most likely "red blood people", if they also drink zero coke sometimes, they might be mix blooded.
很多手機遊戲程式很受歡迎是因為大家可以建立自己的角色,產生一種自我身份認同。因此我們為這個app訂立了一個主題「coca-coland」,代表這是一個集合了全部可口可樂愛好者的社區。我們希望藉此能夠與使用者創立一種特別的關係並且產生互動。
![reward03.png](https://static.wixstatic.com/media/fcbba6_6d79b2ceed1945e9b248e9c11c045dfd~mv2.png/v1/fill/w_238,h_515,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/reward03.png)
Redemption page -
showing the restaurants collaborated with Coca-cola
![reward01.png](https://static.wixstatic.com/media/fcbba6_8e5bbd7eb0da44ea8d406acfc668d675~mv2.png/v1/fill/w_238,h_515,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/reward01.png)
Reward mainpage -
showing the reward redemption
![Scan_2.jpg](https://static.wixstatic.com/media/fcbba6_90be5ff625ae4b42a175dcec120af5c9~mv2.jpg/v1/fill/w_238,h_515,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/Scan_2.jpg)
Reward page -
Co-coin represented the points given by drinking Coca-cola
Result
The pitching result is positive, client would like us to launch the crm project. They also give us other opportunity - Loreal Group "Vichy/ Cerave/ La roche-posay" crm app. However, I could not follow up the project as I went to another company. The project is still in a ongoing process.
整個比稿的結果是正面的,客戶挑選了我們公司繼續開發這個app。並且他們也因為這個project而給予了我們另一個機會,就是 - Loreal Group "Vichy/ Cerave/ La roche-posay" 的會員手機程式。不過因為我後來轉去了另一間公司,無法繼續參與全程的製作。
![01 vichy landing page with phone.png](https://static.wixstatic.com/media/fcbba6_a3324465946c487d97f3e61d5c384955~mv2_d_1200_2500_s_2.png/v1/fill/w_201,h_419,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/01%20vichy%20landing%20page%20with%20phone.png)
![04 vichy reward 01 with phone.png](https://static.wixstatic.com/media/fcbba6_29e2576a0f1246b591a560f15834440e~mv2_d_1200_2500_s_2.png/v1/fill/w_201,h_419,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/04%20vichy%20reward%2001%20with%20phone.png)
Coca Cola crm app pitching
Creative Director: Sam Or
Copywriter (Assitant Manager): Sarah Ng
Senior Designer: Winnie Wong
Copywriter: Crystal Wong, Kate Wong
Designer: Cecilia Leung
Loreal Group crm app pitching
Creative Director: Sam Or
Copywriter (Assitant Manager): Sarah Ng
Senior Designer: Toni Foo
Copywriter: Clarice Cheung
Designer: Cecilia Leung