SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using...

47
SMART FURNITURE CATALOGUE USING AUGMENTED REALITY NOR HAZIMAH BINTI MOHD SAUFI BACHELOR OF INFORMATION TECHNOLOGY (MEDIA INFORMATICS) WITH HONOURS FACULTY OF INFORMATICS AND COMPUTING UNIVERSITI SULTAN ZAINAL ABIDIN 2018

Transcript of SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using...

Page 1: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

SMART FURNITURE CATALOGUE

USING AUGMENTED REALITY

NOR HAZIMAH BINTI MOHD SAUFI

BACHELOR OF INFORMATION TECHNOLOGY

(MEDIA INFORMATICS) WITH HONOURS

FACULTY OF INFORMATICS AND COMPUTING

UNIVERSITI SULTAN ZAINAL ABIDIN

2018

Page 2: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

ii  

DECLARATION  

The dissertation is submitted as a partial fulfillment for the award of Bachelor of

Information Technology (Media Informatics) with Honours at the University of Sultan

Zainal Abidin (UniSZA). This work is the result of my researches. All sections of text and

results which have been obtained from other work/sources are fully referenced. I

understand that plagiarism constitute a breach of University regulations and will be dealt

with accordingly.

……………………………………

Name : Nor Hazimah binti Mohd Saufi

Date : ……………………………………

Page 3: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

iii  

CONFIRMATION  

 

This project report title Smart Catalogue using Augmented Reality by Nor Hazimah binti

Mohd Saufi, matric number BTDL16044473 has been seen satisfactory in term of scope,

quality, and presentation as a partial fulfillment of requirement for Bachelor of Information

Technology (Media Informatics) with Honours in University of Sultan Zainal Abidin,

……………………………………

Supervisor’s Name : En Mat Atar bin Mat Amin

Date : ……………………………………

  

 

 

Page 4: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

iv  

DEDICATION  

 

Firstly, I would like to take this opportunity to express my deepest thanks to my supervisor,

En Mat Atar bin Mat Amin for his kindness, patience, and motivation towards this project.

Not forgetting, Faculty of Informatics and Computing, thank you for giving me

chances to discover and reveal new things by myself for this project. Besides, I would like

to thanks to my family, especially to En Mohd Saufi bin Mohd Nawawi dan Pn Siti

Maslinda binti Mohamad Darus and all other lecturers in Faculty of Informatics and

Computing for support, helping and give me the motivation to complete this project. Last

but not lease, a huge gratitude to my supportive friends who always help, encourage and

tech me with unlimited new knowledge.

Page 5: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

v  

ABSTRACT

An augmented reality (AR) is an application. It is combination of image and reality

appearance. Nowadays, an augmented reality is accessible for smartphone cameras, tablet

and webcam laptop. AR can be applied to marketing world by transforming the strategy

from on the paper into reality world. It can make an exclusive branded and also increase

the brand by following the changing revolution. The problem statement is people are not

interested for reading either book, magazine or catalogue. We proposed the development

for furniture catalog because people more spend more time to their device. However, we

still need the source from a book, but we can reduce it into a piece of paper but full with

information and interesting output. We can combine it as an innovative approach to printed

book by adding various sensorial interaction. The objective for this project is to raising the

brands to become more exclusive and following revolutionary changes. This application

will be awakened by using a several software that is Unity, Android Studio, Autodesk

Maya, java, and the database by using Vuforia Developer. As a conclusion, this application

for public generally do not know to imagine the physical of furniture characteristic of

engine, color that matches their demands. It also suggests to people that do not have

knowledge about the latest in technology.

Page 6: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

vi  

ABSTRAK  

“Augmented Reality” (AR) adalah satu aplikasi. Ia adalah gabungan rupa imej dan

realiti. Kini, realiti diperkukuhkan boleh diakses untuk kamera telefon pintar, tablet dan

komputer riba webcam. AR boleh digunakan untuk memasarkan dunia dengan mengubah

strategi daripada kertas menjadi dunia realiti. Ia boleh membuat jenama eksklusif dan juga

meningkatkan jenama dengan mengikuti perubahan revolusi. Kenyataan masalah adalah

orang tidak berminat untuk membaca sama ada buku, majalah atau katalog. Kami

mencadangkan pembangunan untuk katalog perabot kerana orang lebih banyak

