[서채홍의 디자인커뮤니케이션 27] “생일 파티에 기부하세요” – 기부하는 이의 마음을 헤아리는 인터랙티브 디자인 사례

미국에 ‘Birthday Wishes’라는 자원봉사단체가 있습니다. 노숙자 쉼터에 있는 어린이들에게 생일 파티를 열어주는 일을 합니다. 이곳에서 아이들은 대부분 생일을 기념하지 못합니다. 함께 있는 부모(주로 엄마)가 축하 케이크나 선물을 마련할 힘이 없다 보니 생일이 돌아와도 아이에게 일부러 알려주지 않는 경우도 많다고 합니다. 노숙자 쉼터에서 봉사활동을 하다 이런 사실을 알게 된 이들이 뜻을 모아 2002년에 ‘Birthday Wishes’를 설립했습니다. 지역의 노숙자 쉼터 한 곳에서 시작해 지금은 매사추세츠, 로드아일랜드와 롱아일랜드, 뉴욕에 있는 185개 이상의 노숙자 쉼터에 Birthday Wishes 프로그램을 정착시켰다고 합니다.

Birthday Wishes는 자원봉사와 기부로 운영합니다. 이 단체 홈페이지엔 ‘생일 파티 기부’를 적은 금액으로도 누구나 쉽게 할 수 있도록 배려한 매력적인 인터랙티브 페이지가 있습니다. 홈페이지 아래쪽에 ‘BUILD-A-BIRTHDAY’라 쓰인 메뉴로 들어가 볼까요?

1. 기부하는 사람의 미션 정의하기

BirthdayWishes02

생일 케이크에 촛불이 밝혀져 있고 소녀가 수줍게 웃는 영상이 보입니다. 화면 위로 삐뚤빼뚤한 손글씨 체로 문장이 떠오릅니다.

우리가 할 일(mission)은 단순합니다.
집 없는 아이들에게 생일 파티를 열어주는 겁니다.
왜냐하면, 모든 아이는 생일이 있으니까요.
하지만 생일 파티는요? 그건 당신에게 달렸답니다.

이 단체가 하는 일과 기부자가 이 페이지 내에서 수행해야 하는 임무가 일치합니다. 무엇을 어떻게 왜 기부해야 하는지를 감성적인 화면으로 전달합니다.

2. 기부 범위 정하기

BirthdayWishes05

다음 단계에서 기부할 물품을 선택합니다. 정지된 화면입니다. 테이블에 소녀가 앉아 있고 생일 파티에 필요한 물품이 귀여운 드로잉으로 그려져 있습니다. 풍선 2달러, 케이크 11달러, 양초 1달러, 고깔모자 2달러, 접시와 포크 3달러 등 물품마다 값이 표시되어 있습니다. 기부를 원하는 만큼 고릅니다. 물품을 클릭하면 ‘뿅’ 터지면서 실물 사진이 나타납니다. 물품을 선택할 때마다 아래에 액수가 더해져 표시됩니다. 파티 물품 모두를 선택하면 100달러입니다. 이 단계에선 기부할 물품과 액수를 정하는 것뿐 아니라, 내가 기부하는 생일 파티가 어떤 풍경일지 미리 알 수 있습니다.

3. 기부 퍼뜨리기

BirthdayWishes07

물품을 고르고 기부 버튼을 누르면 처음 나왔던 영상이 다시 나타납니다. 고맙다는 문장이 뜨고 나서 소녀가 생일 케이크의 촛불을 끕니다. 소녀가 생글생글 웃는 화면 위로 기부자의 친구를 초대하길 권하는 메시지가 나옵니다. 기부자의 트위터, 페이스북, 핀터레스트에 이 페이지를 소개할 수 있습니다. 선택하지 않더라도 마지막 단계로 넘어갑니다. 이제 일반적인 기부 형식의 문서에 개인정보를 입력하면 모든 과정이 끝납니다.

어떤가요? 쉽고 간단합니다. 과정을 간추리면 이렇습니다. 이 기부의 목적과 의미를 일깨워줍니다. -> 기부 범위를 눈으로 보며 직접 선택합니다. -> 적은 돈으로도 기부할 수 있습니다. ->  부담 없이 친구에게 동참을 권할 수 있습니다. -> 중간에라도 마음이 바뀌면 언제든 첫 화면으로 옮겨 가 다시 선택할 수 있습니다.

기부하는 사람의 마음을 잘 배려해 설계한 좋은 디자인 사례입니다.

서채홍

참조와 그림 출처: www.birthdaywishes.org

BUILD-A-BIRTHDAY 페이지 바로가기 

2 Responses to [서채홍의 디자인커뮤니케이션 27] “생일 파티에 기부하세요” – 기부하는 이의 마음을 헤아리는 인터랙티브 디자인 사례

  1. Pingback: [서채홍의 디자인커뮤니케이션 27] “생일 파티에 기부하세요” – 기부하는 이의 마음을 헤아리는 인터랙티브 디자인 사례 | All that All

  2. Pingback: [서채홍의 디자인커뮤니케이션 27] “생일 파티에 기부하세요” – 기부하는 이의 마음을 헤아리는 인터랙티브 디자인 사례 | All that All

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s