KDB산업은행

Change Flexible!
Building a Multi UX Platform
Change Flexible!
Building a Multi
UX Platform

KDB산업은행 홈페이지 및 서비스 채널

  • Web site
  • 2019.05.07
 Change Flexible! Building a Multi UX Platform! Change Flexible! Building a Multi UX Platform!
KDB산업은행은 사용자 환경의 고도화, 핀테크 시장의 급격한 성장, 금융 시장의 신기술 도입 등 금융 업계 패러다임의 변화에 부응하고 선진적인 통합 금융 서비스를 제공하고자 이번 프로젝트를 진행했습니다. 대고객 금융 서비스를 전폭적으로 개선하고 선도적으로 강화하기 위해 자사 홈페이지, 인터넷 뱅킹을 비롯, 패밀리 사이트, 글로벌 사이트, 스마트폰 뱅킹, CMS, ATM, UMS에 이르기까지 자사의 모든 서비스 채널을 새롭게 구축했습니다.
ANALYSIS 사용자 UX 리서치와 현장의 목소리를 통해 해답을 찾다
ANALYSIS 사용자 UX 리서치와
현장의 목소리를 통해
해답을 찾다
KDB산업은행은 대고객 금융 서비스 환경 개선에 앞서 사용자 UX 리서치를 진행했으며, 기업 고객을 대상으로 정책 금융 업무를 수행하는 국책은행이라는 고정적인 이미지를 탈피하기 위해 환경의 변화에 빠르게 대응하기 위한 서비스 환경 개선과 개인 고객에게 보다 친근하게 다가가기 위한 브랜드 이미지 개선이 필요하다는 결론 하에 프로젝트를 기획했습니다. 그 첫 단계로 기업과 개인을 포함한 대고객을 대상으로 디자인 소비 성향 분석 및 디자인 선호도 조사를 진행했습니다. 특히 디자인 선호도 조사는 사전 사용자 UX 리서치 데이터를 기반으로 제작된 프로토타입을 바탕으로 다양한 방식(보드 투표, 임직원 정성 조사, 홈페이지 투표, 내부 인트라넷 투표, 기업체 방문, 영업점 방문)으로 진행됐습니다.
  • 도시적이다
  • 안정되다
  • 예의바르다
  • 체계적이다
  • 논리적이다
심미적
  • 고지식하다
  • 보수적이다
  • 당당하다
  • 정적이다
  • 깊다
개성적

부정적인 이미지를 개선하고 긍정적인 이미지는 더욱 강조할 수 있는 브랜드의 이미지 변화 필요

DIRECTION
사용자는 복잡하고 제각기 다른 형태의 많은 정보에 싫증을 느끼고 있었으며, 단순하면서도 직관적인 정보, 자주 이용하는 메뉴의 접근성 향상, 사용 환경 개선 등에 명확한 니즈를 가지고 있었습니다. 이를 개선하기 위해 관련 키워드를 도출하고 개편 방향을 설정했습니다.
  • KDB

    Minimal
    +
    Essence

    KDB다움의 강점은
    더 직관적이고 돋보이게
  • Innovation

    Trend
    +
    VIsual Identity

    혁신적이고 새로운
    브랜드 아이덴티티 재정립
  • change Flexible

    GUI
    +
    Layout
    +
    Interaction

    향상된 사용자 경험제공을 위한
    유연함과 확장성
CONCEPT
‘다양한 환경에서도 일관되고 지속 가능하며 변화에 유연한 UI를 통해서 긍정적인 사용자 경험을 제공한다’는 의미의 ‘Change Flexible! Building a Multi UX Platform!’을 채널 공통의 슬로건으로 정하고, 브랜드 주 컬러인 ‘블루’와 창의 및 변화를 상징하는 ‘바이올렛’ 컬러를 연결해 그라데이션 효과를 주는 방식으로 새로운 컬러 시스템을 정의했습니다. 또한 아이콘 그래픽 쉐입 등 KDB산업은행의 심벌과 서비스 가치를 모티브로 디지털 서비스 환경에 적합한 KDB산업은행만의 시각적 언어와 UI를 재정립했습니다.
KDB다움

본질과 긍정의 요소는 유지하며 고객의 니즈에 유연하게 변화해가는
New KDB산업은행의 서비스와 사용자 경험을 담았습니다.

본질과 긍정의 요소는 유지하며
고객의 니즈에 유연하게 변화해가는
New KDB산업은행의 서비스와
사용자 경험을 담았습니다.