menghabiskan lebih banyak masa untuk gajet mereka. Walau bagaimanapun, kita masih

memerlukan sumber dari buku, tetapi kita dapat mengurangkannya ke dalam sekeping

kertas tetapi penuh dengan maklumat dan output yang menarik. Kami boleh

menggabungkannya sebagai pendekatan inovatif ke buku bercetak dengan menambah

pelbagai interaksi sensorial. Objektif projek ini adalah untuk meningkatkan jenama untuk

menjadi lebih eksklusif dan mengikuti perubahan revolusioner. Aplikasi ini akan

dibangkitkan dengan menggunakan beberapa perisian iaitu Unity, Studio Android,

Autodesk Maya, Visual Studio, dan pangkalan data dengan menggunakan Vuforia. Sebagai

kesimpulan, permohonan ini untuk orang ramai umumnya tidak tahu membayangkan

fizikal ciri-ciri perabot.

 

Page 7: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

vii  

CONTENTS  

 

 

DECLARATION ............................................................................................................................. ii 

CONFIRMATION ......................................................................................................................... iii 

DEDICATION ................................................................................................................................ iv 

ABSTRACT ..................................................................................................................................... v 

ABSTRAK ...................................................................................................................................... vi 

CONTENTS ................................................................................................................................... vii 

LIST OF TABLES ......................................................................................................................... ix 

LIST OF FIGURES ........................................................................................................................ x 

LIST OF ABBREVIATIONS/ TERMS ....................................................................................... xi 

 

CHAPTER 1 (INTRODUCTION)  .............................................................................................. 1 

1.1  Project Background .......................................................................................................... 1 

1.2  Problem Statement ........................................................................................................... 2 

1.3  Objective .......................................................................................................................... 2 

1.4  Scope ................................................................................................................................ 3 

1.5  Limitation of Work .......................................................................................................... 4 

1.6  Report Structure ............................................................................................................... 4 

1.7  Chapter Summary ............................................................................................................ 4 

 

 

Page 8: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

viii  

CHAPTER 2 (LITERATURE REVIEW) ................................................................................... 5 

2.1  Introduction ...................................................................................................................... 5 

2.2  Smart Catalogue ............................................................................................................... 5 

2.3  Comparison to the Previous Application ......................................................................... 6 

2.4   Comparison between Existing Project (Journal) ............................................................ 12 

2.5  Comparison between existing Website ......................................................................... 15 

2.6  Development in Unity ................................................................................................... 17 

2.7  Novelty .......................................................................................................................... 17 

2.8  Chapter Summary ......................................................................................................... 18 

 

CHAPTER 3 (METHODOLOGY) ............................................................................................ 19 

3.1  Introduction ................................................................................................................... 19 

3.2  Methodology Review ..................................................................................................... 20 

3.3   Methodology for Augmented Reality ............................................................................ 21 

3.3.1 Phase 1: Preproduction .................................................................................................. 21 

3.3.2 Phase 2: Production ....................................................................................................... 24 

3.3.3 Phase 3: Post- Production ............................................................................................. 31 

3.4   Project Requirement ....................................................................................................... 32 

3.5  Framework ..................................................................................................................... 33 

3.5  Summary ........................................................................................................................ 34 

 

REFERENCE ............................................................................................................................... 35 

APPENDIX ................................................................................................................................... 36 

 

Page 9: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

ix  

LIST OF TABLES  

Table 1 Comparisons between the applications ................................................................. 11

Table 2 Comparisons between Journal .............................................................................. 14

Table 3 Comparisons between websites ............................................................................ 16

Table 4 Layout Design ....................................................................................................... 26

Page 10: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

x  

LIST OF FIGURES  

 

Figure 1 Interface of Houzz’s application............................................................................ 6

Figure 2 Interface of DecorMatters’s Application ............................................................... 7

Figure 3 Figure of N’s application ....................................................................................... 8

Figure 4 Example 1 of IKEA Catalogue 2013 ..................................................................... 9

Figure 5 Example 2 of IKEA Catalogue 2013 ................................................................... 10

Figure 6 Example of ru ma’s website ................................................................................ 15

Figure 7 Example of kitchenz’s website ............................................................................ 16

Figure 8 Production Pipeline using Unity .......................................................................... 20

