서동민 portfolio ver1
DESCRIPTION
(서동민)Daniel Seo's UX PortfolioTRANSCRIPT
Hexagon Bridge
S E OD O N GM I N
Portfolio
무모한 리얼리스트
Hexagon Bridge
● 플리마켓 활성화를 위한 디자인 제안 : 개인 프로젝트
● 입체적인 음악듣기 MUSIC BEAN : 개인 프로젝트
● 신개념 미디어 向 제품 컨섭 UX 시나리오 개발 : 삼성전자 산학협동연구
● 더존 그룹웨어 NEO BIZBOX 사용성 테스트 : UX1 컨설팅
CONTENTS
서초구
SEO DONG MIN
도심의 문화 놀이터
FLEAMARKET 활성화를 위한 디자인 제안
SEOULFLEA MARKET
INTRO MARKET MAP COMMUNITY MY FLEAMARKET
Bling PlatoonNight
&Bling PlatoonNight
TheHarvest
마르쉐
홍대프리마켓
Hexagon Bridge
커뮤니케이션의
어려움정보 접근의 어려움
이용자 마다 플리마켓에
대한 이미지가 상이함
플리마켓 방문이
최초 목적이 아님
판매자 간의/
판매자 구매자 간의
소통 창구의 부재
판매자의 특성으로
정보가 적고
분산되어 있음
플리마켓에 대한 느낌이
전통의, 만물상, 독특한,
아트적인, 신선한 등
대립되는 이미지로 나타남
이용자는 다양한
목적으로 지역을 방문
했다가 플리마켓을
거치는 행태를 보임
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Project Goal
Situation
Key problem Fleamarket의 특징
서울 플리마켓은 MAP DESIGN을 목표로 시작되었습니다. 주제를 선정하는 가운데 플리마켓의 성장 가능성을 발견하였고, 활성화를 돕는 디자인을 목적으로 정했습니다.
플리마켓은 자유로운 전통의 시장의 특성을 그대로 간직하고 있습니다. 하지만 모임의 연령층에 따라 그 성격이나 이미지가 상이하고, 판매자는 고정된 장소에서 지속해서 판매하지 않으며, 판매자 중에는 돈을 번다는 목적보다 취미로 활동하기도 하였습니다. 이러한 특성으로 홍보는 포기 상태이며, 구매자는 정보 접근의 어려움으로 불편함을느끼고 있습니다.
프로젝트 요구사항
서비스 디자인으로 접근한 MAP
Design
프로젝트 주제
플리마켓(벼룩시장)의 활성화를 위한
디자인 제안
인터넷의 활성화로 판매자와 구매자의 경계가 무너짐
3D 프린터기의 등장으로 개별 상거래 증가할 것으로 기대됨
포스트디지털세대 등장(아날로그 감성 회귀)
놀이 부족/ 재능을 살릴 수 있는 기회가 적음
디지털 시대에서 아날로그를 찾다
UsereXperienceDesign Process
아날로그 감성의 개별 상거래' 플리마켓'
주제선정
개인화 된 상품으로 개별 상거래가 증가할 것이라고 기대 됨
-포스트디지털세대 등장-판매자와 구매자의 경계 모호,-3D 프린터기의 등장
환경분석
1. 국내 플리마켓의 수/유형/장소/ 특징 파악
2. 플리마켓의 이용자의 유형 파악 을 통해 예상되는 문제점 파악
플리마켓과이용자 컨텍스트 파악
1.플리마켓을 찾는 동기2.플리마켓 이용 상황3.플리마켓 정보 접근방법
리서치 목표 수립
1.설문조사 (11문항으로 구성)2.인터뷰3.관찰노트 town watching safari shadowing
리서치 방법 수립
선행된 설문을 바탕으로 인터뷰 질의를 설계하였기 때문에 두 방법의 접점을 찾아 정리관찰노트는 상이한 플리마켓의 유형과특색을 찾아 정리
핵심 이슈나 독특한 행태를압박하는 Factor 같이 정리
각 리서치 별 내용정리
Key Finding
사용자 유형별 4명 인터뷰 총 5곳의 플리마켓 방문
리서치 수행
행위 목적을 기준으로 그룹핑상위 레벨을 세부적으로 쪼개어 가며 논리적인 흐름에 맞춰 kj-map을 구성
유저 태스크 분석Affinity diagram
1.판매경험이 있는 이용자2.다양한 플리마켓을 이용하는 이용자3.특정 플리마켓 애용자4.디자인 소품 애용자
플리마켓 이용자 행태 분류
#1 홍대 플리마켓 #2 혜화 마르쉐
#1 동묘앞 #2 삼청동 아트마켓 #3 FASHION X ART FLEA MARKET
Key word
Legend
Task
Idea
UserOpinion
Issue
# Affinity Diagram
플리마켓의 활성 정도는 여러 유흥 문화가 있는 번화가와 관계가 짙음
플리마켓의 가치는 볼 거리, 제품의 특별함(희소적 가치, 아트), 질 대비 가격
구매자의 만족도는 플리마켓의 특성과 판매자(작가)에게 영향을 많이 받음
판매자의 특성으로 홍보가 미흡. 때문에 정보의 접근성이 낮음
인터뷰어 마다 플리마켓에 갖는 이미지가 상이함
인터뷰 Key Findings
기타 5%
다양한 콘텐츠를 접할 수 있어서 9%
저렴하게 물건을 살 수 있어서
30%
기분전환 삼아 가볍게 구경하기 좋아서
33%
독특한 물건을 찾을 수 있어서
23%
1. 플리마켓을 이용하는 이유 4. 벼룩시장의 정보를 쉽게 알 수 있었던 / 없었던 이유는 ?
기타 8%
정보가 잘 정리 되어 있다 8%
정보가 많다 12%
정보가 분산 되어 있다 36%
정보가 많지 않다 36%
0 5 10 15 20 25 30
설문조사 대상 및 기간59명 응답 / 2013.11.01 - 2013.11.07
Discover Understand Define
인터뷰어들의 특징과 니즈, 페인포인트를 추출하여 퍼소나를 제작
퍼소나 모델링핵심적인 페인포인트와 이용자 행태를 선정하여, 세 가지 전략을 도출
전략1 인식각인. 조직화 되어 구분되는 플리마켓
전략2 행동유도. 콘텐츠 사이의 플리마켓 (연결-맵/ 웹)
전략3 채널구축. 정보의 교차로 플리마켓(Hub Site)
전략 도출
디자인 제안
추출한 컨텍스트와 인사이트를 조합하여 6가지 유저 시나리오 소스를 도출
1. 지역 콘텐츠 매체와 파트너십을통한 홍보2. 코스와 플리마켓3. 플리마켓 정보 제공4. 매니아 형성...
시나리오 설계
각 인사이트를 표현할 수 있는 그래픽 표현 및 구성을 여러타입으로 진행
전략의 맞추어 브랜딩 싸이트페이퍼 타입의 패키치를디자인하여 제안
그래픽 디자인
인사이트의 1레벨을 ‘Visual’ 과‘System’으로 구분하고, 그 하위레벨을Paper 과 Web 으로 나누어 세분화
Level 1 InsightSystem1. 플리마켓 웹 사이트들을 모아 놓은 허브 (+게이트 역할) 사이트 구축2. 사용자 접근성을 높이도록 페이스북과 연동3. 판매자와 연결할 수 있는 수단을 만들어 팬 등록, AS등 구매 이후의 과정 설계...
Level 2 InsightWeb1. 관련 정보 사이트와 연계하여 홍보 (인디밴드 사이트의 배너 홍보)2. 커뮤니티를 제공하여 A/S나 작가 - 소비자 간의 소통이 가능하도록 +판매자 - 판매자 / 노하우 공유 및 정보 공유 +판매자 - 구매자 / A/S, 팬 시스템
3. 작가의 경력/포트폴리오 등을 표시 할 수 있는 사인 시스템...
인사이트 도출
Favorite &Hobbies
집안 꾸미기 / 쇼핑 / 맛집 찾아 다니기 / 공연 보기 / 걷기
Needs
시간을 알차게 보내고 싶다 / 데이트를 할 때 신선한 경험을 하고 싶다 /남들과 다른 특별한 잇 아이템을 가지고 싶다 / 좋은 물건을 싸게 사고 싶다 /적은 비용으로 한번에, 다양하게 즐기고 싶다 / 희소가치가 있는 악세서리를 가지고 싶다
Problems
한 가지 물건을 구매하기 위해 방문하기는 꺼려진다 / 언제 어디서 열리는지 알기 힘들다 /동일한 판매자를 만나기 힘들다 / A/S가 어렵다 / 날씨가 좋지 않을 때 가기가 망설여 진다 /시간이 한정적이다 / 어디로 가야 하는지 모르겠다
Expectations
서울의 플리마켓 현황을 한눈에 알 수 있다 / 주변 컨텐츠를 함께 소개 받아, 알차게 계획을 세울 수 있다 /데이트 코스(대표적)를 짜는 시간을 줄일 수 있다 / 판매자와 원활한 소통이 온라인에서 이루어 질 수 있다 /언제 어디서 열리는지 알기 쉬워 졌다 / 플리마켓의 판매 품목을 한눈에 알 수 있다 /플리마켓의 규모를 미리 확인 하고, 머무르는 시간을 예상할 수 있다
대학생용돈 30만원
연애중외향적
여가인 / 여 / 23
Context
Legend
Paper
Web
구매자
판매자
1 2 3 4 5 6
# Affinity Diagram
SEOULFLEA MARKET
언플러그드 플리마켓
홍대 free market
보따리스 플리마켓 페스티벌
마켓 밤삼킨별
늘장홍대 플리마켓
종로구선택 위치마켓 위치
INTRO MARKET MAP COMMUNITY
서초구 강남구 마포구 광진구 중구 용산구 성북구
용산구
종로구 성북구
중구
동대문구
광진구
강남구
마포구
서초구
서초
SEOULFLEA MARKET
INTRO MARKET MAP COMMUNITY
ⓒ Rights is reserved by SFM
서울 플리마켓은 시민의 문화 놀이터를 4가지 목적으로 지원합니다.
1. 도심의 건전한 놀이 문화를 형성합니다.
시민이 더 많은 취미 활동을 할 수 있도록 활력을 주고, 독특한 개성과
문화를 존중하는 태도를 확립하는 것입니다.
2. 놀이 문화를 통해 감춰진 재능을 표현하는 기회를 더 많이 부여합니다.
수공예품, 공연, 전시, 먹거리 등의 성격을 가진 장터를 지원함으로써
재능을 가진 많은 시민들이 자신의 능력을 표현할 수 있는 기회가 많아
지기를 기대합니다.
3. 2차 3차적으로 새로운 시장이 파생할 수 있도록 지원합니다.
기존 공산품과 다른 특징 있는 수공예품이 활기를 얻어 재능 있는 시민,
소상인이 개인의 사업영역으로 확장할 수 있도록 지원합니다.
4. 세대간의 문화를 공유합니다.
여러 세대가 어울릴 수 있는 놀이 문화의 장이 되기를 기대합니다.
HUB게이트 + 콘텐츠
Link site지역관련 콘텐츠
SNSContents플리마켓 콘탠츠 관리
SNSFanpage작가 팬페이지
Design
추상화
구체화
Develop Deliever
인디밴드/공연
맛집/ 명소
Hexagon Bridge
이용자 마다 플리마켓에
대한 이미지가 상이함
플리마켓 방문이
최초 목적이 아님
플리마켓에 대한 느낌이
전통의, 만물상, 독특한,
아트적인, 신선한 등
대립되는 이미지로 나타남
이용자는 다양한
목적으로 지역을 방문
했다가 플리마켓을
거치는 행태를 보임
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Stratege
Fleamarket의 특징
Fleamarket의 특징
플리마켓이란 용어의 뜻을 명확히 알지 못하며, 기존 플리마켓과(전통 벼룩시장)과 현재 새롭게 나타나고 있는 유형이 정리되지 않아 리서치의 응한 이용자들 또한 가벼운 혼란을 일으켰습니다.
이용자의 플리마켓 방문 동기는 다양한 목적으로 지역을 방문했다가 플리마켓을 들려 즐기는 행태를 보였습니다.또한 플리마켓 아이템에 대한 정보를 인디밴드 홈페이지나 지역관련 정보에서 얻기도 하였습니다.
조직화 되어
구분되는 플리마켓
1.인식각인.
기존 유형의 플리마켓
(전통 벼룩시장)
= 중고품 및 만물상
= 나이든 = 젊은
= 예술 + 독특한 먹거리
새롭게 나타난 유형의
플리마켓
(구/신 유형 구분)
지역의
유명 콘텐츠와
콘텐츠 사이의
플리마켓
2.행동유도
(권유/ 홍보)
플리마켓
정보의
교차로 플리마켓
3.채널구축
(온라인 채널)
커뮤니케이션의
어려움
정보 접근의 어려움
Key problem
SEOULFLEA MARKET
INTRO MARKET MAP COMMUNITY
ⓒ Rights is reserved by SFM
서울 플리마켓은 시민의 문화 놀이터를 4가지 목적으로 지원합니다.
1. 도심의 건전한 놀이 문화를 형성합니다.
시민이 더 많은 취미 활동을 할 수 있도록 활력을 주고, 독특한 개성과
문화를 존중하는 태도를 확립하는 것입니다.
2. 놀이 문화를 통해 감춰진 재능을 표현하는 기회를 더 많이 부여합니다.
수공예품, 공연, 전시, 먹거리 등의 성격을 가진 장터를 지원함으로써
재능을 가진 많은 시민들이 자신의 능력을 표현할 수 있는 기회가 많아
지기를 기대합니다.
3. 2차 3차적으로 새로운 시장이 파생할 수 있도록 지원합니다.
기존 공산품과 다른 특징 있는 수공예품이 활기를 얻어 재능 있는 시민,
소상인이 개인의 사업영역으로 확장할 수 있도록 지원합니다.
4. 세대간의 문화를 공유합니다.
여러 세대가 어울릴 수 있는 놀이 문화의 장이 되기를 기대합니다.
HUB게이트 + 콘텐츠
Link site지역관련 콘텐츠
SNSContents플리마켓 콘탠츠 관리
SNSFanpage작가 팬페이지
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Stratege
Design: Branding
정보 접근이 쉽도록 플리마켓의 SNS나 홈페이지, 외부 사이트(지역관련 콘텐츠) 등을 엮고, 개별 구성원이 연결될 수
있도록 판매자 (작가) 개인 SNS나 홈페이지를 연결합니다. [허브형(게이트+ 콘텐츠) 사이트]
인식각인 단계. 새로운 플리마켓 유형을 담을 수 있는 그릇을 만들기 위해 두 가지 과정을 진행하였습니다.
1. 하위 브랜드 선정 및 특징 추출2. 비전 수립 및 상위 브랜드 구축
Process
01약 30개(서울) 중18개 후보 선정.
022차 분류. 특징이 뚜렷한 6개 선정
03최초 목적을 기준으로VISION 수립.
04하위 BRAND 특징 정리.상위 BRAND ROLE 수립.
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Design: Branding
브랜드 롤(BRAD ROLE)
생기가 있고, 모험적이며,현실보다는 이상을 쫓는 도전자
옛 것의 감성과 현대 감성을조화롭게 살리는 예술가
다른 이의 창의적인 감성을이해해 주는 자
(예술/ 건전한 놀이/ 참여/ 소통)
SEOULFLEA MARKET
MODERN VINTAGE = YOUNG + ART + UNIQUE 컨셉으로 디자인 하였습니다.
Bling PlatoonNight
&Bling PlatoonNight
TheHarvest 마르쉐
홍대프리마켓
블링 플래툰 나이트
“Club Night”
이태원 계단장
“The Stairs”
홍대 프리마켓
“Freely”
더 하베스트 “Tranditional Restaurant”
SAM 아트 마켓“Artists”
마르쉐@ 혜화“Organic”
BRAND LEADER SHIP BRAND PERSONALITY
BRAND ESSENCE
VISION
상위브랜드 하위브랜드
긍정적으로 사기를 북 돋워 주는지지자를 목표
1. 도심의 건전한 놀이문화 형성 Supportive leader ship YOUNG
ARTISTIC
UNIQUE도심의 문화 놀이터
2. 재능 표현 기회 부여
3. 새로운 시장 파생
4. 세대간의 문화 공유
에센스의 전개참여자: 서로의 개성을 존중하는 문화 형성, 판매자로서의 노하우 공유를 통한 발전. 조직: 최소의 조직으로 역할하며, 참가자의 성향에 따라 바뀔 수 있는 유기적인 자세 배양경쟁: 디자인의 도용을 방지하며 참가자들을 지킬 수 있는 울타리 구축
플리마켓과 콘텐츠 연결(앞 / 뒤 페이지) 플리마켓 소개(뒤 페이지)
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Design: Paper Map
행동유도 단계. 지역의 유명 콘텐츠와 연결하여 테마있는 여행 코스로 제안하고, 상세정보를 제공합니다. 앞쪽에는 켈린더를 넣어 플리마켓이 열리는 날을 알 수 있으며, 뒷쪽에는 서울에 있는 플리마켓을 소개합니다.
판매품목 표시
플리마켓 특징 설명
플리마켓 사진
마켓명 및 시작 년도
테마있는 코스 소개
플리마켓 범례
날짜 및 세부 장소
웹페이지 주소
달/ 요일
첫 째주
두 째주셋 째주
넷 째주
매주
상설
A2 size.
A2 size.
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Design: Paper CardFleamarket의 특징
선정된 6개의 플리마켓은 그 Identity가 잘 보이도록 카드형식으로 따로 디자인 하였습니다.각 플리마켓은 지하철을 기준으로 위치정보를 구성하였으며, 주로 판매되는 아이템을 Icon화하여 쉽게 파악할 수 있도록 디자인 하여습니다.
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Design: Web page
Flow chart
채널 구축 단계.
Main1Community
[1 depth]메인화면
[2 depth]메인화면
[2.5 depth]메인화면
[3 depth]메인화면
[3.5 depth]메인화면
Start Page
※메인으로 돌아가는 네비게이션이 항상 상단에 위치함
Depth Navigation
Main2Market Map
Main3My F.M
Intro
ContentF.M inforContent
Navi2
Navi3
ContentOverview
Detail
Link
Click on menu
Scroll
SNS FleaMarket
SNSSeller
Contenthistory
탐색과정에서 플리마켓에 대한 관심 촉진과 판매자와의 연결을 중점으로 플로우차트를 구성하였습니다.
1. 플리마켓의 지리적 정보와 열리는 날짜, 취급 물품을 쉽게 볼 수 있도록 구성2. 각각 플리마켓 홈페이지나 SNS/ 작가의 SNS나 온라인 샵으로 쉽게 이동할 수 있도록 구성 (아이템과 작가의 SNS를 직접적으로 연결하여, 꾸준히 관심을 갖을 수 있도록 함)
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Design: Web page
지리 요소를 통해서 플리마켓의 위치를 직관적으로 파악할 수 있도록 구성하였습니다.
이미지 탐색으로 플리마켓에대한 흥미를 촉진할 수 있도록 구성하였습니다.
Hexagon Bridge
UsereXperiencedesigner
SeoulFlea market
2013.11-12
Design: Web page
커뮤니티를 통해서
1.플리마켓에 대한 전반적인 뉴스 파악 2. 판매자간의 노하우를 공유 3. 작품/ 작가 소개를 통한 홍보를 할 수 있도록하였으며, 아이템과 작가를 연결하여 팬문화를 형성하도록 유도하였습니다.
이미지 탐색에서 흥미(몰입)를 지속할 수 있도록, 화면에서 최대한 벗어나지 않도록 디자인 하였습니다.
(디테일한 정보 창 POP-UP/ 숨김 기능)
TOP
12. 07 Saturday
INFO
입체적인 음악듣기 MUSIC BEAN
SEO DONG MIN
음악 SNS 어플리케이션 앱 개발 및 디자인
Hexagon Bridge
스마트기기의 이용이
단순 검색에서
상황해결로 목적이 바뀜
(관심기반 SNS 급성장)
현 음악 스트리밍
서비스는 사용자의
음악감성을 충족
시키지 못함
UsereXperiencedesigner
MusicBean
2013.03-06
Project Goal
Situation
뮤직빈은 두 가지 목적을 가집니다1. 기존 음악 어플리케이션보다 깊숙히 사용자와 대면하여 음악과 삶을 연결하는 서비스 개발이 목적입니다.2. 다중 감성에 대한 이해를 위한 실험적인 프로젝트 입니다.
멜론 프로젝트를 통해 음악 서비스에서 비즈니스의 딱딱한 느낌을 많이 받는 다는 것을 알 수 있었습니다.그 이유는 현 음악 스트리밍 서비스는 음악을 듣는 기능적 행위에만 집중을하여 음악 서비스가 주어야 하는감성적인 느낌을 전달하고 있지 못합니다. (Hierarchy of Needs의 즐거움/ 의미있는 레벨로 올라가지 못함)
User Research결과 및 Key findings(리서치 문서)
Persona &Scenario(시나리오 문서)
IA & UI 구성과InteractionPrototype
+
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
Service Concept
SNS
공유 및 관계망 구축 기능 ++SNS의 기능 중 음악에 관련된 페이지
만들기, 피드, 공유, 댓글, 추천 등의
기능을 사용 할 수 있는 탭 제공
음악플레이어의 기본 기능인 곡
재생 및 재생목록 설정 등의
인터페이스 제공
사용자가 음악과 어울리는 추천
할 만한 것에 대해 태그 가능함.
인물, 미디어, 검색 등의 서비스 제공
태그
사용자의 상태 태그 기능
음악플레이어
음악플레이어 기본적 기능
음악을 더 이상 귀로만 듣지 않는다
시의 한 구절을 음악과 함께 들으면,
음악에 감성과 기억이 입혀져 새로운(입체적인) 음악듣기가 시작됩니다.
Real voice
“ 그 음악을 들으면서 걷던 중에
예전에 같은 장소의 추억이 새록새록 떠오르면서
여행을 한 기분이 들어요"
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
Benefit
1) 음악에 대한
표현의 기회가
확대된다.
사용자 측면 음악을 들으며 떠올랐던 추억이나 가사에 공감하는 부분, 감성을 자극하는 음악 등음악에 대한 내 감정을 자유롭게 표현할 수 있는 새로운 공간이 제공됩니다.
2) 음악에 대한
지식/ 감정 공유
가 활성화 된다.
3) 기대하지 않았던
정보를 얻게 된다.
비즈니스 측면
1) 기존과 다른
의미있는
데이터베이스 축적
2) 문화 상품으로
새로운 사업기회
라이프 스타일을 담은 데이터를 축적함으로써 사용자들의 맥락 파악이 가능하게 됩니다. 축적된 데이터는 공연기획이나 앨범 등의 음악 문화에 사용될 수 있으며, 사용자가 음악 외적인 정보도 함께 공유하는 장으로 발전하여 다양한 사업의 기회로 연결될 수 있습니다.
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
Information Architecture
메뉴트리
MY PAGE FEED PLAY
프로필 프로필 사진
대표 음악
많이 듣는 음악
음악 히스토리
콘서트
소울메이트
정보
FEED
스탬프
설정
LIKE 음악재생
재생바
사진찍기
불러오기
담기
다운로드
동시청취
마이뮤직
공유
댓글
SNS 쉐어
공유
플레이리스트추가
알림
실시간태그
실시간음악
베스트태그
베스트음악
음악 & 태그
프로필
정보
FEED
정보
앨범
FEED스탬프
설 정 숨기기
차단
소울메이트 추천
소울메이트
소울메이트 추가
프로필 사진
대표 음악
많이 듣는 음악
음악 히스토리
콘서트
소울메이트
POST
태그입력
공유설정
친구태깅
포스팅
사진업로드
검 색
SOULMATE 소울메이트PAGE
음악 PAGE
앨범사진
앨범정보
청취자수
베스트태그
담기
태그피플
정보
앨범
컨텐츠 PAGE
베스트태그
태그피플
좋아요
익숙한 SNS의 정보구조를 차용하여 사용을 보다 용이하도록 구성하였으며, 음악 재생과 SNS의 조화를 가장 크게 고려하였습니다.
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
Information Architecture
플로우 차트 사용자들의 맥락이 담긴 FEED를 중심으로 음악의 정보, 음악과 궁합이 좋은 콘텐츠들(태그로 묶인)을 볼 수 있으며, 마음에 드는 음악을 발견한다면 바로 들을 수 있습니다.
MY PAGEFEED
FEED
음악 PAGE
검 색
재 생소울메이트 PAGE
컨텐츠 PAGE
②
⑥
⑤
④③
①
피드에서 음악을 바로 재생한다.피드에서 음악 상세페이지로 이동하여 음악정보를 살펴보고 음악을 재생한다.피드에서 소울메이트/컨텐츠 페이지로 이동한뒤 음악을 재생한다.피드에서 소울메이트/컨텐츠 페이지로 이동한뒤 음악 페이지를 거쳐 재생한다.검색에서 소울메이트/컨텐츠 페이지로 이동한뒤 음악을 재생한다.검색에서 소울메이트/컨텐츠 페이지로 이동한뒤 음악 페이지를 거쳐 재생한다.
②
⑥⑤④③
①
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
Wireframe
메인화면 & FEED
상단 바 자신의 현 위치를 알려줌
상단 메뉴 상단에 형성된 아이콘
우측 사이드 바 화면을 크게 이탈하지 않고 다양한 메뉴를 구성함
상단 탭 상단의 있는 탭
리스트 형식 메뉴를 가장 많이 볼 수 있는 구조
하단 탭 핵심적인 네비게이션
1
2
13
4
5
6
1
2
13
1
2
13
4
1
2
13
4
5
6
하단 탭 - Search
태그
실시간음악 실시간태그 베스트음악 베스트태그음악
검색바1
2
3
4
드롭메뉴 음악관련과 태그관련 검색결과를 고를 수 있다.
검색바 검색어를 쓸 수 있는 창
차트탭 음악이나 태그의 실시간 순위를 볼 수 있음
리스트형식 음악이나 태그의 사진과 목록을 볼 수 있다
포스트 - 태그 설정태그 검색 상단 메뉴 태그 검색을 완료하고 저장하거나
이전 메뉴로 돌아감
태그 검색 음악 태그, 친구 태그 등 원하는 태그를 검색할 수 있음
메인 화면 태그 검색 결과가 나타남
미스코리아 이효리
03:5600:00
하단 탭 - 재생플레이어 마이뮤직 개인 음악을 관리하는 페이지
플레이리스트 현재 재생 목록
플레이어 음악을 재생, 정지, 랜덤재생, 반복재생
콘텐츠메뉴 왼쪽부터 차례로 동시청취자, 음악정보 SNS공유, 담기, 다운로드, 볼륨조절
앨범자켓 재생되고 있는 곡이 수록된 앨범자켓 터치 시, 음악에 대한 feed 확인가능
가사보기 터치 시 가사를 볼 수 있는 아이콘
태그 검색바 검색바 검색바
# TAG # TAG
# TAG
# TAG
태그
# TAG
태그
1 2
3
4
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
GUI Design 메뉴트리 가장 깊은 Depth는 5 단계이며, 깊지 않고 넓은 정보구조를 가집니다.
로딩페이지
감성적이고 빈티지한 MINT
Main Sub B.G P
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
GUI Design
마이페이지
대표음악마이앨범
자기의 앨범 목록과 추천앨범, 피드앨범을 볼 수 있는 페이지
프로필의 대표음악 상세 정보와 공개앨범 목록을 볼 수 있는 페이지
스탬프
대표스탬프의 상세정보와 모은 스탬프를 볼 수 있는 페이지
재생
화면을 한번 터치 시,재생 음악에 대한 실시간 FEED 확인 가능
소울메이트 매칭
마이뮤직의 하위메뉴로타 사용자와의 취향 일치율을 알려주는 기능
소울메이트 태그
포스팅하면서 원하는 친구를 태그할 수 있다.
포스팅
검색
참여 인원 6명•팀장의 역할을 수행. 프로젝트의 방향성을 고민하고, 팀원들 특성 을 파악 및 고려하여 시간대비 효율을 높이는데 기여. 특히 리서치 파트에서 인터뷰 질의문 설계 및 사용자 동기, 태도 분석에 기여.
프로젝트 특징•타 프로젝트의 경험으로 어느정도의 가설을 가지고 시작하였기 때문에 IDEO의 더블 다이아몬드 방법론과 차이가 있음
프로젝트 한계•리서치 Define 기간이 짧아 핵심 이슈인’콘텐츠 연결’을 깊게 다루지 못함 때문에 IA구성에서 큰 특징을 부여하지 못함
리서치 목적
•사용자들이 음악 스트리밍 서비스에 가지는 가치를 확인
•사용자들이 음악에 갖는 동기와 태도 행동을 파악
리서치 대상•음악 스트리밍 사용자 중 여러 음악 서비스를 사용핚 사람과 단일 서비스를 사용하는 사람으로 구분하여 진행
•음악 코어 사용자 중 음악감상을 깊이 하는 사람과 가볍게 하는 사람으로 구분하여 진행
•온라인 서베이 시 10대, 20대, 30대 연령별 구분하여 진행
리서치 프로세스
01전반적인
컨텍스트 분석
02리서치 시나리오 설계
03리서치 진행
04리서치 결과 분석
사용자 리뷰 분석
트랜드 분석
리서치 이슈 도출
리서치 질의 작성
대상 선정
리서치 방법 선정
2013.4.9~4.19(10일간)
온라인설문 118명, 대면 30명
10대(2) 20 대(4) 30대(4)
관찰노트(타운워칭)
인뎁스 인터뷰
서베이
콘텐츠 수용 위주의 조사
Hexagon Bridge
UsereXperiencedesigner
MusicBean
2013.03-06
전체 프로세스부가정보
01DISCOVERY
02DEFINE
03DEVELOPE
04DELIVERY
과제 주제 선정 배경
유사앱 조사 결과
향후 우리 과제의 방향
Alliance
Benefit
APP 기획 목표
사용자 리서치 결과
페르소나 설정
사용자 시나리오
정보구조 설계
Wireframe 만들기
APP 브랜딩
GUI 디자인
종이 프로토타입 제작
사용성 평가 결과 분석
사용성 평가 Fish Diagram
UI, GUI 가이드라인
신개념 미디어向 제품 컨셉
UX 시나리오 개발(산학협동연구)
Acadumic adviserProf. Nam Choon ParkIndustrial design. Seoul Wonmen University
EducateeSeo Dong MinKim Seung KwonLee Hee Joong
Hexagon Bridge
UsereXperiencedesigner
SamsungElectronics
2012.03-06
Project Goal 삼성전자가 근 미래에 상용화할 Flexible display에 대한 UX컨셉 시나리오를 연구하는 프로젝트 입니다.‘플랙시블의 특성이 종이와 비슷하기 때문에 종이 시장을 대체할 수 있지 않을까?’하는 전제를 가지고 프로젝트를 진행였습니다.
User Research결과 및 Key findings(리서치 문서)
A5, A4 sizeNew UX ConceptScenario/Interaction Idea(시나리오 문서)
Big& Small sizeUX ConceptScenario/Interaction Idea
Overview 기존 타블릿PC 개념이 아닌 추후 생산/ 보급될 포스트 미디어를 대체할 수단으로써 Flexible display를 탑제한 신 개념 미디어를 종이/ 사용자/ 환경 관점에서 세로은 Feature를 제안하는 것이 과제의 핵심입니다.
Just like paper More than paper
Easier editing & writing종이에 글을 쓰는 것처럼,동일한 방식으로 펜을 이용하여 쉽게 글을 쓰고 지울 수 있는 것
Digital upload손으로 쓴 내용을 바로 디지털 포맷으로변환하여, 자신 또는 타인의 전자 기기로전송하는 것
Instant update컨텐츠 업데이트/수정이 발생할 경우,재인쇄가 아니라 실시간으로 컨텐츠를갱신해주는 것
Context-aware종이 사용 환경 또는 사용자를 인식하여그에 따른 컨텐츠를 제공하는 것
Flexible사용용도에 따라서 다양한 형태(접기,찢기 등)의 변형이 가능한 것
Slim & Lightweight가볍고 얇아서 휴대가 용이한 것
UsereXperiencedesigner
SamsungElectronics
2012.03-06
Hexagon Bridge
Key Insight
Insights Context factor
기존의 종이/ 미디어 사용자는 아주 다양한 기록/수납/가공 형태를 가지고 있었습니다. 프로젝트 중반부에 리서치 결과에서 나온 인사이트는 두가지 기준으로 선정되었습니다.
1. 프로젝트의 목표에 부합하는 결과2. 아이데이션 단계에서 영향을 줄만한 의미있는 결과
환경에 따라 종이 사용 집중도는 달라짐
종이/ 미디어를 사용할 때 사용자의집중도는 이하의 요소에 의해 달라진다
종이의 사이즈/ 사용자가 있는 공간/ 환경의 밝기
(대부분은 스마트폰으로 사진을 찍고 디지털로 변환 후 폐기)
기록을 타인에게 전달하고자 할 때/기록을 직접 상기하고자 할 때/
종이의 색상/ 사이즈/ 모니터/ 베젤/ 벽 재질
자료를 중복 발견할 때/ 자료 인지 범위 한도 초과 시보관 공간의 위치가 모호할 때/ 파티션에 제한받을 때
기록을 하기 전에는 통상 템플릿을 만들어 재사용/기록을 한 이후 가공은 만족감& 제안을 위함
붙이는 종이는 특정 요소(사이즈/ 생상 등)에따라 이용 방법이 달라진다
사용자가 종이/ 파일을 분류하는 데는일정한 기준점이 있다
기록 전/후에 사용자는 본 기록을가공하고 싶은 욕구가 있다
1회용으로 사용되는 종이는 사용자의특정 업무(전달/ 상기 등)와 그 중요도에 따라폐기 시점이 결정된다.
일회용 종이는 폐기시점 패턴이 존재
붙이는 종이는 중요도가 부여됨
분류/ 정리 동기를 유발하는 시점이 존재
기록을 재가공 하고 싶은 욕구 존재
UsereXperienceDesign Process
Discover Define
1. 전자종이의 가치를 파악하여 사용자에게 기대 이상의 편리함을 제공한다.
2. 단순한 전자종이를 넘어 사용자에게 소통 그 이상의 가치를 제공한다.
3. 새로운 미디어는 사용자의 컨텍스트에 맞춰진 개인화 도구로발전해야 한다.
프로젝트 배경 조사 및 UX challenge 설정
1.종이 시장을 거시적으로 파악
2.사람들이 현재 종이를 어떻게 사용하는가에 대한 유형을 개인 & 공공 & 사이즈별로 나눔
3.사용자 예상 행동을 모두 나열하고 유형별로 가상의 퍼소나를 만듬
종이 시장과 사용자 컨텍스트 파악
사용자 리서치의 목적을 수립하고 리서치에 사용할 기법을 설정함.사용한 기법은 다음과 같음
1.5 whys2.Cognitive maps3.Guided tour4.Personal Inventory5.Long range forecast
리서치 목적 설정과 진행 기법 준비
사용자 리서치 결과를 1차적으로 정리하기위하여 사용자의 동기/상황/특징/행동을 정리함
또한, 사용자 리서치의 Data Affinity를 아날로그/디지털/아날로그+디지털 행태로 나누어 정리, 해당 사용자가 어떤 미디어를 주로 사용하는지 시각적으로 파악함
EX.실제 종이 사용이 많은 사용자
유저 태스크 분석
사용자 리서치 데이터를 2차적으로 Cross-case 분석하고 인사이트를 도출하기 위해 1차적으로 정리한 데이터를 친화도별로 다시 정리함
Affinity diagram 진행
종이를 사용하는 사용자 유형을 다음과 같은 기준으로 축소
1.실용을 추구하는 사용자2.정리/ 보관에 철저한 사용자3.아날로그 보다 디지털 선호 사용자4.디지털 적극 활용자
종이 이용 행태별 사용자 분류
사용자를 유형별 8명을 대상으로 정성적 리서치를 진행
사용자 리서치 진행
Analog Digital A+D
1차, 2차로 정리한 리서치 데이터를 바탕으로 패턴과 흥미로운 영감을 주는데이터를 별도로 정리
Key findings 도출
Develop Deliever
시나리오를 구체화하고 최종 UX컨셉을 제안
최종 UX 컨셉 시나리오 제안
도출한 인사이트를 기준으로 새로운 유저 컨텍스트를 제안하기 위해 아이데이션을 진행. 총 100개 정도의 아이디어를 도출함
아이데이션(스케치) 진행
제작한 퍼소나를 바탕으로 아이데이션 결과를 그룹핑함
아이디어 그룹핑
각 인사이트 요소에 대응하는 Context Factor를 나열하고 제작하고자 하는 퍼소나의 성격을 정의 후 퍼소나 제작
퍼소나 모델링새로운 유저 컨텍스트를 제안하기 위해 컨셉 시나리오를 제작함
1.Attachable paper(붙여쓰는 미디어 페이퍼)2.Temporary-use paper(임시 사용 미디어 페이퍼)3.Modular paper(모듈형 미디어 페이퍼)
컨셉 도출
사용자의 종이 사용 컨텍스트는아래와 같은 요소로부터 변화한다는사실을 도출함
1.종이를 사용할 당시의 집중도는 사이즈/ 공간/ 밝기에 따라 달라진다
2.종이 사용의 중요도의 따라 폐기 시점이 결정됨
3.사용자가 종이를 사용/분류하는 데는 일정한 기준점이 있다(Ex. 중복/인지범위 초과)
4.기록을 별도로 가공하고자 하는 욕구가 있다5.사물 경계에 붙이는 종이는 특정 목적이 있다.
인사이트 도출
Concept
Hexagon Bridge
Scenario1.Attachable paper
Key user voice
Development
Insights붙이는 종이는 아래의 요소에 따라 사용 방법이 달라진다
“자주 잊어버린다거나 중요한 것들을 주로 모니터에 붙이고 있어요. 때로는 메시지를 전달할 때도 자주 쓰지요”
-신영욱(초등학교 교사)
“붙이는 종이는 색깔 별로 구분해서용도를 구분해야만 해요. 안 그러면 구분이 잘 안돼요.”
-박채림(대학생)
“지금 당장 중요하거나 잊어버리지 말아야 할 기록은 지갑에라도 붙여서 가지고 가요.”
-임종혁(연구원)
UsereXperiencedesigner
SamsungElectronics
2012.03-06
�C�o�n�t�e�x�t� �f�a�c�t�o�r� � 정보의� 중요도� � 종이의� 색깔�
� 용도에� 따른� 사이즈� 구분� � 베젤의� 형태�
�F�e�a�t�u�r�e� � 업무� 중요도�(상�/중�/하�)�
� 노랑�/파랑�/보라�/…�
� �7�6�X�7�6�m�m… � �
베젤의� 유�/무�,� 시각적요소 �
새로운 방식의 붙여쓰는
미디어 페이퍼
1. 모니터 베젤에 붙여 놓은 미디어 페이퍼가 시간이 지나면서 낡아지는 형태를 띄게되면서 정보의 유통기한을 파악할 수 있게 됩니다.
시간이 지나면서 색이 변함
2. 전화가 끝나고 스마트폰을 올려 놓으면 NFC를 통해 메시지 이미지 데이터가 전송되는 시나리오 입니다. 이미지 분석>문자변환>전송프로세스를 통해 메시지를 보냅니다.
3-1. 붙이는 페이퍼 미디어 위에 자신이 쓴 내용이 담긴 스마트폰을 올려높으면 프스트잇 페이퍼에 자신의 메모 데이터가 저장됩니다.
3-2. 포스트잇에 또 다른 미디어 페이퍼를 접촉시키면 자동으로 내용을 복사할 수 있으며, 따로 필기를 하거나 프린트를 할 필요가 없어집니다.
Concept
Hexagon Bridge
Scenario2.Temporary paper
Key user voice
Development
Insights종이/미디어를 사용할 때 사용자의 집중도는 이하의 요소에 의해 달라진다
“수업에는 이면지를 항상 활용해요.노트북을 가져가기가 버겁기 때문이죠.”
-신형섭(대학생)
“노트북은 집중하고 싶을 때 오히려 방해가 되요 클릭하고 싶은 정보가 너무 많아서요.”
-박채림(대학생)
“굳이 출력할 필요 없는 서류(i.e. 결제서류) 출력할 때가 있는데, 그럴 때마다 종이가 참 아깝다는 생각을 해요.”
-송대규(회사원)
공공장소에 임시로 사용하는 미디어 페이퍼
UsereXperiencedesigner
SamsungElectronics
2012.03-06
�C�o�n�t�e�x�t� �f�a�c�t�o�r� �F�e�a�t�u�r�e� �
�
� �
화면의� 사이즈
사용자가 � 있는� 공간�
환경의� 밝기�
기록� 행동의� 유무�
사용하는 � 미디어의 � 자율성�/
주변� 소음의� 정도�
�A�1�,�A�2�,�A�3�,�A�4…�
개인�/공공의� 공간�
밝은�/어두운� 조명�
쓰면서� 상기�/경청�
스마트폰 �/노트북�/수첩�
타이핑� 소리�/기타� 소음�
1. 강사가 스마트폰을 이용하여 유인물로 사용할 다량의 임시 미디어 페이퍼에 강의 데이터를 전송합니다. 이렇게 함으로써 일일히 유인물을 복사해야하는 번거로움을 줄여줍니다.
2. 강의실 입구에 배치된 임시 미디어 페이퍼를 학생들이 수업을 위해 받아갑니다.
3. 학생은 임시 미디어 페이퍼에 전용펜으로 필기를 함으로써 강의 내용에 관련된 메모를 할 수있고, 동시에 강의 관련 컨텐츠를 볼 수 있습니다.
4. 강의가 끝나면 메모한 내용을 스마트폰/ 클라우드에 저장함으로써 다음 수업 참여 시 지속적으로 데이터를 활용할 수 있습니다. 다쓴 임시 미디어 페이퍼는 회수합니다.
Concept
Hexagon Bridge
Scenario3.Modular paper
Key user voice
Development
Insights사용자가 종이/파일을 분류하는 데는 일정한 기준점이 있다
“책 정리를 할 때 책장에 카테고리를 한 칸 마다 달리 해놓아 차후 고르기편하게 만들었어요.”
-천민우(아트디렉터)
“E-book의 한 단면 형태보다는 책의 형태가 좀 더 책을 읽기 편하고 안정감을 느껴요.”
-이상봉(연구원)
“화장실에서 보는 책, 방에서 보는 책, 밖에서 보는 책이 전부 달라요.”
-신영욱(교사)
모듈 형식의페이퍼 미디어
+개인 페이퍼
미디어
UsereXperiencedesigner
SamsungElectronics
2012.03-06
�
�C�o�n�t�e�x�t� �f�a�c�t�o�r �F�e�a�t�u�r�e�
자료의� 중복� 발견� 시점
자료의� 인지� 범위� 한도�
보관� 공간의� 위치�
한� 경계의� 공간� 분류�
같은� 파일� 발견� 시�
�4�0�~�5�0개� 이상�
서랍�/책장�/주변� 공간…�
예�)� 파티션�
1. 벽면에 책장용 모듈 페이퍼를 설치합니다. 이 벽면용 미디어 페이퍼는 디스플레이/ 책 전송 등 제한된 인터랙션 용도로만 사용이 가능합니다.
2. 사용자는 책과 동일한 형태를 가진 미디어 페이퍼를 가지고 있습니다. 이것을 통해 책장용 미디어 페이퍼와 책 수납/ 다운로드 인터랙션을 수행합니다.
3. 개인용 E-Book 미디어 페이퍼는 사용자가 언제든지 들고 다녀 책처럼 읽고, 책갈피를 사용할 수 있으며, 전용 북스토에 플랫폼을 통해 책을 다운로드/ 저장 할 수 있습니다.
4. 다운로드 한 책/ 책갈피&밑중 정보를 저장한 정보를 책장용 모듈 페이퍼로 다시 전송하여 커스터마이징 된 나의 책이됩니다.
USABILITY TEST RPORT
Hexagon Bridge
UsereXperiencedesigner
Project Goal 소규모 기업에서 부터 대기업까지 사용 가능한 확장성 있는 그룹웨어를 목표로 더존 그룹웨어 비즈박스 S2를 개발하였고, UX/UI의 개선을 위한 검증이 필요하였습니다. UX1에서는 두 가지 방법으로 검증을 진행하였는데,저는 사용성 테스트를 진행하였습니다.
Overview ● 사용자 그룹에 따라 사용환경 및 학습성(Learnability) 확인을 위한 사전 인터뷰● 그룹웨어 내 기능별 task 수행을 통한 본격적인 사용성 테스트● 사용 후 발견 된 총체적인 니즈 확인을 위한 정리 인터뷰로 진행
DuzonGroupware
2012.09(10)
UT ReportHeuristicEvaluationReport
일반사용자
조직관리자
더존 그룹웨어 사용
타 그룹웨어 사용
그룹웨어 미사용
더존 그룹웨어 미사용
사용자 구분
2. 사용 익숙도 확인
3. 기존 니즈 확인
1. 그룹웨어 사용도 및 업무 연관성 확인
2. Task 단위별 수행 패턴 테스트
3. Task 성공 여부, 오류 발생 여부
및 빈도, 처리 시간 측정
1. 관리자/일반사용자로 사용자 그룹 구분에 따른 수행 범위 지정
1. 사용 소감을 통한 전반적인 니즈 확인
2. 난해한 Task 확인
사전 인터뷰
수행절차
사용성 테스트 정리 인터뷰
Hexagon Bridge
UsereXperiencedesigner
TaskAnalysis
Task 데이터 분석을 다음과 같은 순서로 분석하였습니다.
1. 소요시간차, 수행성공률, 에러율 전체 데이터를 비교하여 수행 성공률이 낮고 오류발생률이 높으며 수행 시간이 오래 걸리는 항목을 점검이 필요한 TASK로 선정
2. 선정된 Task를 기준으로 수행 성공률, 에러발생율 소요시간을 복합적으로 평가하여 개선 시급 우선순위를 선정
3. 오류 발생 빈도가 높아 선정된 Task를 UI / IA / 레이블링 / 인터렉션 총 4개 부문으로 구분하여 집중분석
DuzonGroupware
2012.09(10)
심각도가 높은 Task인터렉션
레이블링
IA
UI
0
2
4
6
8
10
12
14
결재올리기
근태관리
주간업무보고
부서일정
마이메뉴 만
들기
차량운행일지
증명서요청/출
력
회사비품
웹펙스보내기
큰테환황조회
휴가신청조회
공유일 생
성관리
주간업무환인
승인후확인
게시판
증명서관리
파일추가 및
삭제
SMS전
송관리
Hexagon Bridge
UsereXperiencedesigner
Summary 중복될 수 있는 정보구조 형태와 기대와 다른 작업절차가 가장 큰 문제점으로 나타났습니다. 버튼의 위치 등의 통일성이 부족하고 자주 사용하는 기능이 잘 보이지 않거나 인식하기 어려운 GUI를 가졌습니다. 그밖에 이해하기 쉬운 용어 선택 및 올바른 행동을 유도할 수 있는 가이드 제시 순으로 개선이 요구됩니다.
UT Rport 그룹웨어 특성상 복잡한 정보구조를 가지고 있으며, 회사마다 일하는 절차나 방식이 다르기 때문에 그 기준점을 잡기가 어려웠습니다. 그렇기 때문에 대기업과 중소기업의 일반적인 절차를 염두해 두고 진행하였습니다.
DuzonGroupware
2012.09(10)1. IA (정보 구조 설계)
문제 45%
2. UI (사용자 인터페이스) 문제 27%
3. 레이블링 및 인터렉션 문제 16%/12%
● 사용자가 적절하다고 생각하는 절차와 제공하는 작업절차가 달라 실수가 잦았다.
1. 시스템 정보구조와 사용자의 기대 사이에서 오는 문제
● 하나의 카테고리에서 작성이나 요청등 관련 Task를 진행하려 하기 때문에 찾지 못하였다.
● 카테고리가 모호하여 학습이 어려워졌다.
2. 사용자 기대보다 세분화, 중복 되어있는 정보구조
● 사용자가 생각했던 작업 수행 절차보다 많은 절차를 제공하기 때문에 혼란이 가중된다.
3. 복잡한 작업 수행 절차
IA(정보구조 설계)
IA 45%
UI 27%
INTERRACTION
12%LABELING
16%
66%시스템 정보구조와 사용자의 기대사이에서 오는 문제
6%
28%사용자 기대보다 세분화, 중복 되어있는 정보구조
복잡한 작업 수행 절차
Hexagon Bridge
UsereXperiencedesigner
UT Rport 예상되는 어려움은 두 가지 였습니다. 절차가 상당히 세분화 되어있기 때문에 UI의 통일성이 더욱 중요하였고, 시선을 정리하되 의미를 잘 구분해서 UI를 배치하는 것입니다. 예상대로 사용자들은 혼란 속에서 UT를 진행해습니다.
UT Rport 레이블링을 굳이 따로 분석한 이유는 IA에 포함시키기에는 많은 데이터가 나왔기 때문입니다.허나 독립 카테고리로 배치하기에는 그 크기가 작아 인터렉션과 같이 묶어 결과를 보고 하였습니다.
DuzonGroupware
2012.09(10)
25%
● IA가 크게 개인/팀으로 구분되어 내부에 비슷한 이름의 Task들이 즐비하여, 혼란을 가져온다.
● 사용자가 실수하지 않도록 절차에 대한 가이드가 충분치 않다
1. 유사한 이름
2. 다른 이름이지만 기능이 같은 버튼이 있다.
3. 작업 가이드 제시 부족
● 작업을 완료 했지만 피드백이 부족하여 인지하기 어렵다.
4. 피드백 부족
레이블링 및 인터렉션
30%
31%20%
20%
● 근래 서비스에서는 생략된 절차가 많아 실수가 잦다
1. 트랜드에 맞지 않은 올드패션
● 자주 사용하는 기능의 버튼이 작거나 icon이 의미를 명확히 전달하지 못한다
3. GUI의 의미전달 부족
● 작업마다 버튼의 위치가 달라 혼란스럽게 한다
● 상단에 단축메뉴가 나오는 곳과 나오지 않는 곳이 있어 혼란스럽게 한다
2. UI통일성 결여
● 전혀 다른 기능의 버튼이 모여있어 잘못된 행동을 계속 유도한다
4 버튼 배치의 부적절
UI (사용자 인터페이스)
30%
트랜드에 맞지 않은 올드패션
15%
30%UI통일성 결여
버튼 배치의 부적절
GUI의 의미전달 부족
다른 이름 같은 기능
작업 가이드 제시 부족
피드백 부족
유사한 이름