▶패럴랙스(parallax)기능과 기술을 구성하는 원리

▶패럴랙스(parallax)기능과 기술을 구성하는 원리

---

실제 패럴랙스(parallax) 라는 단어는 변경을 의미하는 그리스어  parallaxis 에서 파생된 것이다. 인간의 눈에 가까이 있는 물체일수록 더 큰 시차를 가지고 있다. 이것은 달리말해 가까운물체가 멀리있는 물체보다 더 빠른 속도를 갖는 것처럼 보일 수 있음을 의미하기도한다.

웹페이지의 패럴랙스(parallax)기능은 어떤 원리로 만들어지는가?

웹디자인의 관점에서보면, 이는 가장 일반적으로 오브젝트 또는 배경의 레이어화를 통해 얻을 수 있다. 또한 이것은 웹페이지의 스크롤과 애니메이션의 속도로 깊이에 대한 착시를 이끌어낼 수 있다.

기술으로, 패럴랙스(parallax)효과는 고정된 뷰포트(viewport)에서 화면의 배경이미지 외의 다른 전경 요소들과 함께 스크롤링(scrolling)으로 이동을 할때 배경이 바뀌도록 함으로써 얻을 수 있을것이다. 배경과 관련된 크기 및 스크롤링속도의 차이(differences)는 일정한 깊이효과(여기서는 패럴랙스효과로 이해할 수 있음)를 만들어 내는것이다.

패럴랙스(parallax)효과는 어떤 경우에 활용하면 좋은가?

사실, 패럴랙스디자인이 웹페이지에 적용되기시작한것은 꽤 오래 전부터였다. 처음 등장했을때 이 것은 굉장히 주목받았지만, 다시 그 관심은 낮아지다가 최근들어 또다시 높아지고있는 느낌이다. 개인적으로는 이러한 흐름이 패럴랙스디자인의 가능성을 인식하게되었기 때문이라고 본다.

[사진 :  인터렉티브 콘텐츠의 예 , 매일경제 - 대한민국 1번 마, 내이름은 당대불패' ]

매일경제는 2014년 청마의 해를 맞아 기획컨텐츠로 '대한민국 1번 마, 내이름은 당대불패'라는 인터렉티브 콘텐츠를 제작하였다. 이 기사에는 텍스트, 사진, 영상, 인포그래픽등 다양한 형태의 콘텐츠들이 포함되어있는데, 중요한 것은 텍스트콘텐츠의 분량만 원고지160매 정도라는 것이다. 이것 자체를 '좋은 예'라고 볼 수는 없겠지만, 반대로 생각해보면 이런 인터렉티브 콘텐츠가 아니었다면 감히 생각도 못해볼 분량이다. 

패럴랙스는 단지 '신기한기능'에 그치지않는다.

다른 것은 다 제쳐두고 패럴랙스에 대해서 생각해보면, 사실 내가봐도 신기하긴하다. 그런데 이것만으로는 지속적으로 활용되기에는 부족하고, 그 이상의 활용을 가능해야만, 오래오래 사랑받으며 살아남는 법이다. 그렇다면, 패럴랙스기술을 효과적으로 사용하는 예가 무엇일까. 그것은 바로 '스토리텔링'이다. '패럴랙스+스토리텔링'은 어떻게 활용하느냐에따라 강력한 무기가 될 수 있한다.

패럴랙스가 스토리텔링에 있어 중요한 역할을 하는이유

페럴랙스기능이 스토리텔링 콘텐츠와 결합하게 되는 이유는 간단하다. 바로, 시각적효과로 몰입감을 주기때문이다. 아무리 훌륭한 콘텐츠와 그것을 감싼 스토리가 뛰어나다고 할지라도, 콘텐츠의 마지막까지 우리의 관심을 유지하기란 정말 쉽지않은 일이다. 

바로 여기서 패럴랙스의 기능이 스토리의 전개 및 완급조절을 하는 역할로 기능하곤 한다. 

패럴랙스기능을 적용한 많은 사례에서 우리는 특정위치까지 스크롤을 하면, 콘텐층의 '다음내용'이 시작되는 지점까지 화면이 '끌려가는 것 같은'느낌으로 이동하게 되는데 콘텐츠 기획자는 이를통해 사용자가 느낄 생각과 눈빛

​