Figure 9 Process of Modelling ........................................................................................... 27

Figure 10 Process of Texturing .......................................................................................... 28

Figure 11 Graphic of Unity Development ......................................................................... 30

Page 11: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

xi  

LIST OF ABBREVIATIONS/ TERMS  

 

AR Augmented Reality

VR Virtual Reality

Page 12: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

1  

CHAPTER 1

INTRODUCTION 

1.1 Project Background  

 

To prepare for future innovations is a hard process for most firms that

included several factors. Innovations are novelties that require a cognitive effort to

be noticed. The process also includes assessing how a new innovation could affect

one firm and often times there are multiple choices and scenarios. This application

is currently new in the industrial revolution 4.0. This project is using 3D modeling

technique. Marker based augmented reality are used as the method in this project.

The idea is that consumers can easily and cheaply film or photograph their homes

and use the pictures to imagine the real furniture on sale. The fact that the use of

smartphones and tablets has exploded the last couple of years is crucial and makes

AR more practical as a potential shopping tool. In the same time, the branded of

the company rapidly increase over the world because of the power spreading of

technology used.

Page 13: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

2  

1.2 Problem Statement  

A radical new innovation gets introduced, the old ways of working gets washed out.

When consumers switch products or services based on new technology. A wave of

destruction occurs, but this essential destruction is a fundamental fact that drives society.

There is a unique situation for the furniture industry.

The problem with the furniture industry is that this trend lags behind other products

like books, electronics and clothes (E-Barometer, 2014). Looking at pictures of products

online and getting product information wasn’t enough to convince customers to purchase.

This is still the fact in the furniture industry were people still have the need to feel the

product prior to purchase. It is a technology that enables the digital world to meet the

physical world and further improve customer interaction within a totally new domain.

The idea of being able to make such a decision online with the help of AR would

indeed change the whole structure of the industry, if adopted by the costumers, and open

up opportunities to new entrants that don’t have physical malls.

1.3 Objective  

There are three main objectives of this proposal. Three objectives are derived to

overcome problems that stated before. The objectives are:

a) To design application to enhance the growing recognition of brands as well as

technology advanced furniture, the medium of their promotion also tackles

revolutionary change.

b) To implement the application for the seller during their promotion.

c) To develop applications for customers using interactive approach.

Page 14: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

3  

1.4 Scope  

This application will use by the only one main actor which is the main admin of

this system and the customers as the user.

a) Application

Display an item model.

Running the application and pointing the camera to AR-marker the user can

see 3D model of a piece of furniture.

Rotating the model.

By flicking gestures, the user can rotate the model by 90 degrees.

More details of the model.

Placing the phone closer to the marker, the user will see detail information

of the item such as price.

Placing several markers together.

The user can model the whole interior

Get more info of the furniture

The user can only refer to the info without using AR camera.

b) User

This application will use by the only one main actor which is the customers

as a user.

c) Software/Application

Unity, Autodesk Maya, Java Application, Vuforia Developer, Android

Studio.

 

Page 15: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

4  

1.5 Limitation of Work  

The limitation of this application is all the contacted companies are located in

Sweden and Scandinavia. With the exception of IKEA which is global, this study is limited

by the fact that it can’t necessarily give a global answer on how different furniture firms

work with new and emerging innovations. There are limitations to marker-less SDKs,

namely that they don’t work on some iPhone.

1.6 Report Structure  

The reminder of this thesis is organized as follow. In chapter one, we discuss the

project’s background, problem statement, project objectives, and project’s scope. Chapter

two discusses literature review which refers to previous reaches and articles. Chapter

three and four details of this project methodology and application design respectively.

1.7 Chapter Summary  

This chapter discussed about the project’s background, problem statement, project’s

objective, and project’s scope.

Page 16: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

5  

CHAPTER 2

LITERATURE REVIEW

2.1 Introduction

This chapter provided some reviews of technique which have been proposed by

many researches in previously. The furniture catalogue also have reviewed to ensure the

quality in order to improve this project.

2.2 Smart Catalogue

This application discusses the idea from previous project and applications, there is

part of research when in the particular topic is placed. This literature reviews easier to

understand general description of exist application and system and also the method by using

augmenter reality (AR). In order, to make the literature review easier to student understand,

the information is preset in the table.

