TOBESOFT BUX CONSULTING The Best UI·UX Consulting for Business User eXperience

1. 개요

2. UX 방법론

3. 기대효과

Agenda

1) UX의 이해

2) BUX 컨설팅

1. 개요

4

1. 개요

기능 중심의 프로젝트 전개에서 사용자 중심으로의 전환 필요

1. UX의 이해 (1/2)

5

1. 개요

사용자는 빠르고 쉽게 필요한 정보를 얻고 싶어한다

‘사용자들이 보고 싶어 하는 것은 정보의 내용이지 멋 부린 디자인이 아니다.’

1. UX의 이해 (2/2)

6

1. 개요

기업의 생산성 증대와 사용자 편의를 위한 UX의 전략적 가치 증가

‘사용자들은 보다 빨리 작업할 수 있게 하거나, 실수를 덜 하기를 원함’

2. BUX 컨설팅 (1/4)

7

1. 개요

AS-IS 분석 및 UX/UI Concept 에서 제시된 방향성에 대하여 TO BE Modeling 을 통한 기본 원칙 수립

[UX 컨셉을 위한 Affinity modeling ]

[ XPLATFORM Template ]

[ Design Style guide ]

[ UX/UI 표준정의 ]

‘사용자 경험/패턴/유형 등을 반영하여 화면의 정의 및 가이드를 수립’

<리서치 결과 분석>

<사용자 리서치>

2. BUX 컨설팅 (2/4)

8

1. 개요

시스템 사용패턴에 최적화된 UX/UI 제공을 위한 협업체계

UX/UI Project UI

공통

UX/UI 기획

UCI 디자인

퍼블리싱

• UX Consulting

• Analysis / Modeling

• Research

• UX/UI Planning / UI 표준

• UX Concept

• UCI Graphic Design

• Design Style Guide

• UX Studio Template

• Publishing 작업

• Preparation

• UI 공통 Consulting

• UI 공통 Guide

* UCI : User-Centered Interface

2. BUX 컨설팅 (3/4)

9

1. 개요

마케팅팀

IT 운영팀 기획팀

영업팀

고객센타 업무 시스템

사용자

표본

프로젝트 이해관계자들의 적극적인 협조와 사용자들의 참여

‘업무 담당자의 경험이 기업의 혁신을 이끌어낼 에너지다’

2. BUX 컨설팅 (4/4)

1) TOBESOFT UX 방법론

2) 수행 프로세스

2. UX 방법론

11

2. UX 방법론

‘UX 컨설팅 방법론 (TOBESOFT UX Method) 개발’

2007년 투비소프트 UX 방법론(가칭) 개발

• 삼성네트웍스

• 삼성전자 QINGS, 동원 F&B

• 삼성전자 QINGS, 한국연구재단, 건강보험심사평가원

• 현대그린푸드, 크린토피아, 두산 건설 / 두산 리조트

2012.5월 ‘서울대학교 UX랩’과 TUM (TOBESOFT UX METHOD) 개발

• 삼성중공업, 우리은행, 기업은행, 성모병원

2013.1월 TUM (TOBESOFT UX METHOD) 1.0 제작 완료

• 삼성카드

2013.8월 TUM (TOBESOFT UX METHOD) 2.0 개정

• 여천 NCC (SAP), 국민 연금

• 한화호텔앤리조트, 두산건설/두산리조트, 웅진 MRO

UX UX UX

UI UI UI

UX/UI 전문업체로써의 많은 경험과 노하우로 자체 UX 방법론 개발

1. TOBESOFT UX 방법론 (1/3)

12

2. UX 방법론

체계적인 방법론으로 안정된 품질의 업무시스템 UX/UI 컨설팅

‘추상적인 명제들에서 혁신을 유도하는 방법론’

1. TOBESOFT UX 방법론 (2/3)

13

2. UX 방법론

차별화된 Prototype으로 검증된 품질의 업무시스템 UX/UI 컨설팅

‘TUM의 특징 : Agile 기법을 통한 XP Prototype’

XPLATFORM Prototype

Requirement Definition Design Development

Use PowerPoint or Mock-Up Tools

Lo-fi Prototype

Mid-fi Prototype

Working Prototype

[ AS-IS ] [ TO-BE Prototype ]

Development

1. TOBESOFT UX 방법론 (3/3)

14

2. UX 방법론

