SlideShare una empresa de Scribd logo
1 de 42
Descargar para leer sin conexión
Rapid Prototyping빠른 프로토타이핑으로 소프트웨어 UX 개선하기
Fasoo ED Team
2013.04.11
오늘 할 이야기들
사용자 중심으로 제품을 개발해야 하는 이유?
사용자 중심 제품 개발에 가장 적합한 method인 UI Prototyping의
소개와 관련 이야기들
우리는 어떻게 소프트웨어를
만들어 왔을까요?
개발자 중심 예산/일정 중심
“세상의 중심은 개발자”
고객의 니즈와 관계없이
산으로 가는 개발 과정
고객이 설명한 것 PM이 이해한 것 기획자가 설계한 것 프로그래머가 코딩 한 것
비즈니스 컨설턴트가
상상하는 모습
문서화 된 산출물 현황 개발 진척 상황 고객이 지불한 비용 고객 지원 현황 사실 고객이 진짜 원하는 것
“예산과 일정이 세상의 기준”
고객이 알파 버전을 사용하게 될 날은 언제 올까요.
일정에 맞춰서 제품의 요구사항을 축소하거나
일부만 구현하거나... 혹은 퀄리티를 낮추거나..
예산에 맞춰서 요구사항을 미구현한 상태로 제
품 발표하거나… 혹은 퀄리티를 낮추거나..
슈퍼카굴러가는데 의의를 두는 차(?)
현실 이상
쇼핑 동선 설계와 제품 분류가 완벽하고 친절해서 제품 배달까지
해주는 대형 마트
물건도 적고 찾기도 힘들고 주인장은 마실 나간 동네 구멍가게
현실 이상
사용자 중심이어야 하는
이유는 너무 많습니다.
“우리가 쓰려고 만드는 것이 아니라 고객이 사용할 제품을 만드는 겁니다.”
“뻔한 얘기지만 고객은 개발자가 아니고 사용자입니다. 프로그래밍에 대한
지식도 없고 구매한 제품에서 목적에 부합하지 않는 미적 가치를 추구하지도
않으며 개발사의 비즈니스 모델에도 관심 없습니다.”
“고객은 기능보다 기능을 매개로 구현하는 „목적‟이나 „가치‟,‟경험‟ 에 관심
이 있습니다.”
“고객은 우리의 일정이나 일손 부족 같은 건 진짜 관심 없습니다.”
“기능이나 제품의 가격, 효용성, 필요한 시기에 시장에 출시되는 것 등등은
성공하는 제품의 중요한 요소이지만 결코 모든 것은 아닙니다.”
일반적인 사용자 중심
개발 프로세스
사용자 중심 제품 개발 과정의 태반이
사용자를 끊임없이 이해하는 과정의
반복이라는 것을 알 수 있습니다.
사용자 경험에
영향을 주는 것들
Product
Service
Provider
S/WH/W
User
Device Interface Service Contents
Environment (Context)
UX Design
Feel
Sense
Think
Act
Relate
감정을 통한 경험관계를 통한 경험
감각을 통한 경험
사고를 통한 경험
신체적 행위를
통한 경험
Space Time
Bernd Schmitt, “Strategic experience modules”.
Community
User Interface 요소를
사용자 경험 기준으로 보기
사용자 중심 개발을 위해서
는 인간을 이해하고 기계를
이해하고 컨텍스트를 이해하
고 관계를 이해하고 인문학
을 공부하고 공학을 공부하
고 미학을 공부하고 비즈니
스를 공부하고…
공부할 시간이 없으시다면
좋은 대안이 있습니다.
ED팀에서 배포한 UI 개발자 매뉴얼
1. Outline
2. Goal
3. Coverage
4. Product Value
5. User Value
6. Fasoo UI Develop Principle
7. Layout Guideline
- Main page layout
- Sub page layout
- Modal window layout
- Button set
8. UI Pattern Guideline
- Navigation UI pattern
- List UI pattern
- Form UI pattern
9. Publishing Guideline
- Layout palette
- Layout Structure
- Layout Sample
- UIO palette
- UIO Sample
- Common Rule
- Web accessibility / Web Standard
Appendix 1 . UI Develop Checklist
사실 사용자 중심
소프트웨어 개발이
싫은 사람은 없습니다.
몇 가지 문제만 없다면…
바쁜 일정 부족한 예산 더 부족한 인력
복잡한 의사소통 구조 그 와중에 무시되는 사용자 쌓여가는 요구사항
피할 수 없다면 적응합시다.
방법이 없는 건 아닙니다.
일정을 단축하고 예산을 절약하고 인력도 절약하고
손쉽게 의사소통하고 고객 니즈를 발 빠르게 수집하고 요구사항을 빠르게 처리
전통적인 „폭포수방식‟
„Prototyping‟에 대해서
사실 Prototyping은 굉장히
일상적인 방법론입니다.
건축 분야에서는 필수적인 절차
제품 디자인 분야에서도 일상적
자동차 클레이 목업도 대표적 프로토타이핑
소프트웨어 개발에서
Prototyping 을 사용하지
않을 이유가 없습니다.
물론 우리가 초 천재라서 프로젝트의 모든 리스크를 미리 예측하고
고객이 원하는 것을 점쟁이처럼 맞추고
애매한 요구사항만으로 최종 산출물의 그림을 척척 그려내서
코딩까지 할 수 있다면
굳이 할 필욘 없죠.
UI Prototyping 의 수많은
장점들
“시간, 노력, 비용을 절감할 수 있습니다.”
“아주 빠르게 실제 목표를 가시화 할 수 있습니다.”
“개발 목표의 애매모호함을 비약적으로 줄일 수 있습니다.”
“구현 가능성 (feasibility)를 매우 빨리 측정할 수 있습니다.”
“개발과 함께 사용성 테스트를 빠르게 진행하여 고객의 니즈를 빠르게 취합할
수 있습니다.”
“프로토타입을 매개로 내부의 다양한 아이디어를 빠르게 수집할 수 있습니다.”
“커뮤니케이션을 보다 클리어하고 명확하게 할 수 있습니다.”
UI Prototyping의 몇 가지
단점(?)들
“빠른 커뮤니케이션이 용이하다 보니 중간 산출물이나 문서 작성이 생략 되
어 장기적으로는 문제가 될 수도 있습니다.”
“프로토타이핑 범위를 정하는 것이 늘 쉽지 않습니다. 최종 산출물에 가까운
프로토타입을 만든다면 프로토타이핑의 강점을 살리기 쉽지 않고 반대로 너
무 러프 한 프로토타입을 만든다면 구현 목표 파악이나 테스트를 통한 정보
수집에 문제가 생길 수도 있습니다.”
다양한 UI Prototyping 방법
Paper Prototyping HTML Coding Adobe Application
(Photoshop, Fireworks, Dreamweaver, Muse)
MS Office
(Powerpoint, Visio, Excel)
UI Prototyping 전용 App. Apple OmniGraffle
전용 Prototyping tool
Pencil
Fluid UI Balsamiq Mockups
Mockflow
Paper Prototyping
Paper Prototyping 장단점
융통성이 있다.
제작 속도가 빠르다.
비용이 싸다.
쉽다.
빠르다.
협력작업이 용이하다.
하드웨어의 구애를 받지 않는다.
언제 어디서든 할 수 있다.
원격 작업에 부적합 하다.
소스 재활용이 불가능 하다.
상상력이 필요하다.
시각적 표현에 한계가 있다.
그냥 하면 됩니다.
그 외의 Prototyping Tool
장단점
HTML 코딩
(Flex, Silverlight..)
Adobe application
(Photoshop, Fireworks, Dreamweaver, M
use)
MS Office
(Powerpoint, Visio, Excel)
Prototyping 전용 툴
• 플랫폼 프리
• 무료
• 최종 산출물과 매우 유사한 프로
토타입 제작 가능
• 구현 가능성 추적 용이
• 협업의 용이성
• 소스 재활용성 높음
• 높은 인터랙션 구현
• 실제 UI에 가장 가까운 비주얼 연
출 가능 (가장 높은 완성도의 프로
토타입 제작 가능)
• 소스 재활용성 높음
• 배우기 쉽다
• 거의 가지고 있다.
• 복사해서 붙이기.
• 화면 순서 정렬 용이.
• 문서화 용이.
• 약간의 인터랙션 구현 가능.
• 배우기 쉽다.
• 다양한 템플릿을 제공
• 익숙해지면 높은 효율 제공
• 배우기 쉽지 않음
• 숙련되기 전까지는 비효율적
• 배우기 어렵다
• 비 숙련자에게는 적합하지 않음
• 하드웨어 사양
• 매우 비쌈
• 제한적인 그리기 도구
• 제한적인 인터랙션
• 재사용이 불가능한 소스코드
• 소스 재활용이 낮음
• 자유도가 떨어짐
• Hi-Fi 프로토타입 제작에 적합
하지 않음
어떤 방식을 사용할까요?
일단 Paper Prototyping은 기본 중의 기본입니다. 너무 쉬워 보여서 무시당
하는 경향이 강할 뿐입니다.
손에 익숙해서 빠르게 사용할 수 있는 방식이 가장 좋습니다. 종이에 스케치
하는 것 보다 직접 코딩 하는 게 더 빠르다면 코딩 하세요.
가급적 다양한 방식에 익숙해지는 것이 좋습니다. 프로토타입의 구현 목표
와 기대치가 프로젝트 유형과 프로젝트 단계 마다 제각각이기 때문에 한 가
지 방법으로는 모든 상황에 대처하기가 힘들 때가 있습니다.
명심해야 할 것
“대상 사용자와 제품의 기획의도를 이해하세요.”
아이디어를 모으고 테스트하기 위한 프로토타입인지 실제 구현될 예정인 제
품의 전모를 보여주기 위한 프로토타입인지 확인하세요.
“계획 세우다가 끝내지 말고 일단 프로토타이핑을 하세요.”
프로젝트는 늘 폭풍우처럼 변합니다. 모든 걸 미리 예측하고 진행할 순 없습
니다.
“기대 심리를 조성하세요.”
이 프로젝트가 진행되고 있고 가능성 있다는 믿음을 주는 게 중요합니다.
“스케치는 누구나 할 수 있습니다.”
초등학생의 그림도 장황한 요건 설명보다 효과적입니다.
명심해야 할 것
“프로토타입은 예술품이 아닙니다.”
프로토타입을 아름답고 멋지게 꾸미는 시간에 더 많은 사람과 아이디어를 교
환하는 게 이득입니다..
“제대로 만들 수 없다면 제대로 만든 척이라도 합시다.”
인터랙션 기반의 프로토타입을 구현할 때 코딩 못한다고 프로토타이핑 못하
는 거 아닙니다. 꼼수는 얼마든지 있습니다.
“필요한 부분만 프로토타이핑하라.”
하나만 결정되면 다른 부분을 정의할 수 있는 use case나 한가지 템플릿만
체크하면 대부분을 정의할 수 있는 화면 요건이 많습니다. 괜히 전부 다 하려
다가 하나도 못하는 상황을 피합시다.
간단히
해보는
Prototyping
Case 1 : 파수 웹사이트 제품 페이지 설계
Step 1 : 레이아웃
간단히
해보는
Prototyping
Case 1 : 파수 웹사이트 제품 페이지 설계
Step 2 : 공통요소
SearchLogin | Join | Korean
Privacy | Legal | Sitemap | RSS | Fasoo Partner Portal
Product & Solutions Support Center PR Center About Fasoo
간단히
해보는
Prototyping
Case 1 : 파수 웹사이트 제품 페이지 설계
Step 2 : 공통요소
SearchLogin | Join | Korean
Privacy | Legal | Sitemap | RSS | Fasoo Partner Portal
Product & Solutions Support Center PR Center About Fasoo
Document Security Home > Product & Solutions > Document Security > DRM > FSD
DRM
• Product ▲
FED
> FSD
FSN
FSE
FSP
FSW
Fasoo Mobile Solution
DRM one
FSS
• Consulting Services ▲
개인 정보 보호
• FAST
• FICS
Document Security
Source Code Analysis
Content Publishing
Database Security
간단히
해보는
Prototyping
Case 1 : 파수 웹사이트 제품 페이지 설계
Step 3 : 컨텐츠
SearchLogin | Join | Korean
Privacy | Legal | Sitemap | RSS | Fasoo Partner Portal
Product & Solutions Support Center PR Center About Fasoo
Document Security Home > Product & Solutions > Document Security > DRM > FSD
DRM
• Product ▲
FED
> FSD
FSN
FSE
FSP
FSW
Fasoo Mobile Solution
DRM one
FSS
• Consulting Services ▲
개인 정보 보호
• FAST
• FICS
Document Security
Source Code Analysis
Content Publishing
Database Security
FSD
Fasoo Secure Document
Related Products & Materials
“정보 시스템에서 관리하는
중요문서에 대한 근원적인
보안 대책을 제시합니다.”
Preface
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다. 정보 시스
템에서 관리하는 중요문서에 대한 근원적인
보안 대책을 제시합니다
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다
In practice
정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시
합니다. 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대
책을 제시합니다
정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시
합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책
을 제시합니다
System Requirement
Supported Applications
Certifications
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다. 정보 시
스템에서 관리하는 중요문서에 대한 근원적
인 보안 대책을 제시합니다
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다. 정보 시
스템에서 관리하는 중요문서에 대한 근원적
인 보안 대책을 제시합니다
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다. 정보 시
스템에서 관리하는 중요문서에 대한 근원적
인 보안 대책을 제시합니다
Key Features
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다. 정보 시
스템에서 관리하는 중요문서에 대한 근원적
인 보안 대책을 제시합니다
정보 시스템에서 관리하는 중요문서에 대한
근원적인 보안 대책을 제시합니다. 정보 시
스템에서 관리하는 중요문서에 대한 근원적
인 보안 대책을 제시합니다
Brochure Inquiry
E-mail this page
Printer View
• 정보 시스템에서 관리하는 중요문서
에 대한 보안 대책을 제시합니다.
• 정보 시스템에서 관리하는 중요문서
에 대한 보안 대책을 제시합니다
• 정보 시스템에서 관리하는 중요문서
에 대한 보안 대책을 제시합니다.
• 정보 시스템에서 관리하는 중요문서
에 대한 보안 대책을 제시합니다
정보 시스템에서 관리하는 중요문서에
대한 근원적인 보안 대책을 제시합니다.
정보 시스템에서 관리하는 중요문서에
대한 근원적인 보안 대책을 제시합니다
정보 시스템에서 관리하는 중요문서에
대한 근원적인 보안 대책을 제시합니다.
정보 시스템에서 관리하는 중요문서에
대한 근원적인 보안 대책을 제시합니다
SHARE THIS
간단히 해보는 Prototyping
Case 2 : 파수 클라이언트 인터랙션 설계
검사
내 문서
로컬 디스크 (C:)
로컬 디스크 (D:)
로컬 디스크 (E:)
Program files
admin
바탕 화면
Users
Home > 검사 실행
■ 검사 대상 폴더 선택
CAPP Version 1.0 Client
검색 범위
■ 검사 범위
숨김 폴더
압축 파일
시스템 폴더
매주 수요일 12:00
■ CPU 사용률(검사 속도)
중간 (속도 중간)
낮음 (속도 느림)
높음 (속도 빠름)
검사 결과 설정Home 검사 실행
검사 폴더 요약
폴더 이름 전체 경로
간단히 해보는 Prototyping
검사
내 문서
로컬 디스크 (C:)
로컬 디스크 (D:)
로컬 디스크 (E:)
Program files
admin
바탕 화면
Users
Home > 검사 실행
■ 검사 대상 폴더 선택 1
2 3
CAPP Version 1.0 Client
검색 범위
■ 검사 범위
숨김 폴더
압축 파일
시스템 폴더
매주 수요일 12:00
■ CPU 사용률(검사 속도)
중간 (속도 중간)
낮음 (속도 느림)
높음 (속도 빠름)
검사 결과 설정Home 검사 실행
검사 폴더 요약
폴더 이름 전체 경로
검색 시작
예약 검색 일정변경설정된 검색 옵션 변경
최근 검색 결과
2012년 1월 4일 수요일 14:32:11 검색 파일 수 XXXXXXX 검출 파일 수 XXXXXXX
상세 보기
검색 범위
검색 범위 옵션
로컬 디스크 (C:)
로컬 디스크 (D:)Program files
시스템 폴더 포함
CPU 점유율
점유율 높음 (속도 빠름)
매주 수요일 12:00
검사 중
• 현재 검사 중인 퐆더 C:Program FilesCyberlinkPowerDirectorruntimerealpacl full…..
• 검사한 문서 수 XXXXXXX • 검출된 문서 수 XXXXXXX
• 현재 검사 진행 중인 문서
중지일시 정지
CAPP Version 1.0 Client
Case 2 : 파수 클라이언트 인터랙션 설계
간단히 해보는 Prototyping
검사
내 문서
로컬 디스크 (C:)
로컬 디스크 (D:)
로컬 디스크 (E:)
Program files
admin
바탕 화면
Users
Home > 검사 실행
■ 검사 대상 폴더 선택 1
2 3
CAPP Version 1.0 Client
검색 범위
■ 검사 범위
숨김 폴더
압축 파일
시스템 폴더
매주 수요일 12:00
■ CPU 사용률(검사 속도)
중간 (속도 중간)
낮음 (속도 느림)
높음 (속도 빠름)
검사 결과 설정Home 검사 실행
검사 폴더 요약
폴더 이름 전체 경로
검색 시작
예약 검색 일정변경설정된 검색 옵션 변경
최근 검색 결과
2012년 1월 4일 수요일 14:32:11 검색 파일 수 XXXXXXX 검출 파일 수 XXXXXXX
상세 보기
검색 범위
검색 범위 옵션
로컬 디스크 (C:)
로컬 디스크 (D:)Program files
시스템 폴더 포함
CPU 점유율
점유율 높음 (속도 빠름)
매주 수요일 12:00
검사 중
• 현재 검사 중인 퐆더 C:Program FilesCyberlinkPowerDirectorruntimerealpacl full…..
• 검사한 문서 수 XXXXXXX • 검출된 문서 수 XXXXXXX
• 현재 검사 진행 중인 문서
중지일시 정지
CAPP Version 1.0 Client
Case 2 : 파수 클라이언트 인터랙션 설계
간단히 해보는 Prototyping
검사
내 문서
로컬 디스크 (C:)
로컬 디스크 (D:)
로컬 디스크 (E:)
Program files
admin
바탕 화면
Users
Home > 검사 실행
■ 검사 대상 폴더 선택 1
2 3
CAPP Version 1.0 Client
검색 범위
■ 검사 범위
숨김 폴더
압축 파일
시스템 폴더
매주 수요일 12:00
■ CPU 사용률(검사 속도)
중간 (속도 중간)
낮음 (속도 느림)
높음 (속도 빠름)
검사 결과 설정Home 검사 실행
검사 폴더 요약
폴더 이름 전체 경로
검색 시작
예약 검색 일정변경설정된 검색 옵션 변경
최근 검색 결과
2012년 1월 4일 수요일 14:32:11 검색 파일 수 XXXXXXX 검출 파일 수 XXXXXXX
상세 보기
검색 범위
검색 범위 옵션
로컬 디스크 (C:)
로컬 디스크 (D:)Program files
시스템 폴더 포함
CPU 점유율
점유율 높음 (속도 빠름)
매주 수요일 12:00
검사 중
• 현재 검사 중인 폴더 C:Program FilesCyberlinkPowerDirectorruntimerealpacl full…..
• 검사한 파일 수 XXXXXXX • 검출 파일 수 XXXXXXX
• 현재 검사 진행 중
중지일시 정지
검사가 완료되었습니다. 5초 후 검사 결과 페이지로 이동합니다.
닫기
검사 완료
CAPP Version 1.0 Client
Case 2 : 파수 클라이언트 인터랙션 설계
간단히 해보는 Prototyping
Case 3 : 파수 모바일 App. 트랜지션 설계
2013
January
2013
February
2013
March
2013 Fasoo Monthly Newsletter
January
Fasoo FSN Brochure
XXXXXXXXXX
Fasoo FUT Brochure
XXXXXXXXXX
2013 Fasoo Monthly Newsletter
February
2013 Fasoo Monthly Newsletter
March
2013
April
2013 Fasoo Monthly Newsletter
April
Fasoo
FSN
Brochure
Fasoo
FUT
Brochure
>
>
>
>
>
>
>
>
>
New
New
Fasoo Monthly Newletter
Fasoo Saleskit
좌우 Flicking으
로 Issue 탐색
Issue 터치하면
해당 Issue 1
page Magazine
view로 이동
Close Close
Fasoo
Mobile Web
Fasoo
New Service
1 2
X2
Tab
Drag
Flick
Swipe
Double tab
Pinch open
Pinch close
Touch & hold
Shake
Q & A