Page 17: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

6  

Other includes a brief preview of the topic discussed, the research that has been

done by existing application and making comparison between existing augmented reality

application. The ideas from the previous resource or available resource help to meet the

objectives of this application. There have several references that can make it as innovation

from the product.

2.3 Comparison to the Previous Application

2.3.1 Houzz’s application

Figure 1 Interface of Houzz’s application

 

Houzz is great for design inspirations. It has 5 million home images. Their interior

designers told me that they use Houzz a lot as a tool to figure out what their clients want.

Page 18: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

7  

Beside their giant pool of nice images, Houzz used building 3D models for its product on

its marketplace where user can see products in their room before buying them on Houzz.

2.3.2 DecorMatters’s Application

Figure 2 Interface of DecorMatters’s Application

Figure 2 above shows ‘DecorMatters’ has a new startup focusing on interior design

and decorating. The app enables user to design on a template or a real room background.

Users have more freedom of choosing furniture from their familiar brands or stores to try.

Moreover, they have inspirations where user can purchase all furniture and decorations

directly from the design. It’s really shopping the look. They recently have the AR Ruler

feature where users can measure their space to see whether the furniture is going to fit into

their space or not.

Page 19: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

8  

. 2.3.3 N’s application

Figure 3 Figure of N’s application

Figure 3 above it’s more like a community or a game where users can comment or

vote on other designs or take some challenges as a game. It’s fun to interact with other

designers in the community.

However, these three applications are not user marked-based method which is they

use marker-less. That is different because smart furniture catalogue is maintain to use

catalogue as their main objective. Last but not least, these applications are useful and can

be as reference for smart furniture catalogue.

Page 20: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

9  

2.3.4 IKEA application

Based on the research, development of AR furniture applications are many examples. The

other development is IKEA catalogue. IKEA has an interactive approach but the application

does not give any information for user. This catalogue cannot change the color of the

product and arrange the furniture as interaction. Smart catalogue will develop similar as

this catalogue with innovation combination from the other two websites and these two

examples of AR furniture application development.

The figure below shows another development of the existing AR furniture catalogue from

IKEA for the visualization of the furniture;

Figure 4 Example 1 of IKEA Catalogue 2013

Page 21: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

10  

Figure 5 Example 2 of IKEA Catalogue 2013 In the nut shell, the references are really help for the new idea and innovation. The

development will archive the objective of the product. As we all know, AR applications

become well-known in the market of design field, the systems not just used by the expert

users but also non-expert users. Hence, this AR application should be easily to use and

easily setup. If the users do not know how to start use the application, they will not use the

application no matter how good the application. This is why Smart Furniture Catalogue and

maintain to use catalogue. To make sure the seller can show them with given some

explanation to the customers.

Page 22: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

11  

2.3.5 Comparison between these applications

Application Technique Advantage Disadvantage

Houzz Marker-less 3D models for

some products.

Not so great user

experience.

DecorMatter Marker-less Easy for mood

board as well as

scratch design

Do not have 3D

models, sometimes

you have to and the

right angle of the

furniture.

N Marker-less Have lighting and

shading tools.

Don’t have 3D

models, limited

furniture choice.

IKEA Marker-based The product can

change.

Certain page only

display the certain

product.

Table 1 Comparisons between the applications

Page 23: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

12  

2.4 Comparison between Existing Project (Journal)

There have a few existing researches that included the suggestion application. The

difference between the website and application are using the several techniques. AR

development can be described as “interaction and visualization make the model in reality”

rather than the only images or info graphic posted in the website. AR version of reality is

direct views of physical real-world environment are augmented with superimposed

computer-generated images over a user of the real-world.

Table 2.4.1 Differences between five (5) Journals

Author/Year Project Title Overview Technique Strength

Daniel Platisa,

Saman

Heidari,

(2014)

Furniture

Retailing in the

Times of

Augmented

Reality

Embraced by

customers as a

shopping tool.

Marker-based Discovered a

lack of

knowledge in

the speed of

quality

improvements

of AR which is

due to the high

development

speed in the IT-

sector.

Page 24: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

13  

Snehal

Mangal, Nabil

Phansopkar,

Safwaan

Mujawar,

Neeraj Singh,

(2016)

Virtual

Furniture

Using

Augmented

Reality

