Renewal ProjectHSG Website Platform
Project
Overview
HSG는 기업 구성원의 역량 강화를 위한 전문 콘텐츠를 제공합니다.
다양한 교육과 서비스를 한 눈에 볼 수 있고 서비스를 충분히 인지할 수 있도록
사용자 경험을 개선하고자 합니다.
카테고리 중심의 직관적인 구조
전문 교육 기관으로서의 신뢰감을 강조
모바일 및 태블릿 환경에 최적화된 반응형 웹 디자인
Project Strategy
사용자와 운영 측의 니즈를 바탕으로, UX 전반의 개선을 위한 전략을 수립하였습니다.
정보 구조, 디자인 언어, 반응형 환경, 접근성 측면에서 일관된 경험을 제공하는 데 중점을 두었습니다.
지식 중심의
콘텐츠 마케팅 강화
단순한 서비스 소개를 넘어, 자체 제작한 고품질의 지식 콘텐츠를 전면에 내세워 잠재 고객을 유입시키는 전략을 취합니다.
솔루션 중심의
데이터 가시화
추상적인 교육 개념을 나열하기보다, 구체적인 수치와 검증된 데이터를 시각적으로 전달하여 고객의 의사결정을 돕습니다.
사용자 행동 유도 중심의
전환 최적화
콘텐츠를 소비하는 사용자가 자연스럽게 교육 문의나 제안서 요청으로 이어지도록 설계합니다.
Design Solution
전문적인 지식 콘텐츠를 직관적인 UI와 정돈된 데이터 시각화로 연결하여,
브랜드의 신뢰도를 높이고 고객의 전환을 자연스럽게 유도하는 콘텐츠 허브형 브랜딩 솔루션입니다.
Design
Keywords
HSG의 아이덴티티를 잘 드러낼 수 있는 비주얼 키워드를 선정하여
이를 시각적으로 녹여낸 디자인 시스템을 설계합니다.
기업 교육 브랜드로서의 권위와 신뢰감을 줄 수 있는 시각적 장치
복잡한 교육 컨설팅 정보를 사용자가 한눈에 파악할 수 있도록 설계
방대한 지식 콘텐츠와 실제 비즈니스 솔루션 사이의 유기적인 흐름을 만드는 디자인
Design System
정보 제공량이 많기 때문에 시각적 피로도를 최소화하는 무채색을 위주로 사용하며,
전문성과 신뢰성을 강조하는 퍼플과 블루 계열 컬러를 아이덴티티 컬러로 채용해 다양한 교육을 제공하는 기업의 이미지를 전달합니다.
Color System
Font
SUIT Sans
Outfit
Main page
View
Main Banner
새로 개설된 교육 및 진행중인 교육을 노출하여 사용자에게 지속적으로 새로운 소식을 전달합니다.
Quick Menu
자주 사용하는 메뉴를 바로가기 버튼으로 노출하여 사용자의 편의성을 높였습니다.
Best Program
HSG에서 가장 인기 있는 교육 프로그램을 큐레이팅하여 사용자에게 유용하고 재미있는 주제로 선보입니다.
Recommend Program
추천할 수 있는 HSG의 교육 프로그램들을 노출하여 흥미로운 콘텐츠를 전달합니다.
Monthly Program
매달 제공되는 교육 프로그램을 강조 및 노출하여 사용자에게 다양한 프로그램 개설 소식을 전달합니다.
HSG News
여러 소식들을 보여주는 영역으로, 깔끔하고 직관적인 레이아웃과 시선을 집중시키는 디자인 배너로 구성하였습니다.
Best Review
객관적인 지표와 베스트 리뷰를 모션으로 영역 안에서 많은 정보를 접할 수 있도록 정리하였습니다.
Other pages
Sub page
심플하고 깔끔한 스타일의 UI를 서브페이지에도 적용했습니다.
일러스트를 콘텐츠에 활용하여 재미요소를 더하고 직관적인 UI를 완성합니다.
Mobile
PC와 동일한 콘텐츠를 모바일 환경에서도
불편함 없이 최적화하여 볼 수 있도록 구성하였습니다.
RenewalHuman Solution Group
Credits
Product Manager
- An KyungMin
Design
- Han SeHui
- Lee JiEun
- Kim MiJoo
Development
- Lee InHo
- Lee MinKyung
- Race