유연한변화
SERVICE 빅데이터와 고도화된 핀테크를 기반으로 한 금융 서비스 편의성 강화
SERVICE 빅데이터와 고도화된
핀테크를 기반으로 한
금융 서비스 편의성 강화
기존 뱅킹 고객들의 방대한 거래 내역을 분석해 새롭게 설계한 고객 맞춤형 서비스를 ‘MyKDB’ 에 직관적으로 제공했습니다. 고객의 이용 패턴에 맞춰 주로 이용하는 계좌를 자동으로 우선 배치하고 해당 계좌의 상세 내역을 빠르게 확인할 수 있도록 하는 ‘자주 찾는 계좌’ 서비스와 공과금 납부 등 주기적으로 반복되는 뱅킹 업무를 알아서 챙겨주는 생활 밀착성 ‘지능형 알림’ 서비스, 추가 정보를 반복해서 입력할 필요 없이 기존 거래 정보만으로 즉시 이체가 가능한 ‘원 클릭 이체’ 서비스 등을 제공해 실질적인 업무 효율성을 높였습니다.
안전하게, 간편하게, 편리하게 뱅크 사인, 간편 비밀번호, 복합 바이오 인증 등을 통한 간편 인증이 가능해지고, 영업점 방문 없이도 본인 명의의 휴대폰, 이체 가능한 당·타행 계좌, 신분증만 있으면 온라인상에서 바로 수행할 수 있는 뱅킹 업무가 더욱 다양해짐으로써 비대면 서비스에 대한 급증하는 수요를 충족시킬 수 있게 됐습니다.
언제 어디서든 중단 없는 상품가입 고객이 온라인상에서 상품 가입을 진행하다 중단하더라도 PC, 모바일 등 기존의 사용자 환경과 상관없이 해당 업무를 이어 처리할 수 있도록 하는 ‘무중단 서비스’를 제공해 복잡한 절차를 반복 수행해야 하는 불편을 해소하고 향후 모바일 우선주의 서비스로 개선해나갈 수 있는 여건을 마련했습니다.
기업 지원 서비스 환경 개선 여러 메뉴 및 위치에 산재되어 있던 기업 전용 콘텐츠를 기업 유형에 맞춰 통합 제공할 수 있도록 별도의 기업 금융 정보 플랫폼을 구축했습니다. 이로써 기업 고객은 소속 기업에서 필요로 하는 정보, 상품, 서비스 등을 쉽게 검색, 확인할 수 있게 됐습니다.
DESIGN SYSTEM 채널의 공통기준 마련, 쉽고 직관적인 디자인언어로 소통
DESIGN SYSTEM 채널의 공통기준 마련,
쉽고 직관적인
디자인언어로 소통
오픈 시점의 디자인 소비 성향을 예측하는 것도 중요했지만, 홈페이지와 인터넷 뱅킹 외에 패밀리 사이트, 글로벌 사이트, 스마트폰 뱅킹, CMS, ATM, UMS 등 모든 채널이 함께 새롭게 구축되는 만큼 다양한 환경에서도 일관성을 유지할 수 있는, 쉽고 단순하면서 유연한 공통의 기준을 만드는 것이 필요했습니다. 우선적으로 브랜드 재정립으로 도출한 디자인 에센스를 바탕으로 공통의 UI•UX 스타일 가이드를 정의해 모든 채널이 일관성 있는 톤 앤 매너를 유지할 수 있도록 하는 데 집중했습니다.
New KDB UI/UX
STYLE GUIDE
  • UMS
  • HOMEPAGE
    FAMILY SITE FAMILY
    SITE
  • GLOBAL
  • ATM
Color #035DCC
#013395
#4956EA
#D6006D
#333333
#666666
Icon
Layout Platform

대표 홈 메인과 개인, 기업, 글로벌, 패밀리, 보안 서비스 등의 랜딩 페이지는 서비스 성격별로 차별화를 두고 최적화했으며, 특히 큰 틀에서는 기능과 형태로 대표되는 디자인 플랫폼을 정의해 운영상의 유연함과 일관성과 모두 확보했습니다.

Parallax ‘홈 메인 화면’의 브랜딩 영역은 시원한 전체 화면으로 구성하되 패럴럭스 스크롤링 효과를 부여해 변화를 줬으며, 고객의 편의를 위해 업무에 꼭 필요한 핵심 메뉴를 선별해 배치했습니다. 고객이 콘텐츠에 녹여진 브랜딩 메시지는 물론, 시즌별 메시지의 변화를 효과적으로 느낄 수 있도록 디자인했으며, 운영 면에서도 콘텐츠의 대표성과 중요도를 고려해 유연하고 전략적인 배치가 가능하도록 재구성했습니다. 또한 서비스를 성격별로 구분해 고객이 필요로 하는 콘텐츠를 집중적으로 소비할 수 있는 환경을 제공하는 데에 중점을 뒀습니다.
  • One Page 고객이 주로 찾는 핵심적인 서비스를 한눈에 쉽고 빠르게 훑고 내려갈 수 있도록 그룹핑하고 One Page로 구성함으로써 사용자 편의성과 접근성을 높였습니다.
    fit 일관성 있게 설계된 디자인 시스템을 바탕으로 각 패밀리 사이트를 브랜드별로 특화된 비주얼 커뮤니케이션과 핵심 콘텐츠에 대한 접근성에 최적화될 수 있도록 고도화했습니다.
    UMS UMS 통합 메시지는 Email, Fax, DM, Push 등 대고객 커뮤니케이션 채널로서 중요한 역할을 합니다. 중복 템플릿의 무분별한 생성 및 사용으로 유지 보수가 까다롭고, 고객의 정보에 대한 신뢰도와 KDB산업은행의 브랜드 이미지를 유지하는 것이 어려웠던 기존의 UMS에 일관된 디자인 콘셉트를 적용하고 웹사이트의 UI 요소를 문서 형식으로 사용해 제공하는 정보의 일관성과 신뢰도를 높이는 데 중점을 뒀습니다.
    ATM 은행에서 제공하는 ATM 기기는 버전에 따라서 버튼, 터치스크린과 같은 물리적 차이에 의한 환경적인 요인 때문에 GUI의 변화가 더딘 편입니다. KDB산업은행은 이번 차세대 채널 개편 프로젝트를 통해 오프라인 비대면 서비스인 ATM 자동화 기기의 GUI 디자인에서도 온라인 서비스와 동일하게 사용자 중심의 향상된 브랜드 경험을 제공하고자 했습니다. 또한 메뉴의 위치를 좌우에서 중앙으로 재배치하고 메뉴의 크기를 조정해 시인성을 높였으며, 폰트 크기와 자간 조정을 통해 저시력자와 노령의 고객도 정보에 쉽게 집중할 수 있도록 했습니다.
    Blend It
    © PULIP COMMUNICATIONS Co., Ltd