Can see the

objects in

physical world

virtually

Marker-less User can attempt

multiple

combination of

furniture object

virtually without

physically

moving the

furniture items.

Khushal

Khairnar,

Kamleshwar

Khairnar,

Sanketkumar

Mane, Rahul

Chaudhari

(2015)

Furniture

Layout

Application

Based on

Marker

Detection and

Using

Augmented

Reality

Customer can

view the

furniture object

virtually in real

environment

before buying

object.

Marker-based Help buyer to

determine how

to setup

furniture in

home structure.

Ananda

Poudel, Omar

Al-Azzam

(2016)

Interior Design

with

Augmented

Reality

AR will play a

vital role in the

furniture.

Marker-Less Allows user to

use select, place,

remove and

modify 3D

models in an

interactive way

Page 25: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

14  

Tan Poh Yee

(2013)

Interior Design

using

Augmented

Reality

Design

modifications

and refinements

due to the

support for

viewing the

design.

Marker-Less People do not

need to go to the

shop for sample

to decorate

house and room.

Table 2 Comparisons between Journal

 

Few previous authors had proposed interior design application by using Augmented

Reality (AR) Phan & Phoo (2010). They are authors Koller, C. Wooward, A. Petrovski; K.

Hirokazu, et al. The related equipment such as data glases connected Head-mounted display

(HMD). ANevertheless, this equipment uncommonly used by user.

In an AR environment, user can play with the model furniture that display in real

time on the screen. It provided a platform that users can interact with the object on image

in real space. Hence, the research suggests a new way to apply AR technology in the interior

design work. With dynamic and flexible user interface, user can look at the virtual object

and correspond with the 3D object.

In the future, it believed that many developers will seek augmented reality

interaction more deeply, providing interior design, Furniture Company and etc. More

function augmented reality design tool and let user interact with an object with simple and

easy to use tracked physical tools.

Page 26: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

15  

2.5 Comparison between existing Website

There have a lot of website that are easier for user to search and choose their dream car that

can be found on the internet. More often than not, they are only show the type of the

furniture without visual and reality image. Sometime, they do not show the type of colour

that was suggested for that product. Furthermore, at the website that shown below more

gave advertisement than the information of furniture. Smart furniture catalogue will have

a simple interface but have an interactive and complete of information. User also can

arrange the place of product in one space.

Figure 6 Example of ru ma’s website

Page 27: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

16  

Figure 7 Example of kitchenz’s website

Figure 7 above shows all content that are develop by kitchenz’s company for their

website. They are provided the suggestion for any type of room and kitchen from their

price. When the suggestion displays, they have to click the price to get more detail and

information of that products. Smart catalogue provided but the outputs are show the type

of colour suggestion and interactive of product.

Comparisons between two websites

Website Method Advantage Disadvantage

Ruma Online website Many large pictures Need an internet to search the product.

Kitchenz Online website Give more detail

Table 3 Comparisons between websites

 

Page 28: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

17  

2.6 Development in Unity

Unity Technologies is the creator of a flexible and high-performance end-to-end

development platform used to create rich interactive 2D, 3D, VR and AR experiences.

Unity's powerful graphics engine and full-featured editor serve as the foundation to develop

beautiful games or apps, and easily bring them to multiple platforms: mobile devices, home

entertainment systems, personal computers, and embedded systems.

Unity also offers solutions and services for creating games, boosting productivity,

and connecting with audiences including the Unity Asset Store, Unity Cloud Build, Unity

Analytics, Unity Ads, and Unity Certification. Unity Technologies serves over 5.5 million

registered developers including large publishers, indie studios, students and hobbyists

around the globe. The support website for using the unity is Vuforia Developer as the

platform and official partners to create the license key and database for the object and image

target. The animation will create by using programming code in Java SDK.

2.7 Novelty

Smart Catalogue is built with Unity software using Vuforia Developer as the device

database. This can provide visualizations information using multimedia elements. Besides

that, it is alternative approach in expose the imagination of furniture. Using AR element

are interactive and dynamic content. On the other hand, the application is display animated

models of furniture to attract user. The criteria that provide this application are easily to

understand by novice people that are do not know to imagine the condition in a room for

their furniture.

Page 29: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

18  

2.8 Chapter Summary

In this phase, it will deliver the information about the study on the past research and