Más contenido relacionado

La actualidad más candente

20150307 abcd발표_ux디자이너 실력으로 살아남기
20150307 abcd발표_ux디자이너 실력으로 살아남기20150307 abcd발표_ux디자이너 실력으로 살아남기
20150307 abcd발표_ux디자이너 실력으로 살아남기SANGBUM HA
 
모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기Jae-hyung Park
 
소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)
소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)
소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)keesung kim
 
Lean prototyping: Prototyping for Lean Process
Lean prototyping: Prototyping for Lean ProcessLean prototyping: Prototyping for Lean Process
Lean prototyping: Prototyping for Lean ProcessTony (Soo) Kim
 
사용자경험유지하기(@UX Storming/2012)
사용자경험유지하기(@UX Storming/2012)사용자경험유지하기(@UX Storming/2012)
사용자경험유지하기(@UX Storming/2012)keesung kim
 
Mobile ux design_for_ck_univ
Mobile ux design_for_ck_univMobile ux design_for_ck_univ
Mobile ux design_for_ck_univJunsang Dong
 
20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가
20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가
20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가SANGBUM HA
 
스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)
스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)
스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)keesung kim
 
2015 HCI - Smart TV General Guidelines
2015 HCI - Smart TV General Guidelines2015 HCI - Smart TV General Guidelines
2015 HCI - Smart TV General GuidelinesDonghoo Kim
 
