Transferers

프로젝트 개요

기술개발 과제

국문 : VR쇼핑 영문 : Shop with VR

과제 팀명

Transferers(편입생들)

지도교수

김성환 교수님

개발기간

2018년 3월 ~ 2018년 6월 (총 4개월)

구성원 소개

서울시립대학교 컴퓨터과학부·과 20159200** 김용민(팀장)

서울시립대학교 컴퓨터과학부·과 20159200** 김정현

서울시립대학교 컴퓨터과학부·과 20159200** 신권철

서울시립대학교 컴퓨터과학부·과 20159200** 장보영

서론

개발 과제의 개요

개발 과제 요약

Unity를 이용한 VR쇼핑 프로그램 구현

개발 과제의 배경

e-커머스 시장은 계속해서 성장하고 있으며 VR 하드웨어/소프트웨어는 더욱 더 빠른 속도로 성장하고 있다.

우리는 시대의 흐름에 맞춰 이 두 가지를 통합시킨 응용프로그램을 개발하기로 했다.

개발 과제의 목표 및 내용

1. 물리엔진 Unity를 이용하여 가상공간 쇼핑몰을 구현한다.

2. 쇼핑몰에서 제공하는 API를 이용하여 가상공간에 상품정보를 불러온다.

3. 헤드 트래킹, 모션 감지를 이용해 제품 정보를 확인할 수 있도록 한다.

4. 사용자가 구매하길 원하는 제품들을 담을 수 있는 장바구니 기능을 개발한다.

관련 기술의 현황

관련 기술의 현황 및 분석(State of art)

• 전 세계적인 기술현황

1. VR 하드웨어 시장에서 가장 눈여겨 볼 만한 발전은 HMD의 시선추척 기술과 Forveated Rendering이다. 사용자의 시선을 추적함으로 사용자별 personalize 기능이 발달됨은 물론이고 시선추적과 Forveated Rendering가 힘을 합쳐 사용자의 시선이 머무는 곳만 고해상도로 렌더링해 하드웨어의 퍼포먼스를 약 300% 향상시킬 수 있는 것으로 알려져있다.

2. Positional Tracking& Motion capture : 사용자 자세, 움직임 감지 성능이 향상되면서 사용자에게 좀 더 실제와 유사한 느낌을 줄 수 있다

3. 인터파크에서 VR관련 플랫폼 개발을 계획했으나 ActiveX 그리고 다른 국내 인터넷 법들의 제한으로 성사되지 못했다.

시장상황에 대한 분석

• 경쟁제품 조사 비교

1. Buy+ (알리바바의 VR쇼핑 컨셉) 
중국의 Alibaba에서는 Buy+라는 이름의 VR어플리케이션을 개발하여 5억명이 넘는 유저가 이용하는 Alipay의 사용에 편의를 제공할 예정을 발표하면서,
VR 쇼핑에 대한 미래의 가능성을 시사해 주고 있다.

2. 인터파크의 VR 쇼핑 진출 시도
한국의 E-커머스 중 하나인 인터파크에서 VR 쇼핑 서비스를 제공할 예정으로 출시 발표를 했었다.
하지만 한국의 특이한 결제 방식인 ActiveX로 인해 프로그램 상용화가 미뤄져서 아직도 출시하지 못했다.

• 마케팅 전략 제시

(1) 몸이 불편한 사람들도 어플리케이션을 이용하여 자유로운 경험을 할 수 있게 해줌

(2) VR 공간의 특징(자원, 안전 등으로부터 자유로움)을 이용해 다양한 볼거리를 제공

(3) 호환성을 이용해 다양한 쇼핑몰 업체와 연계

(4) 365일 24시 운영 가능함

• 홍보 전략 제시

(1) 제휴 VR 기기를 구입 시 프로그램 제공

(2) 파워 블로거, 페이스북 Sponsered

(3) 쇼핑몰이나 VR 체험 업체와의 제휴, 프로그램 시연을 통한 홍보

(4) 제휴 쇼핑몰과 할인 이벤트 추진

개발과제의 기대효과

기술적 기대효과

- 쇼핑몰 API를 이용한 VR쇼핑 프로그램의 개발 가능성을 보여 줄 수 있다.

- 쇼핑몰에서 직접 3D 오브젝트를 구현하여 API로 제공해 주게 될 가능성이 높아진다.

경제적, 사회적 기대 및 파급효과

- VR 커머스 시장의 확대

- 서비스 이용 편의성 및 운영 효율성 증대

- 대륙간 쇼핑의 가능성 확보

- VR 쇼핑몰의 활성화를 통한 인터넷 쇼핑몰의 결제 방식의 변화

기술개발 일정 및 추진체계

개발 일정

1~3주차 - 요구사항 분석

3~9주차 - 설계

5~12 주차 - 구현

11~14주차 - 테스트

구성원 및 추진체계