the current website. This study is more to focus to do the development and suggestion to

user. With this study, a new application will be developed and benefit the all users.

Page 30: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

19  

CHAPTER 3

METHODOLOGY

3.1 Introduction

This chapter explained the detail of the methodology that is being used in the

development of application. The technique that has been selected is recognition marker-

based AR. Recognition based augmented reality relies on recognizing real world items such

bar codes, images, texts, etc. to provide information. The most common type of

Recognition Based AR App is a language translation app which uses camera to read the

text, translates it and overlays on top of an image. This chapter will explain more details

about every phase that involved in this project. The phase is pre-production, production and

post-production.

Page 31: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

20  

The process of creating 3D animation can be sequentially divided into three phases:

that is modeling which is describes the process of creating the 3D objects within a scene.

While layout and animation, which describes how objects are positioned and animated

within a scene. Lastly is rendering, which describes the final output of the completed

computer graphics. Through the combination of the above phases and a few other sub-

phases, this completes the process of a 3D animation production.

3.2 Methodology Review  

A pipeline is a series of product, either in a state of development, preparation, or

production, and ideally in different stages of their life cycle. At any in a target, the goal is

to have some products in the growth stage, which is the key stage for establishing a

product’s position in a market, increasing sales.

Pre-Production Production Post-Production

Figure 8 Production Pipeline using Unity

Script and Storyboard

Device/Cloud Database

Modeling &

Animation

Audio

Final Output

Page 32: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

21  

3.3 Methodology for Augmented Reality  

3.3.1 Phase 1: Preproduction  

1) Idea

The main idea of augmented reality is to present physical object in a real

environment as if they were part of it. The camera pose is used to render

the 3D object. The camera of computer graphic is moved to same pose

as the real camera and 3D object are rendered on top of the real image

in catalog. If the different type of users use the same application, it might

be good idea to think about the possibility to have several different user

interface. From the research, AR interior design application with

necessary amounts of features, whereas, consumers would prefer a

simple user interface with less features.

2) Implementation design

A Place Marker 

at the 

 

1) Capture the 

catalogue 

2) View and 

touch the object 

3) Superimpose 

3D object 

4) Change the 

color and 

explore theCapture the 

marker which 

are selected 

Page 33: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

22  

The above project design explains the working of the project. The user which has

the application and the marker is intended to use facilities like selecting the intended

product they want to explore and capturing the image from the marker. The main focus is

to allow the user to view the product in the home environment allowing them to make

purchase decisions regarding the furniture product.

3) Storyboard

In this phase are using Adobe Photoshop to design the storyboard for the project. A

storyboard is a sequence of illustrations that showcase the digital story in two

dimensions. The first dimension is time: what happens first, next, and last. The

second is of interaction: how does the voiceover interact with the images, how do

visual transitions and effects help tie together the images? Any element can interact

with any other one, and the storyboard is the place to plan out the impact to intend

to make on the audience.

4) Flowchart

The flowchart below explains the actual flow of project. Firstly, the new user needs

to select which product he/she intends to explore & accordingly select the product

from the main page. After selecting the furniture by the user and interface will

change which will access their camera. The marker should be placed after the

camera has been opened on the user device. After viewing they can view the other

model by slide the catalog to others page.

Page 34: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

23  

3.3.1.1 Flowchart during detection

Page 35: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

24  

3.3.2 Phase 2: Production  

1) Research and Development

In this phase, the research has been made for implement for trial. Such

technologies are currently in need of further development and research in order to

reach the availability and utilization level of visual-based applications and devices,

but certainly have the potential in the field domain. The Introduction section of the

abstract the AR technology in general, clarifies the distinction between the

augmented reality (AR) and virtual reality (VR), and gives an overview of related

work. The Augmented Reality in Smart Furniture Catalogue provides a

comprehensive literature overview of research, technology and application

developments in the context of utilizing the augmented technology in furniture

domain.

2) Layout

Layout are drawn from storyboard which define the movement and perspective

in the scene. Because storyboard artists draw background in a rough, simplified

style and background layout are transform the storyboard to the next level. Layout

drawings are then given to the background painters to color and complete the visual

style.

Page 36: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

25  

Front page

for the

application

which is

button exit,

and AR

camera.

AR camera

viewed