당신이 UX Design Project에 참여할 때 알아야 할 것들
당신이 UX Design Project에 참여할 때 알아야 할 것들당신이 UX Design Project에 참여할 때 알아야 할 것들
당신이 UX Design Project에 참여할 때 알아야 할 것들Dongsik Yang
 
인터랙티브미디어2 - 사용성테스트
인터랙티브미디어2 - 사용성테스트인터랙티브미디어2 - 사용성테스트
인터랙티브미디어2 - 사용성테스트Ji Lee
 
Wwc2016 기획디자인개발그리고프로토
Wwc2016 기획디자인개발그리고프로토Wwc2016 기획디자인개발그리고프로토
Wwc2016 기획디자인개발그리고프로토keesung kim
 
2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인Donghoo Kim
 
UX디자인 bookstudy
UX디자인 bookstudyUX디자인 bookstudy
UX디자인 bookstudy정인 주
 
사용자 리서치 분석
사용자 리서치 분석사용자 리서치 분석
사용자 리서치 분석Hye-ryeong Park
 
UX_trigger v2.(Limepaper) 2015
UX_trigger v2.(Limepaper) 2015UX_trigger v2.(Limepaper) 2015
UX_trigger v2.(Limepaper) 2015Limepaper, Inc.
 
UX 디자인 기본 개념과 프로세스
UX 디자인 기본 개념과 프로세스UX 디자인 기본 개념과 프로세스
UX 디자인 기본 개념과 프로세스Hyun-june Kwon
 