업무 분담
1. API조사 및 설계 – 김용민, 김정현, 신권철, 장보영         1-2. API 구현 – 김용민, 장보영
2. 유니티 월드 구현 – 김정현, 장보영
3. VR 기기 연동 – 김용민
4. UI 설계 및 구현 – 김용민, 김정현, 장보영
5. 내부 데이터 흐름 설계 – 김용민, 신권철
6. 데이터 저장 및 XML 출력 – 김용민
7. 사용자 분석 알고리즘 조사 및 설계 – 신권철, 김정현, 장보영
8. 물체와의 상호작용 구현 – 김정현
9. User 움직임 구현 – 신권철, 장보영
10. URL을 통한 이미지 다운로드 - 신권철

설계

설계사양

설계 사양

• 사용한 하드웨어

1) 컴퓨터(cpu : i5-2500 ,graphic card: GTX 960, RAM 8GB)

2) Oculus Development Kit 2

• 사용한 프로그램

1) UnityEngine(Ver.2017.1.0p5)

2) VisualStudio 2017

3) Oculus SDK

UnityEngine의 공식 개발 프로그래밍 언어인 C#을 사용하기 위해 VisualStudio 2017을 사용하였으며, 

Oculus SDK를 유니티 엔진에 연동하여 Oculus DK2 를 이용해 가상공간에서 움직일 수 있게 구현하였다. 

개발에 사용된 컴퓨터는 Oculus DK2를 구동하기 위한 최소사양을 갖추고 있다.

개념설계안

1. 아이템 생성
11번가에 검색해서 나오는 판매 아이템들의 관한 정보 리스트를 받아서, GameObject에 데이터들을 저장함.
1.1 기본 흐름
1) 비어있는 아이템 진열장으로 사용자가 접근.
2) 사용자가 원하는 아이템을 검색, 혹은 미리 지정한 검색어 버튼을 눌러 아이템을 검색
3) 사용자가 입력한 정보를 토대로 나온 물품 정보에 맞는 약 20 개의 아이템 오브젝드들이 진열장 위에 생성됨.

1.2 대안 흐름 : 사용자가 이미 아이템이 진열된 진열장을 다른 아이템으로 변경하고 싶어함
1) 사용자가 다른 정보를 입력, 혹은 버튼을 눌러 다른 아이템을 검색.
2) 기존에 있던 아이템 오브젝트들은 전부 사라지고, 검색어에 맞는 다른 아이템 오브젝트이 생성됨

2. 아이템 선택
아이템을 가리키면 해당 아이템을 선택할 수 있음.

2.1 기본 흐름
1) VR 컨트롤러의 커서를 아이템 위에 올려놓음.
2) 선택된 아이템의 색상이 약간 변함.
3) 선택한 아이템의 위에 아이템 정보를 간략하게 보여주는 UI 박스가 생성됨.
4) 아이템을 선택하면 아이템 상세 정보 보기로 넘어감.
4-2) 커서를 다른 곳으로 돌리면 아이템의 색상이 원상태로 돌아옴. 또한 UI 박스가 사라짐.

3. 아이템 정보 상세 보기
아이템의 명칭, 아이템에 관한 Image정보, 아이템 구입 할 수 있는 웹페이지 URL과 아이템의 3d Mesh와 그와 비슷한 아이템의 정보를 사용자가 VR UI를 통해 볼 수 있다.
3.1 기본 흐름
1) 커서를 통해 선택한 아이템을 클릭하면 상세정보 보기위한 UI가 유저 눈 앞에 생성됨.
2) UI의 정보는 선택한 아이템의 값을 읽어서 그대로 보여줌

3.2 대안 흐름 : 비슷한 아이템을 선택하고 싶을 때
1) 사용자가 오른쪽에 보이는 스크롤 뷰에서 비슷하면서 자신이 원하는 아이템의 목록을 봄.
2)사용자가 원하는 아이템을 스크롤 뷰에서 찾으면 그 이미지를 커서에 올리고 누름
3)UI에서 보여줬던 아이템의 정보가 사용자가 선택한 아이템으로 변함.

4. 장바구니
사용자가 아이템을 드래그하여, 장바구니에 집어넣으면 자신이 선택한 아이템 정보를 저장할 수 있으며, VR 프로그램을 나갔다 들어와도 그 정보를 불러와서 편리하게 사용할 수 있다.

4.1 기본 흐름
1) 사용자가 원하는 아이템임을 결정하고, 아이템 결정 버튼을 클릭.
2) 정보보기 UI가 사라지고, 사용자 눈 앞에 3D Mesh만 남음.
3) 3D Mesh를 드래그하여 카트에 담는다.
4) 카트안에 아이템이 들어오면, 해당하는 아이템의 정보를 저장하며, 3D Mesh는 삭제된다.