before scan

the marker

(picture)

Front Page AR View

This is the

how the

image will

display with

3D

animation.

Customer

need to

zoom the 3D

object to

know the

price.

Display Object Zoom View

   

Page 37: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

26  

Customer can

rotate the

object to look

360 of the

objects.

Customer

allow to

arrange by

their self to

see the

suitable

place than in

the

catalogue.

Rotation Object Arrange object

User can

click an icon

for more

information

User can

choice the

button to

exit from the

application.

Info Page Exit Page

Table 4 Layout Design

Page 38: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

27  

3) Modeling

This section are primitives which is can be anything from a single point (called

a vertex), a two-dimensional line (an edge), a curve (a spline), to three-dimensional

objects (faces or polygons). Using the specific features of chosen 3D software, each

one of these primitives can be manipulated to produce an object. Three-dimensional

(3D) models represent a product using a 3D space. The software used is Autodesk

Maya.

Figure 9 Process of Modelling 4) Texturing

This process is similar to adding decorative paper to a white box. In 3D, texture

mapping is the process of adding graphics to a polygon object. These graphics can

be anything from photographs to original designs. After a 3D model is created, 2D

image will be overlaid on it to add colors, design, and textures. This is called

mapping, and often the entirety of a model’s color comes from this. These maps can

be created in programs like Photoshop, and the illusions of textures can be brushed

onto the models.

Page 39: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

28  

Figure 10 Process of Texturing

5) Rigging

Rigging refers to the process of creating the bone structure of a 3D model. It is

a process to set up a controllable skeleton for the furniture that is intended for

animation. This skeleton structure is used to manipulate the 3D model like a puppet

for animation. So that, this furniture can be done with interactive product.

6) Animation

Animation is the process of taking 3D object and getting it to move. There is

key-frame where the animator manipulates the objects on a frame-by-frame basis.

Creating moving furniture in a digital environment that is three-dimensional.

Through the careful manipulation of objects (3D models) within the 3D software,

we can then export picture sequences which will give the illusion of movement

(animation) based on how we manipulate the objects. Other methods of animation

include placing objects on spline and setting them to follow the path the curve.

Page 40: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

29  

7) Rendering

Autodesk Maya is software fully used for modeling the 3D object. It is the main

software consists the modeling and animation needed. After rig the model and make

animation, last process for 3D production is rendering and the model will transfer

to Unity Software for the next production. Lastly, the model will import to Unity

Softaware.

8) Database

This phase involving the element of database which is admin need to upload the

marker into Vuforia Developer to the get the license number and upload the marker

in the unity software. During project modeling, the more difficulty of the picture,

the higher availability to make it as marker.

Vuforia 

Cloud 

Augmented reality  

Button interface 

Construction Fuzzy 

Cognitive Maps 

Construction 

Artificial Neural 

Network

Application

Data

Personalised Tutoring System 

Domain Knowledge Prediction Model 

Page 41: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

30  

9) C# Language

During this Visual Studio are defined to make an animation for the modeling

using JavaScript language. It has a hyperlink with Unity Software to bring an

interactive approach.

10) Unity

This phase is important to build the application that are combined from Vuforia

and Java SDE. The setting must decide for any type of android. The technique is

imported the modeling from Autodesk Maya and catch it in Unity to make it

physically appearance. After the development complete, admin need to build it with

Android Studio using apk file. User need to install the apk file in the android phone.

Figure 11 Graphic of Unity Development

Page 42: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

31  

3.3.3 Phase 3: Post- Production  

 

The last phase in this methodology is the actual realization of the augmented

reality using the chosen implementation environment. For example, added the

background audio to give more interesting output. After that, the testing process are

needed. After success to build in the device such as android, developer need to test

at several devices to make sure the application are flexible to used.

1) Built apk file

After compose all the application needed, next step is built the apk file

which is using software Android Studio to support all of android version

such as Lollipop, Kit Kat, etc.

2) Final output

After the development around 5 months, the final output for this application

is display the 3D model for the furniture catalogue. User can install the

application using apk file and application can play using the selected

marker.

Page 43: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

32  

3.4 Project Requirement  

Project requirement includes two parts which are software requirement and

hardware requirement. The requirement the project to ensure the completion process well

and every aspects requirement need to be used for chapter implementation and analyze to