UX 디자인 7가지 비밀: 비밀 4
UX 디자인 7가지 비밀: 비밀 4UX 디자인 7가지 비밀: 비밀 4
UX 디자인 7가지 비밀: 비밀 4Nammin Lee
 

La actualidad más candente (20)

20150307 abcd발표_ux디자이너 실력으로 살아남기
20150307 abcd발표_ux디자이너 실력으로 살아남기20150307 abcd발표_ux디자이너 실력으로 살아남기
20150307 abcd발표_ux디자이너 실력으로 살아남기
 
모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기
 
소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)
소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)
소소하지만 재미있는 UX, 트랜지션과 애니메이션 (@UX월드/2014)
 
사용자 중심의 소프트웨어 개발을 위한 UI/UX 참조모델 가이드
사용자 중심의 소프트웨어 개발을 위한 UI/UX 참조모델 가이드사용자 중심의 소프트웨어 개발을 위한 UI/UX 참조모델 가이드
사용자 중심의 소프트웨어 개발을 위한 UI/UX 참조모델 가이드
 
Lean prototyping: Prototyping for Lean Process
Lean prototyping: Prototyping for Lean ProcessLean prototyping: Prototyping for Lean Process
Lean prototyping: Prototyping for Lean Process
 
사용자경험유지하기(@UX Storming/2012)
사용자경험유지하기(@UX Storming/2012)사용자경험유지하기(@UX Storming/2012)
사용자경험유지하기(@UX Storming/2012)
 
Mobile ux design_for_ck_univ
Mobile ux design_for_ck_univMobile ux design_for_ck_univ
Mobile ux design_for_ck_univ
 
20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가
20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가
20150328 e xsalon발표2_UX디자이너 왜 살아남기 어려운가
 
스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)
스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)
스타트업에서의 UX Design / UX Design @Startup (@글로벌K스타트업, 2013)
 
2015 HCI - Smart TV General Guidelines
2015 HCI - Smart TV General Guidelines2015 HCI - Smart TV General Guidelines
2015 HCI - Smart TV General Guidelines
 
당신이 UX Design Project에 참여할 때 알아야 할 것들
당신이 UX Design Project에 참여할 때 알아야 할 것들당신이 UX Design Project에 참여할 때 알아야 할 것들
당신이 UX Design Project에 참여할 때 알아야 할 것들
 
인터랙티브미디어2 - 사용성테스트
인터랙티브미디어2 - 사용성테스트인터랙티브미디어2 - 사용성테스트
인터랙티브미디어2 - 사용성테스트
 
Making Good UX
Making Good UXMaking Good UX
Making Good UX
 
Wwc2016 기획디자인개발그리고프로토
Wwc2016 기획디자인개발그리고프로토Wwc2016 기획디자인개발그리고프로토
Wwc2016 기획디자인개발그리고프로토
 
2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인
 
UX디자인 bookstudy
UX디자인 bookstudyUX디자인 bookstudy
UX디자인 bookstudy
 
