메뉴 바로가기 본문 바로가기
상단으로 이동

웹에이전시

Introduce the best projects with valuable customers

메테우스자산운용 Metheus_리액트

Overview

[웹사이트 소개]

메테우스자산운용은 약 3조 억 원 이상의 부동산, 주식, 채권 운용 경험과 노하우를 통해 고객에게 금융과 부동산의 새로운 가치를 제공하며 급성장하고 있는 자산운용 전문기업입니다. 다각화된 포트폴리오로 안정적인 운용수익과 초과수익을 창출하는 메테우스자산운용은 초보 투자자들의 첫걸음부터 정확한 가이드를 제공하고 수익을 극대화하여 신뢰와 만족도를 높입니다.

이번 리뉴얼 프로젝트는 웹사이트를 통해 메테우스자산운용의 미션과 비전을 다양한 디자인 모티브와 액션을 통해 흥미롭게 이해할 수 있도록 하여 고객들로부터 강한 신뢰를 이끌어 내도록하는 것이 가장 큰 목표였습니다. 또한 부동산과 펀드 운용에 관심 있는 사람들이라면 누구나 쉽게 이해할 수 있도록 정보를 새롭게 구조화하였으며 투자정보를 쉽게 파악하고 이해할 수 있도록 주요 정보에 대한 접근성을 우선적으로 고려하였습니다.
 

 

[특징]

“기업의 새로운 아이덴티티 구축”

기존 웹사이트가 갖고 있던 기업의 어두운 이미지와 흔히 자산 운용 사이트가 가진 획일적인 특징에서 벗어나 메테우스자산운용만의 투자 전략을 보여줄 수 있는 새로운 디자인 인터페이스와 시각적 요소를 구축하였습니다. 기업의 CI에서 디자인 모티브를 가져와 보석의 표면과 같은 폴리곤 형태를 웹사이트 곳곳에 사용하여 기업을 고급스럽고 차별적으로 표현했으며 CI 컬러에 국한되지 않고 다양한 컬러를 활용하여 기업의 다각화된 면모를 보여주고자 하였습니다. 단순한 자산 운용 사이트가 아닌 메테우스자산운용의 ‘브랜드 파워’를 웹사이트에 녹이기 위해 시각적으로 강조했으며 사용자들이 웹사이트를 통해 기업의 가치를 빠르게 이해할 수 있도록 디자인했습니다.

 

“강렬한 인터랙션”

기업의 가치와 비전을 강렬한 인터랙션 효과를 통해 직관적으로 표현하여 사용자들이 지루해하지 않고 웹사이트를 탐색할 수 있도록 제작하였습니다. 특히 ‘운용자산 현황’ 페이지에서 기업의, 자산과 가치를 객관적인 지표와 함께 다양한 모션 효과를 주어 시각적으로 강조하고 사용자들의 시선이 집중될 수 있도록 디자인했으며 단순히 수치적인 측면이 아닌 기업의 현재 가치와 미래에 대한 전망 인터랙션을 통해 효과적으로 보여줌으로써 사용자의 이탈률을 줄이고자 하였습니다.

 

“효과적인 정보 전달”

사용자들이 필요로 하는 정보들을 구조화하여 최적의 메뉴들을 GNB에 배치하였으며 사용자들이 효과적으로 정보를 취득할 수 있도록 직관적인 인터페이스를 설계하였습니다. 또한 상단에 GNB을 고정함으로써 메뉴별 접근성을 높였으며 콘텐츠 중요도에 따라 메뉴 순서를 재배치하여 기업에서 강조하고자 하는 정보를 순차적으로 보여줄 수 있도록 하였습니다. 디자인 측면으로는 메뉴별 콘텐츠를 분석하여 콘텐츠 특성에 따라 효과적으로 정보를 보여줄 수 있는 레이아웃을 고민하였으며 페이지별 통일성은 부여하되 디자인에 다름을 주어 정보의 차별성을 시각적으로 전달하고자 하였습니다.

 

“운용현황 서비스 제공”

현재 기업이 갖는 전체 운용현황을 직관적으로 확인할 수 있는 서비스를 제공합니다. 메테우스자산운용의 운용 데이터들을 지도에 표기하여 사용자들이 데이터의 정보와 위치를 파악할 수 있도록 콘텐츠를 구성하였으며 PC, 모바일, 태블릿 등 모든 디바이스에 최적화될 수 있는 UI를 디자인하였습니다. 또한 데이터들이 지속해서 업데이트될 수 있도록 관리자 페이지에 기능을 추가하고 사용성을 강화해 기업의 관리자가 지속해서 운영할 수 있는 사이트로 제작하였습니다.

 

“React Website”

메테우스자산운용 웹사이트는  자바스크립트 라이브러리인  '리액트'로 제작되어 빠른 업데이트와 함께 렌더링 속도를 개선하였습니다. 또한 리액트의 특징에 따라 유지보수성을 증가시켜 지속 운영할 수 있는 사이트로 제작했습니다.

Keywords

  • 기업.단체 소개
  • 금융.보험.투자.자산운용
  • 부동산.임대.분양.시행
  • GDWEB Design Awards
  • 한국어