반응형 웹 홈페이지 구축 이야기2_메인비주얼

울산과학대학교 반응형 웹 홈페이지 구축 이야기 

---

2. 메인 비주얼


반응형 웹으로 새롭게 리뉴얼하면서 크게 달라진 점 중 하나는 메인 비주얼 영역이다. 

리뉴얼 된 울산과학대학교 홈페이지 메인

 

홈페이지에서 메인 비주얼은 홈페이지의 가장 핵심 되는 영역이면서 학교를 상징하는 이미지를 형상화한 사진이나 그래픽 등을 만들어 넣는데 보통 시즌별로 이미지를 바꾼다거나 중요 홍보사항이 생겼을 때 슬로건과 함께 심미성을 고려한 이미지를 구성하게 된다. 

홈페이지를 방문했을 때 첫 이미지이기 때문에 비주얼을 한번 바꾸려면 몇 번의 보고를 올리기도 한다. 
그렇다 보니 이 비주얼 영역은 디자이너들이 가장 신경 쓰는 부분이기도 하다.

여름 캠퍼스풍경 비주얼이미지

시즌별 대학의 밝은 분위기를 나타내는 메인비주얼 

주요 홍보사항을 주요카피와함께 이미지화

리뉴얼을 진행하면서 주안점을 둔 부분 중 하나가 홈페이지의 기능적이고 효율적인 측면을 고려하여
비주얼 영역의 비효율적인 운영을 바꿔보려 하였던 점이다.
대학 홈페이지의 첫인상인 비주얼 이미지에
디자인적 심미성이나 이미지에 부여하는 의미, 상징성을 우선으로 하지 않고,
대학의 주요 이슈 및 홍보내용을 디자인하여 시의성 있게 전달하는 것에 중점을 두고 
시의 적절한 정보 제공과 홍보가 가능하도록
해당 비주얼에 대한 기사 연결 및 비주얼 영역 관리시스템을 만드는 것이었다.

대학의 주요 이슈사항이 반영된 메인비주얼

대학 홍보기사를 그대로 메인 비주얼에 당겨 오기엔 비주얼 영역에 맞는 이미지 리사이징, 그래픽 구성 등을 안 할 수가 없기 때문에 자동으로 기사를 노출하는 방식보다 비주얼 영역에 노출할 이슈나 홍보사항 기사 등을 선택적으로 등록하되 이미지는 별도로 작업하여 등록하도록 하였다. 

시의 적절한 비주얼 이미지의 변경은 해당 기사로의 유입도 쉽고 홍보도 더 효과적이었다. 
무엇보다 정보제공으로의 기능이 더해져 살아 있는 비주얼 콘텐츠가 되었다. 

물론 대표 슬로건, 홍보 이미지라도 단순 비주얼만이 아닌 클릭 시 관련 기사나 해당 글로 연결될 수 있도록 구성하였다.

전체 비주얼 이미지 보기를 클릭하면 현재 돌아가고 있는 비주얼 이미지 전체 목록을 볼 수 있다.

여러 개의 이미지(기사) 등록이 가능하여 다양한 뷰를 구현할 수 있는 점 도 장점이라 하겠다.

모바일에서 본 대학홈페이지

 

무엇보다 기존 시즌별 상징화된 비주얼 이미지 구성의 방식은 
이미지 요소 하나하나에 대한 해석과 의미를 담아야하는(보고를 위한 디자인) 피곤함이 있었는데 
시의성에 맞는 객관화 된 정확한 홍보 이미지의 구성으로 대부분의 사람에게 공감되는
중요 영역으로 변화 하였다.

직관적으로 정보를 알 수 있게 구성된 비주얼 영역이 대학 홍보에도 효과적이라고 생각한다.