AS-IS 분석을 통해 현행시스템의 업무에 대한 이해 및 문제점 을 분석합니다.

Understanding

사용자의 요구사항을 수집하고, 어떤 식으로 시스템을 이용하며 업무 협업을 이루고 있는지 분석합니다.

Research

사용자 요구사항을 바탕으로 UX/UI전략 수립 후 방향성을 도출합니다.

Idea

공통프레임 부분과 이에 따른 나머지 단위업무 화면들을 유형별로 분류하여 공통화 시키게 됩니다.

View & IA

시스템에 일관된 UX/UI Identity를 반영한 UCI 디자인을 제작하여 향 후 개발 시 일관되며 명확환 가이드를 제시할 수 있습니다.

UCI Design

UX 과제 도출 UX/UI 방향성 정의 UX/UI 구조화 UCI 디자인 제작

- 시스템 교육 - 프로젝트 관련자료 제공

- 대표화면 선정 - 표준 해상도 선정

- 대면인터뷰 참여 - 사용자 요구사항 검토

- Idea 공유 - 메인화면 프로토타입 피드백

- 화면 유형별 패턴 검토

- UCI 디자인 검토

고객 지원

UX/UI

컨설팅

UX/UI 컨설팅을 위한 TUM (TOBESOFT UX Method) 적용

UX 과제 도출 Understanding, Research를 통한 현 시스템 파악 및 요구사항을 통해 주요 개선사항 정리

UX/UI 방향성 정의 주요개선사항을 토대로 Ideation을 거쳐 UX/UI 방향성 및 컨셉 정의

UX/UI 구조화 Ideation을 통한 방향성과 컨셉을 반영하여 View & IA

UCI 디자인 제작 View & IA 이후 시스템에 일관된 Identity를 반영한 디자인 제작

2. 수행 프로세스 (1/7)

15

2. UX 방법론

업무진행방향

• Understanding 시스템 교육을 통해 업무에 대한 이해를 높이고 화면에 대한 사용성을 분석

[ AS-IS 화면분석 및 eye tracking ]

시스템 화면 분석을 통해 AS-IS 시스템의 전반적인 흐름, interaction의 이해와 업무 파악

[ TO-BE 사용성 적용 및 개선점 도출 ]

AS-IS 시스템을 이해하고 사용성 원칙을 준수하며 UX/UI 개선사항을 적용한 화면 설계안

‘화면분석 및 eye tracking’

2

1

5 6

7 4

3

9

10

11 12 13

8

14

2. 수행 프로세스 (2/7)

16

2. UX 방법론

• Research 프로젝트의 방향성, 사용자 Needs를 공유 및 개선방안 도출로 활용

‘요구사항 수집 및 사용패턴 파악’

구분 요구사항수집

대상 • 프로젝트 관련자 (업무, IT 등)

방법 • 프로젝트 TF팀과 협의 후 결정

프로젝트 TF팀 지원 • 인터뷰방법 및 일정 협의 • 인터뷰대상 선정 기준 및 인원 협의

• 요구사항조사대상 섭외 • 대상팀원 배정

2. 수행 프로세스 (3/7)

17

2. UX 방법론

• Idea UX/UI 전략 수립 및 Brainstorming을 진행, 방향성과 컨셉 정의

‘UX/UI 방향성 및 컨셉정의’

[ Ideation 을 통한 방향성 설정 ]

지속적인 Brainstorming 을 진행하여 핵심키워드 도출과 UX/UI 전략수립

[ UX 컨셉정의 ]

도출된 방향성과 핵심키워드, UX/UI 전략을 수립 후 UX/UI 컨셉정의

2. 수행 프로세스 (4/7)

18

2. UX 방법론

• View & IA Ideation에서 수립된 UX/UI 방향성 및 컨셉을 반영한 TO-BE Modeling 작업

‘메인화면 설계 및 유형분류와 패턴 설계’

Drawing & Sketch

유형분류

[ Sketch & Prototyping ]

스케치 작업 후 UX방향성과 컨셉을 적용한 MAIN Prototyping 작업

[ 유형분류 및 대표화면 패턴설계 ]

대표화면에 대한 유형분류 작업과 선정된 대표화면에 대한 Modeling 작업

MAIN Prototype (PPT)

패턴설계

2. 수행 프로세스 (5/7)

19

2. UX 방법론

• UCI Design concept UX/UI 방향성과 컨셉을 적용, 최신 UX/UI Trend의 UCI Design conceptualizing