make sure the correct of the application.

3.4.1 Software Requirement

List of software needed:

No. Software Purpose

1. Adobe Photoshop Used to design the storyboard

2. Microsoft Word 2016 Used to do the documentation of application.

3. Android Studio Used to code the core program of the project.

4. Java SDE Programming Language C#

5. Autodesk Maya Modelling the 3D product

6. Unity Animate the modelling and connect to the device.

7. Vuforia Developer Database for the application

Page 44: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

33  

3.4.2 Hardware Requirement

List of hardware needed:

No. Hardware Description

1. Laptop ASUS A555L

2. Processor Intel Core i7

3. Memory 4 GB RAM

4. Operating System Window 10

5. System type 64-bit Operating System

6. Mobile phone Samsung A5 2015

3.5 Framework    

User 

Camera 

Interaction 

Interaction

Image 

Image 

Marker ID

 

Pose 

Interface/View

Reaction 

Controller 

AR View AR View Camera 

View 

Tracking

Marker detection 

and Pose estimation 

Rendering (AR View)

Animation Texture 

Model ID 

Page 45: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

34  

 

Known as Software Development Kits (SDK), or simply frameworks, the tools used

for the development of AR applications provide a coding environment where users are

enabled to create the capabilities that will compose software applications with the

capabilities and resources of augmented reality. According to Amin & Govilkar (2015),

these augmented reality SDKs facilitate many components within the AR application, for

instance at three type which is: AR recognition, AR tracking and AR content rendering.

There are several tools currently in evidence for the execution of tasks that involve

the development of applications that use AR resources. Next, it was sought to present the

main features demanded from tools that offer these resources. In this next section, it will

be present the methodological procedures adopted for the execution of tests and the further

steps taken for the fulfillment of this research.

3.5 Summary  

This chapter discuss on methodology for the system development required to complete the

Smart Furniture Catalogue. Each oh phase development will follow the steps in Pipeline

discussed earlier in this chapter.

Page 46: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

35  

REFERENCE  

Brandão, J., Cunha, P., Vasconcelos, J., Carvalho, V., & Soares, F. (2015). An augmented

reality gamebook for children with autism spectrum disorders. . In The

International Conference on E-Learning in the Workplace 2015, 1-6.

Herpich, F., Guarese, R. L. M., & Tarouco, L. M. R. (2017). A comparative analysis of

augmented reality frameworks aimed at the development of educational

applications. . Creative Education, 8(09), 1433.

Kalkan, K. (2015). The Development of e-commerce in Sweden and its effect on Swedish

business : A qualitive study.

Khainar, k., Mane, S., & Chaudari, R. (2015). Furniture Layout Application Based on

Marker Detection and Using Augmented Reality. International Research Journal

of Engineering and Technology, 2(7), 540-544.

Kucharska, B., Kucia, M., Maciejewski,. G., Malionowska, M., & Stolecka-Makowska.,

A. (2015). The retail trade in Europe-diagnosis and future perspectives. Scientific

Publications/University of Economics in Katowice.

Phan, V. T., & Choo, S. Y. (2010). Interior design in augmented reality environment. .

International Journal of Computer Applications, 5(5).

Van Krevelen, D. W. F., & Poelman, R. (2010). A survey of augmented reality

technologies, applications and limitations. International journal of virtual reality,

, 9(2), 1.

 

Page 47: SMART FURNITURE CATALOGUE USING AUGMENTED REALITY · 2018-12-23 · smart furniture catalogue using augmented reality nor hazimah binti mohd saufi bachelor of information technology

36  

APPENDIX  

NO

PH

AS

E

ACTIVITIES WEEK

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

1 PR

EP

RO

DU

CT

ION

Topic Configuration & Discussion with Supervisors

2 Project Title Proposal

3 Submission of Proposal

4

PR

OD

UC

TIO

N

Preparation of Chapter 1

5 Preparation of Chapter 2

6 Proposal Progress Presentation & Evaluation

7 Discussion & Correction Proposal

8 Proposal Solution Methodology (Chapter 3)

9 Develop Prototype

10 Drafting Report of The Proposal

11

PO

ST

P

RO

DU

CT

ION

Submit Draft of Report to Supervisor

12 Seminar Presentation & Final Presentation

13 Correction Reports