4.2 대안 흐름 : 카트안의 아이템을 없애고 싶을 때
1) 카트 안에 있는 아이템을 선택
2) 그 아이템을 드래그 한 후, 카트가 아닌 바닥에 해당 아이템을 떨군다.
3) 카트는 아이템의 갯수가 줄어들면, 사용자가 뺀 아이템을 장바구니에서 제거한다.
4) 떨어트린 아이템은 몇 초가 지나면 사라진다.

상세설계 내용

• 월드

구분	클래스	종류	설명
사용자	User	GameObject	사용자
사용자	Camera	Camera	VR 공간을 보여주는 카메라 Object
물품 정보	ProductGenerateManager	GameObject	원하는 아이템을 검색하고, 검색한 내용을 바탕으로 아이템을 VR 공간에 생성시켜주는 역할을 하는 Object
물품 정보	ShoppingManager	GameObject	장바구니 내용을 저장하고, 불러오는 기능을 해주는 Manager
물품 정보	ProductItem	GameObject	사용자가 검색한 내용으로 생성된 아이템 Object로, 물품의 이름, 카테고리, 이미지, 구입 URL 정보 등을 담고 있다.
기타	Cart	GameObject	장바구니 역할을 하는 Object로 Cart안에 물품을 집어넣으면 장바구니에 자동으로 저장된다.
기타	DisplayStand	GameObject	물품을 진열해놓을 진열대.
기타	Area	GameObject	바닥 및 벽.

• UI

구분	클래스	종류	설명
이름	NameCanvas	Canvas	물품의 이름을 표시하는 UI를 위한 Canvas
이름	ProductName	Text	물품의 이름을 출력해주는 Text
스크롤 뷰	ScrollViewCanvas	Canvas	ScrollView UI를 위한 Canvas
스크롤 뷰	ScrollView	ScrollView	ScrollView UI
스크롤 뷰	Content	Content	ScrollView 안의 아이템을 저장하고 출력하기 위한 Object
스크롤 뷰	ItemImage	Image	ScrollView 안에 보이는 이미지, 선택시 UI에서 표시되는 아이템의 정보가 바뀐다.
이미지	ImageCanvas	Canvas	Image를 출력하기 위한 Canvas
이미지	Image	Image	아이템 정보중 Image URL을 통해 이미지를 출력해주는 Object
기타	SelectBtn	Button	아이템 선택을 결정했음을 알리기 위한 버튼
기타	BuyBtn	Button	물품을 구입하기 위해 URL을 통해 직접 웹페이지에 접근하기 위한 버튼
기타	ProductMesh	GameObject	아이템의 모습을 3D로 보여주는 Mesh.
기타	EventSystem	EventSystem	UI 기능 동작을 위해 생성되는 EventSystem
기타	SelectItemCanvas	Canvas	아이템을 선택하였을 때, 아이템의 정보를 대략적으로 보여주기 위한 UI

• Script

구분	클래스	종류	설명
	API_XML	Script	API로부터 XML 정보를 가져와 정보를 추출하는 기능을 가진 Script
	ItemSelect	Script	아이템을 선택하는 기능을 가진 Script
	CustomerAnalysis	Script	사용자가 선택하거나, 장바구니의 넣은 정보 등을 토대로, 사용자에게 물품을 추천해주는 기능을 가진 Script
	ItemInsScript	Script	XML을 통해 아이템 객체에 데이터를 담을 Script
	XMLSaveLoad	Script	XML파일로 장바구니 내용을 저장하고, 프로그램이 다시 켜질때 그 내용을 다시 불러오는 기능을 가진 Script

결과 및 평가

완료 작품의 소개

프로토타입 사진 혹은 작동 장면

※VR환경을 염두하여 개발을 진행하였는데, 대여한 VR기기의 컨트롤러가 없어
UI와의 상호작용이 불가능하여, 구현한 기능들이 작동하지 않는 관계로
컴퓨터 키보드 마우스 환경에서 시연을 진행함.

관련사업비 내역서

지출이 없으므로 내역서를 제공하지 않음.

완료작품의 평가

평가항목	적용기준	개발 목표치	비중	평가결과
1. API 연동 가능성	API의 데이터를 잘 불러오는가?	99%	30%	A
2. 월드 구현	쇼핑을 할 수 있는 적절한 월드를 구현하였는가?	100%	20%	A
3. 모션 퀄리티	VR 기기로 자연스러운 움직임을 구현하였는가?	50%	5%	C
4. 장바구니 시스템 / 저장	골랐던 아이템을 장바구니에 넣고, 그 정보를 저장/ 불러오기가 가능한가?	90%	30%	A
5. 사용자 분석	사용자에게 물품을 적절하게 추천 할 수 있는가?	70%	15%	B

향후계획

향후 VR기기 컨트롤러를 사용할 수 있게 된다면, 그 컨트롤러와 연동을 통해서 모션 퀄리티 및 상호작용을 더욱 발전 시킬 수 있다고 봄.

참고 문서

이 프로젝트 전체 코드 : https://github.com/kym0761/TEST