나만의 유니콘 찾기 (What color is your unicorn?)

작동환경

  • PC, Mobile Web

개발환경

  • Client-side
    • jQuery, Underscore.js
    • Pure
    • Less
    • Velocity
    • Font-awesome
  • Tool
    • Yeoman
    • Grunt
    • Sublime Text
    • SourceTree
    • Git/Bitbucket
    • AWS S3
    • Google Analytics
    • Google Adsense

프로젝트 기간

  • 2014.11

URL

나만의 유니콘 찾기는 이대 시각디자인과 졸업전시회에서 본 Flora님의 작품에 영감을 받아,
웹 애플리케이션으로 만든 Collaborative project입니다.

Arnheim이 쓴 Art and visual perception의 “Color” 챕터에 있는 내용을 가지고
하나의 색상이 가질 수 있는 객관/주관적 성향을 ‘유니콘’이라는 상상의 동물과 연결시켰습니다.
심리테스트 질문들에 답변을 하며 자신의 성향과 일치하는 유니콘을 찾아가는 서비스입니다.
언어는 영어와 한국어를 지원하고 있습니다.

마케팅은 Google Trends에서 “Fun test”의 관심도가 높은
미국, 독일, 뉴질랜드, 영국, 호주, 싱가포르, 한국에 페이스북 페이지 마케팅을 전개하였고
10% 이상의 CTR이 발생하였습니다.
하지만 페이스북에서는 실질적인 광고 효과가 별로 없었습니다.

2015년 2월에 Twitter (#yourunicorns)와
여성 타겟의 다음 카페에서 Viral이 전개되어 총 PV 240,000을 돌파하였습니다.
일종의 인터넷 놀이 문화로 자리잡아 유니콘과 관련 된 팬픽도 출현하였습니다.

이 미니 프로젝트를 통해 기획부터 개발, 마케팅까지의
웹서비스가 출시되는 Whole process를 경험함으로써 뜻 깊은 경험을 얻었습니다.

새로 학습한 내용

  • Project bolierplate
    Yeoman의 webapp generator 이용
  • Automated Delivery
    Grunt를 AWS S3와 연동하여 커맨드라인에서 바로 배포
  • Static hosting
    S3의 Static hosting기능을 이용하여 저렴한 가격으로 컨텐츠 서빙
  • File Revision
  • Realtime Development Preview
    파일 수정 감지
  • JS/CSS Dependency Injection & Minify
  • Less (CSS Precompiler)
  • Velocity
    빠른 애니메이션 라이브러리
  • SNS 공유를 유도하여 바이럴을 이끌어내는 방법
  • 클라이언트 기반 i18n

본 프로젝트는 단독 개발하였습니다.
작동환경은 Web이며, PC/Mobile 에서 모두 구동 가능합니다.