‘Design conceptualizing & Color guide’

[ Design concept ]

Idea 단계에서 정립한 컨셉을 바탕으로 최신 UX/UI Trend를 반영하여 Design simulation 작업 진행

[ Color guide ]

업무 사용자의 업무 피로도와 업무 동선을 고려한 컬러 컨셉 정의

2. 수행 프로세스 (6/7)

20

2. UX 방법론

• UCI Graphic Design Design concept 을 적용한 UCI Graphic Design 작업

‘MAIN Design, Template, Design style guide’

[ MAIN Design ] [ XPLATFORM Template ] [ Design style guide ]

2. 수행 프로세스 (7/7)

1) 기대효과

2) UX 컨설팅 수행사례

3) 보도자료

3. 기대효과

22

3. 기대효과

사용자의 업무생산성 향상 & 효율적인 개발 및 품질 확보

사용자 입장에서의 기대효과

업무 수행 시간 단축

• 사용자의 환경, 사용 패턴, 편리성이 고려된 최적의

시스템으로 업무 수행

• 조작 편의성 및 업무처리 정확도 향상으로 업무 수행

시간을 단축

학습시간 단축 및 교육비용 절감

• UI 에 대한 사용자 예측으로 교육시간 단축

사용자의 신뢰감 형성

• 일정한 품질 수준이 확보된 UI, 일관된 사용자 경험을

제공하여 시스템에 대한 사용자의 신뢰감 형성

설계/개발자 입장에서의 기대효과

일관된 UI 제공으로 품질 수준 확보

• 설계/개발자들간에 발생할 수 있는 UI구성 격차를

최소화 하여 일관된 UI(사용자환경)를 제공

• 개발 시 필수적으로 지켜야 하는 최소한의 가이드를

준수하여 통합적인 품질을 일정 수준 이상으로 유지

효율적인 개발 지원

• 화면 설계 기준 안 및 템플릿을 제시하여, 제작의

편리성을 도모하고 효율적인 개발 지원

• 개발 및 유지보수 시간을 절약할 수 있어 비용 절감

효과 기대

1. 기대효과

23

3. 기대효과

‘직책(본부장/팀장/파트장) 및 부서에 따라 차별화된 기능의 메인 화면을 제공하고, 시각화된 현황 구성으로 메인 화면에서 쉽게 조직 내 현황 파악’

사용자 유형에 따라 특화된 최적의 사용환경 제공

2. UX 컨설팅 수행사례 (1/4)

24

3. 기대효과

‘TASK 중심의 메뉴와 유관 메뉴, 초보자를 위한 가이드 메뉴 및 Workflow를 제공하여 학습시간 및 교육비용 절감’

즉각적이고 신속한 정보 접근 지원으로 학습시간 절감

2. UX 컨설팅 수행사례 (2/4)

25

3. 기대효과

‘사용자 업무 경험 패턴에 의거한 일관된 업무 기능 및 부가적인 UI 기능을 제공하여 사용자 만족도 향상’

직관적인 업무 부가기능으로 사용자 만족도 향상

2. UX 컨설팅 수행사례 (3/4)

26

3. 기대효과

‘복잡한 업무 프로세스의 최소화 및 Pie-chart 를 활용한 데이터 시각화’

업무화면에 대한 접근성 강화 및 데이터 시각화

2. UX 컨설팅 수행사례 (4/4)

27

3. 기대효과

상담시간 19.7초 -> 12.4초 단축, 연간 6억원 비용 절감

‘상담시간 단축 및 사용자 편의성 향상과 함께 개발 생산성 대폭 늘림’

[2009년 11월 22일 전자신문 – 비씨카드 ‘ 사용자 화면 통합 시스템 ]

3. 보도자료 (1/2)

28

3. 기대효과

‘UX컨설팅 및 구현 플랫폼을 통해 개발 생산성 및 기회 비용 절감 보장’

[투비통 2013년 12월 – 현대그린푸드 통합정보시스템 ]

사용자 만족도 이전 시스템 사용 대비 보통 이상 78.9% 화면구성 사용자 만족도 보통 이상 83.1%

3. 보도자료 (2/2)

TOBESOFT Interactive Co., Ltd. 3~5F INTOPS Bd., 108-7 SAMSUNG-DONG, GANGNAM, SEOUL, KOREA T. + 82 2 2140 7700

Thank you