사용자 리서치 분석
사용자 리서치 분석사용자 리서치 분석
사용자 리서치 분석
 
UX_trigger v2.(Limepaper) 2015
UX_trigger v2.(Limepaper) 2015UX_trigger v2.(Limepaper) 2015
UX_trigger v2.(Limepaper) 2015
 
UX 디자인 기본 개념과 프로세스
UX 디자인 기본 개념과 프로세스UX 디자인 기본 개념과 프로세스
UX 디자인 기본 개념과 프로세스
 
UX 디자인 7가지 비밀: 비밀 4
UX 디자인 7가지 비밀: 비밀 4UX 디자인 7가지 비밀: 비밀 4
UX 디자인 7가지 비밀: 비밀 4
 

Similar a UI/UX 개선을 위한 빠른 프로토타이핑

How to implement your dream 20150427
How to implement your dream 20150427How to implement your dream 20150427
How to implement your dream 20150427Will Kim
 
예비 개발자를 위한 소프트웨어 세상 이야기
예비 개발자를 위한 소프트웨어 세상 이야기예비 개발자를 위한 소프트웨어 세상 이야기
예비 개발자를 위한 소프트웨어 세상 이야기수보 김
 
EMOCON 2015 - 품질과 테스트는 다르다
EMOCON 2015 - 품질과 테스트는 다르다EMOCON 2015 - 품질과 테스트는 다르다
EMOCON 2015 - 품질과 테스트는 다르다이상한모임
 
2013 공개SW데이 발표 - 구름IDE의 발자취와 미래
2013 공개SW데이 발표 - 구름IDE의 발자취와 미래2013 공개SW데이 발표 - 구름IDE의 발자취와 미래
2013 공개SW데이 발표 - 구름IDE의 발자취와 미래Sung-tae Ryu
 
꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)
꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)
꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)VMware Tanzu Korea
 
[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스
[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스
[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스Hee Jae Lee
 
U&i insight2012스터디설명회
U&i insight2012스터디설명회U&i insight2012스터디설명회
U&i insight2012스터디설명회Amy Young Ah Kim
 
애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)
애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)
애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)SangIn Choung
 
[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발
[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발
[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발동현 김
 
[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)
[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)
[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)NAVER D2
 
Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...
Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...
Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...Amazon Web Services Korea
 
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기Soojin Ro
 
지속적인 통합
지속적인 통합지속적인 통합
지속적인 통합중선 곽
 
제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624
제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624
제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624uEngine Solutions
 
테스팅을위한선행조건 명세
테스팅을위한선행조건 명세테스팅을위한선행조건 명세
테스팅을위한선행조건 명세규동 최규동
 
오픈소스 컨트리뷰톤 2020 backend.ai 발표자료
오픈소스 컨트리뷰톤 2020 backend.ai 발표자료오픈소스 컨트리뷰톤 2020 backend.ai 발표자료
오픈소스 컨트리뷰톤 2020 backend.ai 발표자료지원 정
 
TOAST Meetup2015 - 구름 Cloud IDE (류성태)
TOAST Meetup2015 - 구름 Cloud IDE (류성태)TOAST Meetup2015 - 구름 Cloud IDE (류성태)
TOAST Meetup2015 - 구름 Cloud IDE (류성태)TOAST_NHNent
 
Week1 ot
Week1 otWeek1 ot
Week1 otEun Yu
 
전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)
전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)
전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)Yan So
 

Similar a UI/UX 개선을 위한 빠른 프로토타이핑 (20)

How to implement your dream 20150427
How to implement your dream 20150427How to implement your dream 20150427
How to implement your dream 20150427
 
예비 개발자를 위한 소프트웨어 세상 이야기
예비 개발자를 위한 소프트웨어 세상 이야기예비 개발자를 위한 소프트웨어 세상 이야기
예비 개발자를 위한 소프트웨어 세상 이야기
 
EMOCON 2015 - 품질과 테스트는 다르다
EMOCON 2015 - 품질과 테스트는 다르다EMOCON 2015 - 품질과 테스트는 다르다
EMOCON 2015 - 품질과 테스트는 다르다
 
2013 공개SW데이 발표 - 구름IDE의 발자취와 미래
2013 공개SW데이 발표 - 구름IDE의 발자취와 미래2013 공개SW데이 발표 - 구름IDE의 발자취와 미래
2013 공개SW데이 발표 - 구름IDE의 발자취와 미래
 
꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)
꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)
꿀밋업시리즈3탄_Spring Boot를 활용한 마이크로서비스 개발과 페어프로그래밍(TDD)
 
[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스
[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스
[오픈소스컨설팅]Session 6. scrum과 jira 기반의 소프트웨어 개발 프로세스
 
U&i insight2012스터디설명회
U&i insight2012스터디설명회U&i insight2012스터디설명회
U&i insight2012스터디설명회
 
애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)
애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)
애자일과 애자일 테스트 소개 (테스트기본교육 3장 2절)
 
[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발
[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발
[HYSS 2016] 쉽고 빠르게 시작하는 Volatility Plugin 개발
 
[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)
[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)
[Kerference] 쉽고 빠르게 시작하는 Volatility plugin 개발 - 김동현(BoB)
 
Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...
Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...
Case Study를 통해 본 데이터사이언스 협업 플랫폼의 필요성 (옥주영 컨설턴트, Hancom MDS) :: AWS Techforum ...
 
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
 
지속적인 통합
지속적인 통합지속적인 통합
지속적인 통합
 
제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624
제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624
제4회 아키텍트대회 발표자료 유엔진솔루션즈 장진영 V1.2[1] 110624
 
테스팅을위한선행조건 명세
테스팅을위한선행조건 명세테스팅을위한선행조건 명세
테스팅을위한선행조건 명세
 
오픈소스 컨트리뷰톤 2020 backend.ai 발표자료
오픈소스 컨트리뷰톤 2020 backend.ai 발표자료오픈소스 컨트리뷰톤 2020 backend.ai 발표자료
오픈소스 컨트리뷰톤 2020 backend.ai 발표자료
 
애자일의 모든것
애자일의 모든것애자일의 모든것
애자일의 모든것
 
TOAST Meetup2015 - 구름 Cloud IDE (류성태)
TOAST Meetup2015 - 구름 Cloud IDE (류성태)TOAST Meetup2015 - 구름 Cloud IDE (류성태)
TOAST Meetup2015 - 구름 Cloud IDE (류성태)
 
Week1 ot
Week1 otWeek1 ot
Week1 ot
 
전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)
전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)
전혀 새로운 방법의 데이터 탐색 - 김민수 (Tableau)
 

UI/UX 개선을 위한 빠른 프로토타이핑

  • 1. Rapid Prototyping빠른 프로토타이핑으로 소프트웨어 UX 개선하기 Fasoo ED Team 2013.04.11
  • 2. 오늘 할 이야기들 사용자 중심으로 제품을 개발해야 하는 이유? 사용자 중심 제품 개발에 가장 적합한 method인 UI Prototyping의 소개와 관련 이야기들
  • 3. 우리는 어떻게 소프트웨어를 만들어 왔을까요? 개발자 중심 예산/일정 중심
  • 4. “세상의 중심은 개발자” 고객의 니즈와 관계없이 산으로 가는 개발 과정 고객이 설명한 것 PM이 이해한 것 기획자가 설계한 것 프로그래머가 코딩 한 것 비즈니스 컨설턴트가 상상하는 모습 문서화 된 산출물 현황 개발 진척 상황 고객이 지불한 비용 고객 지원 현황 사실 고객이 진짜 원하는 것
  • 5. “예산과 일정이 세상의 기준” 고객이 알파 버전을 사용하게 될 날은 언제 올까요. 일정에 맞춰서 제품의 요구사항을 축소하거나 일부만 구현하거나... 혹은 퀄리티를 낮추거나.. 예산에 맞춰서 요구사항을 미구현한 상태로 제 품 발표하거나… 혹은 퀄리티를 낮추거나..
  • 7. 쇼핑 동선 설계와 제품 분류가 완벽하고 친절해서 제품 배달까지 해주는 대형 마트 물건도 적고 찾기도 힘들고 주인장은 마실 나간 동네 구멍가게 현실 이상
  • 8. 사용자 중심이어야 하는 이유는 너무 많습니다. “우리가 쓰려고 만드는 것이 아니라 고객이 사용할 제품을 만드는 겁니다.” “뻔한 얘기지만 고객은 개발자가 아니고 사용자입니다. 프로그래밍에 대한 지식도 없고 구매한 제품에서 목적에 부합하지 않는 미적 가치를 추구하지도 않으며 개발사의 비즈니스 모델에도 관심 없습니다.” “고객은 기능보다 기능을 매개로 구현하는 „목적‟이나 „가치‟,‟경험‟ 에 관심 이 있습니다.” “고객은 우리의 일정이나 일손 부족 같은 건 진짜 관심 없습니다.” “기능이나 제품의 가격, 효용성, 필요한 시기에 시장에 출시되는 것 등등은 성공하는 제품의 중요한 요소이지만 결코 모든 것은 아닙니다.”
  • 9. 일반적인 사용자 중심 개발 프로세스 사용자 중심 제품 개발 과정의 태반이 사용자를 끊임없이 이해하는 과정의 반복이라는 것을 알 수 있습니다.
  • 10. 사용자 경험에 영향을 주는 것들 Product Service Provider S/WH/W User Device Interface Service Contents Environment (Context) UX Design Feel Sense Think Act Relate 감정을 통한 경험관계를 통한 경험 감각을 통한 경험 사고를 통한 경험 신체적 행위를 통한 경험 Space Time Bernd Schmitt, “Strategic experience modules”. Community
  • 11. User Interface 요소를 사용자 경험 기준으로 보기
  • 12. 사용자 중심 개발을 위해서 는 인간을 이해하고 기계를 이해하고 컨텍스트를 이해하 고 관계를 이해하고 인문학 을 공부하고 공학을 공부하 고 미학을 공부하고 비즈니 스를 공부하고…
  • 13. 공부할 시간이 없으시다면 좋은 대안이 있습니다. ED팀에서 배포한 UI 개발자 매뉴얼 1. Outline 2. Goal 3. Coverage 4. Product Value 5. User Value 6. Fasoo UI Develop Principle 7. Layout Guideline - Main page layout - Sub page layout - Modal window layout - Button set 8. UI Pattern Guideline - Navigation UI pattern - List UI pattern - Form UI pattern 9. Publishing Guideline - Layout palette - Layout Structure - Layout Sample - UIO palette - UIO Sample - Common Rule - Web accessibility / Web Standard Appendix 1 . UI Develop Checklist
  • 14. 사실 사용자 중심 소프트웨어 개발이 싫은 사람은 없습니다.
  • 15. 몇 가지 문제만 없다면… 바쁜 일정 부족한 예산 더 부족한 인력 복잡한 의사소통 구조 그 와중에 무시되는 사용자 쌓여가는 요구사항
  • 16. 피할 수 없다면 적응합시다.
  • 17. 방법이 없는 건 아닙니다. 일정을 단축하고 예산을 절약하고 인력도 절약하고 손쉽게 의사소통하고 고객 니즈를 발 빠르게 수집하고 요구사항을 빠르게 처리
  • 20. 사실 Prototyping은 굉장히 일상적인 방법론입니다. 건축 분야에서는 필수적인 절차 제품 디자인 분야에서도 일상적 자동차 클레이 목업도 대표적 프로토타이핑
  • 21. 소프트웨어 개발에서 Prototyping 을 사용하지 않을 이유가 없습니다. 물론 우리가 초 천재라서 프로젝트의 모든 리스크를 미리 예측하고 고객이 원하는 것을 점쟁이처럼 맞추고 애매한 요구사항만으로 최종 산출물의 그림을 척척 그려내서 코딩까지 할 수 있다면 굳이 할 필욘 없죠.
  • 22. UI Prototyping 의 수많은 장점들 “시간, 노력, 비용을 절감할 수 있습니다.” “아주 빠르게 실제 목표를 가시화 할 수 있습니다.” “개발 목표의 애매모호함을 비약적으로 줄일 수 있습니다.” “구현 가능성 (feasibility)를 매우 빨리 측정할 수 있습니다.” “개발과 함께 사용성 테스트를 빠르게 진행하여 고객의 니즈를 빠르게 취합할 수 있습니다.” “프로토타입을 매개로 내부의 다양한 아이디어를 빠르게 수집할 수 있습니다.” “커뮤니케이션을 보다 클리어하고 명확하게 할 수 있습니다.”
  • 23. UI Prototyping의 몇 가지 단점(?)들 “빠른 커뮤니케이션이 용이하다 보니 중간 산출물이나 문서 작성이 생략 되 어 장기적으로는 문제가 될 수도 있습니다.” “프로토타이핑 범위를 정하는 것이 늘 쉽지 않습니다. 최종 산출물에 가까운 프로토타입을 만든다면 프로토타이핑의 강점을 살리기 쉽지 않고 반대로 너 무 러프 한 프로토타입을 만든다면 구현 목표 파악이나 테스트를 통한 정보 수집에 문제가 생길 수도 있습니다.”
  • 24. 다양한 UI Prototyping 방법 Paper Prototyping HTML Coding Adobe Application (Photoshop, Fireworks, Dreamweaver, Muse) MS Office (Powerpoint, Visio, Excel) UI Prototyping 전용 App. Apple OmniGraffle
  • 25. 전용 Prototyping tool Pencil Fluid UI Balsamiq Mockups Mockflow
  • 27. Paper Prototyping 장단점 융통성이 있다. 제작 속도가 빠르다. 비용이 싸다. 쉽다. 빠르다. 협력작업이 용이하다. 하드웨어의 구애를 받지 않는다. 언제 어디서든 할 수 있다. 원격 작업에 부적합 하다. 소스 재활용이 불가능 하다. 상상력이 필요하다. 시각적 표현에 한계가 있다.
  • 29. 그 외의 Prototyping Tool 장단점 HTML 코딩 (Flex, Silverlight..) Adobe application (Photoshop, Fireworks, Dreamweaver, M use) MS Office (Powerpoint, Visio, Excel) Prototyping 전용 툴 • 플랫폼 프리 • 무료 • 최종 산출물과 매우 유사한 프로 토타입 제작 가능 • 구현 가능성 추적 용이 • 협업의 용이성 • 소스 재활용성 높음 • 높은 인터랙션 구현 • 실제 UI에 가장 가까운 비주얼 연 출 가능 (가장 높은 완성도의 프로 토타입 제작 가능) • 소스 재활용성 높음 • 배우기 쉽다 • 거의 가지고 있다. • 복사해서 붙이기. • 화면 순서 정렬 용이. • 문서화 용이. • 약간의 인터랙션 구현 가능. • 배우기 쉽다. • 다양한 템플릿을 제공 • 익숙해지면 높은 효율 제공 • 배우기 쉽지 않음 • 숙련되기 전까지는 비효율적 • 배우기 어렵다 • 비 숙련자에게는 적합하지 않음 • 하드웨어 사양 • 매우 비쌈 • 제한적인 그리기 도구 • 제한적인 인터랙션 • 재사용이 불가능한 소스코드 • 소스 재활용이 낮음 • 자유도가 떨어짐 • Hi-Fi 프로토타입 제작에 적합 하지 않음
  • 30. 어떤 방식을 사용할까요? 일단 Paper Prototyping은 기본 중의 기본입니다. 너무 쉬워 보여서 무시당 하는 경향이 강할 뿐입니다. 손에 익숙해서 빠르게 사용할 수 있는 방식이 가장 좋습니다. 종이에 스케치 하는 것 보다 직접 코딩 하는 게 더 빠르다면 코딩 하세요. 가급적 다양한 방식에 익숙해지는 것이 좋습니다. 프로토타입의 구현 목표 와 기대치가 프로젝트 유형과 프로젝트 단계 마다 제각각이기 때문에 한 가 지 방법으로는 모든 상황에 대처하기가 힘들 때가 있습니다.
  • 31. 명심해야 할 것 “대상 사용자와 제품의 기획의도를 이해하세요.” 아이디어를 모으고 테스트하기 위한 프로토타입인지 실제 구현될 예정인 제 품의 전모를 보여주기 위한 프로토타입인지 확인하세요. “계획 세우다가 끝내지 말고 일단 프로토타이핑을 하세요.” 프로젝트는 늘 폭풍우처럼 변합니다. 모든 걸 미리 예측하고 진행할 순 없습 니다. “기대 심리를 조성하세요.” 이 프로젝트가 진행되고 있고 가능성 있다는 믿음을 주는 게 중요합니다. “스케치는 누구나 할 수 있습니다.” 초등학생의 그림도 장황한 요건 설명보다 효과적입니다.
  • 32. 명심해야 할 것 “프로토타입은 예술품이 아닙니다.” 프로토타입을 아름답고 멋지게 꾸미는 시간에 더 많은 사람과 아이디어를 교 환하는 게 이득입니다.. “제대로 만들 수 없다면 제대로 만든 척이라도 합시다.” 인터랙션 기반의 프로토타입을 구현할 때 코딩 못한다고 프로토타이핑 못하 는 거 아닙니다. 꼼수는 얼마든지 있습니다. “필요한 부분만 프로토타이핑하라.” 하나만 결정되면 다른 부분을 정의할 수 있는 use case나 한가지 템플릿만 체크하면 대부분을 정의할 수 있는 화면 요건이 많습니다. 괜히 전부 다 하려 다가 하나도 못하는 상황을 피합시다.
  • 33. 간단히 해보는 Prototyping Case 1 : 파수 웹사이트 제품 페이지 설계 Step 1 : 레이아웃
  • 34. 간단히 해보는 Prototyping Case 1 : 파수 웹사이트 제품 페이지 설계 Step 2 : 공통요소 SearchLogin | Join | Korean Privacy | Legal | Sitemap | RSS | Fasoo Partner Portal Product & Solutions Support Center PR Center About Fasoo
  • 35. 간단히 해보는 Prototyping Case 1 : 파수 웹사이트 제품 페이지 설계 Step 2 : 공통요소 SearchLogin | Join | Korean Privacy | Legal | Sitemap | RSS | Fasoo Partner Portal Product & Solutions Support Center PR Center About Fasoo Document Security Home > Product & Solutions > Document Security > DRM > FSD DRM • Product ▲ FED > FSD FSN FSE FSP FSW Fasoo Mobile Solution DRM one FSS • Consulting Services ▲ 개인 정보 보호 • FAST • FICS Document Security Source Code Analysis Content Publishing Database Security
  • 36. 간단히 해보는 Prototyping Case 1 : 파수 웹사이트 제품 페이지 설계 Step 3 : 컨텐츠 SearchLogin | Join | Korean Privacy | Legal | Sitemap | RSS | Fasoo Partner Portal Product & Solutions Support Center PR Center About Fasoo Document Security Home > Product & Solutions > Document Security > DRM > FSD DRM • Product ▲ FED > FSD FSN FSE FSP FSW Fasoo Mobile Solution DRM one FSS • Consulting Services ▲ 개인 정보 보호 • FAST • FICS Document Security Source Code Analysis Content Publishing Database Security FSD Fasoo Secure Document Related Products & Materials “정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다.” Preface 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시스 템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다 In practice 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시 합니다. 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대 책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시 합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책 을 제시합니다 System Requirement Supported Applications Certifications 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시 스템에서 관리하는 중요문서에 대한 근원적 인 보안 대책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시 스템에서 관리하는 중요문서에 대한 근원적 인 보안 대책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시 스템에서 관리하는 중요문서에 대한 근원적 인 보안 대책을 제시합니다 Key Features 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시 스템에서 관리하는 중요문서에 대한 근원적 인 보안 대책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시 스템에서 관리하는 중요문서에 대한 근원적 인 보안 대책을 제시합니다 Brochure Inquiry E-mail this page Printer View • 정보 시스템에서 관리하는 중요문서 에 대한 보안 대책을 제시합니다. • 정보 시스템에서 관리하는 중요문서 에 대한 보안 대책을 제시합니다 • 정보 시스템에서 관리하는 중요문서 에 대한 보안 대책을 제시합니다. • 정보 시스템에서 관리하는 중요문서 에 대한 보안 대책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다. 정보 시스템에서 관리하는 중요문서에 대한 근원적인 보안 대책을 제시합니다 SHARE THIS
  • 37. 간단히 해보는 Prototyping Case 2 : 파수 클라이언트 인터랙션 설계 검사 내 문서 로컬 디스크 (C:) 로컬 디스크 (D:) 로컬 디스크 (E:) Program files admin 바탕 화면 Users Home > 검사 실행 ■ 검사 대상 폴더 선택 CAPP Version 1.0 Client 검색 범위 ■ 검사 범위 숨김 폴더 압축 파일 시스템 폴더 매주 수요일 12:00 ■ CPU 사용률(검사 속도) 중간 (속도 중간) 낮음 (속도 느림) 높음 (속도 빠름) 검사 결과 설정Home 검사 실행 검사 폴더 요약 폴더 이름 전체 경로
  • 38. 간단히 해보는 Prototyping 검사 내 문서 로컬 디스크 (C:) 로컬 디스크 (D:) 로컬 디스크 (E:) Program files admin 바탕 화면 Users Home > 검사 실행 ■ 검사 대상 폴더 선택 1 2 3 CAPP Version 1.0 Client 검색 범위 ■ 검사 범위 숨김 폴더 압축 파일 시스템 폴더 매주 수요일 12:00 ■ CPU 사용률(검사 속도) 중간 (속도 중간) 낮음 (속도 느림) 높음 (속도 빠름) 검사 결과 설정Home 검사 실행 검사 폴더 요약 폴더 이름 전체 경로 검색 시작 예약 검색 일정변경설정된 검색 옵션 변경 최근 검색 결과 2012년 1월 4일 수요일 14:32:11 검색 파일 수 XXXXXXX 검출 파일 수 XXXXXXX 상세 보기 검색 범위 검색 범위 옵션 로컬 디스크 (C:) 로컬 디스크 (D:)Program files 시스템 폴더 포함 CPU 점유율 점유율 높음 (속도 빠름) 매주 수요일 12:00 검사 중 • 현재 검사 중인 퐆더 C:Program FilesCyberlinkPowerDirectorruntimerealpacl full….. • 검사한 문서 수 XXXXXXX • 검출된 문서 수 XXXXXXX • 현재 검사 진행 중인 문서 중지일시 정지 CAPP Version 1.0 Client Case 2 : 파수 클라이언트 인터랙션 설계
  • 39. 간단히 해보는 Prototyping 검사 내 문서 로컬 디스크 (C:) 로컬 디스크 (D:) 로컬 디스크 (E:) Program files admin 바탕 화면 Users Home > 검사 실행 ■ 검사 대상 폴더 선택 1 2 3 CAPP Version 1.0 Client 검색 범위 ■ 검사 범위 숨김 폴더 압축 파일 시스템 폴더 매주 수요일 12:00 ■ CPU 사용률(검사 속도) 중간 (속도 중간) 낮음 (속도 느림) 높음 (속도 빠름) 검사 결과 설정Home 검사 실행 검사 폴더 요약 폴더 이름 전체 경로 검색 시작 예약 검색 일정변경설정된 검색 옵션 변경 최근 검색 결과 2012년 1월 4일 수요일 14:32:11 검색 파일 수 XXXXXXX 검출 파일 수 XXXXXXX 상세 보기 검색 범위 검색 범위 옵션 로컬 디스크 (C:) 로컬 디스크 (D:)Program files 시스템 폴더 포함 CPU 점유율 점유율 높음 (속도 빠름) 매주 수요일 12:00 검사 중 • 현재 검사 중인 퐆더 C:Program FilesCyberlinkPowerDirectorruntimerealpacl full….. • 검사한 문서 수 XXXXXXX • 검출된 문서 수 XXXXXXX • 현재 검사 진행 중인 문서 중지일시 정지 CAPP Version 1.0 Client Case 2 : 파수 클라이언트 인터랙션 설계
  • 40. 간단히 해보는 Prototyping 검사 내 문서 로컬 디스크 (C:) 로컬 디스크 (D:) 로컬 디스크 (E:) Program files admin 바탕 화면 Users Home > 검사 실행 ■ 검사 대상 폴더 선택 1 2 3 CAPP Version 1.0 Client 검색 범위 ■ 검사 범위 숨김 폴더 압축 파일 시스템 폴더 매주 수요일 12:00 ■ CPU 사용률(검사 속도) 중간 (속도 중간) 낮음 (속도 느림) 높음 (속도 빠름) 검사 결과 설정Home 검사 실행 검사 폴더 요약 폴더 이름 전체 경로 검색 시작 예약 검색 일정변경설정된 검색 옵션 변경 최근 검색 결과 2012년 1월 4일 수요일 14:32:11 검색 파일 수 XXXXXXX 검출 파일 수 XXXXXXX 상세 보기 검색 범위 검색 범위 옵션 로컬 디스크 (C:) 로컬 디스크 (D:)Program files 시스템 폴더 포함 CPU 점유율 점유율 높음 (속도 빠름) 매주 수요일 12:00 검사 중 • 현재 검사 중인 폴더 C:Program FilesCyberlinkPowerDirectorruntimerealpacl full….. • 검사한 파일 수 XXXXXXX • 검출 파일 수 XXXXXXX • 현재 검사 진행 중 중지일시 정지 검사가 완료되었습니다. 5초 후 검사 결과 페이지로 이동합니다. 닫기 검사 완료 CAPP Version 1.0 Client Case 2 : 파수 클라이언트 인터랙션 설계
  • 41. 간단히 해보는 Prototyping Case 3 : 파수 모바일 App. 트랜지션 설계 2013 January 2013 February 2013 March 2013 Fasoo Monthly Newsletter January Fasoo FSN Brochure XXXXXXXXXX Fasoo FUT Brochure XXXXXXXXXX 2013 Fasoo Monthly Newsletter February 2013 Fasoo Monthly Newsletter March 2013 April 2013 Fasoo Monthly Newsletter April Fasoo FSN Brochure Fasoo FUT Brochure > > > > > > > > > New New Fasoo Monthly Newletter Fasoo Saleskit 좌우 Flicking으 로 Issue 탐색 Issue 터치하면 해당 Issue 1 page Magazine view로 이동 Close Close Fasoo Mobile Web Fasoo New Service 1 2 X2 Tab Drag Flick Swipe Double tab Pinch open Pinch close Touch & hold Shake
  • 42. Q & A