Interactive Design process

8/7/2019 Interactive Design process

1/17

1

MOL-9706 Product Development and

Innovations

Interactive Design Process

Submitted To: Prepared By:

Heikki R. Mattila Ammar Saif (224212)

Kirill Yakobenko (226440)
https://pop-portal.tut.fi/portal/page/portal/POP-portaali/20Opinnot/23Opinto-opas?action=implementationInfo&implementationId=31340https://pop-portal.tut.fi/portal/page/portal/POP-portaali/20Opinnot/23Opinto-opas?action=implementationInfo&implementationId=31340https://pop-portal.tut.fi/portal/page/portal/POP-portaali/20Opinnot/23Opinto-opas?action=implementationInfo&implementationId=31340https://pop-portal.tut.fi/portal/page/portal/POP-portaali/20Opinnot/23Opinto-opas?action=implementationInfo&implementationId=31340


2/17

2

Contents

1. Introduction....

...3

2. Computer Aimed Model Design.

..3

2.2 Relationship between designing process and the model data......4

2.3 Recursive description of hierarchical pictorial data....5

3.Interactive Design Process.....6

3.1. Interactive Design of Patterns7

3.2. The Mechanical Model...7

3.3 Collision Detection...8

3.4. Simulation of Dynamic Meshes.8

3.4.1. Altering the Shape of Garment Patterns...9

3.4.2 Techniques for Fitting Garments on a Body..9

3.5. Real-Time Animation of Garments.11

3.5.2. Garment Animation...12

3.6. The Virtual Try-On..13

4.Interactive Fashion Garments...15

5.Conclusion.

..16

6.References.

...17


3/17

3

1. Introduction:

Fashion designing is a combination of art, industry and commerce. A fashion designer

is so delicate and so fastidious that he will never employ computer graphics unless he

can easily produce outlines, colors and textures. [2]

The challenges of virtual garment simulation are numerous and a lot of research has

been done in recent years. In beginning these efforts were dedicated to the realistic

simulation of the mechanical behavior of cloth, later the attention was moved towards

simulation of virtual garments on synthetic characters. As computer graphics are used

for garment simulation on animated virtual characters, virtual prototyping of garment

models is a major application field for the garment industry. Virtual garment

simulation is the product of a large arrangement of techniques that have evolved

during the last a few years. A lot of new challenges have been arisen from the highly

versatile nature of cloth and limitation of simulation on mechanical characters. The

central pillar of garment simulation obviously remains the development of efficientmechanical simulation models, which can accurately reproduce with the specific

mechanical properties of cloth. However, cloth is by nature highly distorted and due to

these fact specific simulation problems arises. [2]

Now cloth simulation has matured enough to introduce its potentials to the garment

industry. The main needs to be fulfilled are mostly related to virtual garment

prototyping, as well as visualization applications related to and virtual fashion and

prototyping. Besides the higher level of accuracy needed to simulate the complex

features of fashion models, new cloth design systems are now intended to help the

garment creator shorten the design process of a garment, using innovative techniques

and tools. [2]

2. Computer Aimed Model Design:

Process of fashion designing is summarized in below Chart in Fig. I. In this fashion

designing process, the model designed shows most artistic and visual part of all

processes, and indicates problems for color graphics. [1]


4/17

4

[1]

At first stage the designers selects and alter body outlines and then puts clothes on thebody. The best fit and modify clothes are chosen from the collection in the data base

or new clothes are drawn. Then colors and textures are selected (material types,

weaves, etc.) and adds these to the model. From this one standard design it is tried to

produce patterns and real clothes for many different body shapes and sizes. [1]

2.1 Relationship between designing process and the model data

It can be observed in processes of (1-3) of Fig. 2, a designer requires outline data

which to be recovered and displayed simultaneously from the data base. Other

problem is that of embedding textures regions together with this by the outlines. Thisembedding has to be repeated at certain levels to avoid further problems. [1]


5/17

5

[1]

2.2 Recursive description of hierarchical pictorial data

Generally 'picture' actually consists of so called 'sub-pictures'. For example, a picture

of a 'butterfly' consists of sub-pictures of 'wings', a 'body', and 'antennae' as is shown

in Fig. 3. Therefore, a picture is defined by any number of sub-pictures and their

relative positions. [1]

Fig. 3 Picture of Butterfly [3]

If we closely examine the picture, each part of butterfly has its own characteristic.

One of the characteristic is 'outline' which is defined by a set of parameters, an origin

point and line-generating rules. Another characteristic is 'texture' for the region

enclosed by the outline. The simplest texture is a single color. Particularly, the texture

is defined as pictures distributed by some placement rules on a background. The

background itself may be a single color or another texture. In this example, the

'butterfly wing' consists of 'wing outline' and 'wing texture', then 'wing texture'

consists of 'spots', their placement rules and a background texture, and etc. A 'picture'


6/17

6

has hierarchical structure both in picture, sub-pictures relation and picture-texture

relation. Now a picture and texture are given the same name, 'pattern'. [1]

The structure of a 'pattern' is a tree, which has variable width and variable depth. A

node in the tree is a cease node if the pattern corresponding to that node has no sub-

patterns and has only its outlines, a color and origin point as its own attributes.Practically there is a restriction that superposition order of sub-patterns must be

defined to complete pattern description. This is because a picture might cover and hide

another picture or a part of it. [1]

Finally these data structures have to be saved in secondary storage in a data base. A

flexible data structure that allows data to be processed in the core memory and stored

in the data base is required. [1]

3. Interact ive Design Process

Most of the garment industry is still involved to the traditional way of designing

garments, which is based on designing patterns (shapes of fabric) which are then

seamed together on a mannequin. Now CAD tools (Lectra, Gerber, Investronica) are

highly involved in the 2D design process of the patterns, beside the actual prototyping

is still performed using real cloth pieces and mannequins. In recent times some

attempts were made to do actual prototyping on computer as well by using cloth

simulation techniques. But this approach is still quite inefficient because of the lack of

integration between the 2D pattern design process and the 3D simulation. Relationship

between design and simulation is the key idea for solving this bottleneck. While

current systems require the re-assembly and draping of the garment over the body for

any design change on the garment patterns, a new approach offer a smart integration

of the 2D pattern shape editor along with the 3D garment shape view to assess

interactively the effect of any pattern shape edit or posture and measurement change

on the mannequin. [2]


7/17

7

Fig.4. User interface for interactive garment design (left): Edition of the patterns canbe performed any time in 2D or 3D with immediate preview of the results (right). [2]

3.1. Interactive Design of Patterns

Using patterns imported from industry CAD tools, the proposed framework obviously

addresses the issues of placing the patterns around a mannequin, seaming the patterns

together, and performing the draping using mechanical simulation. However, the main

interest of the framework is rather related to the possibility of refining and altering the

design of the patterns in real-time, with interactive preview of the effects on the

garment draped on the mannequin. These edit possibilities include resizing, reshaping,adding darts, holes, seams, pleats, attachments (zips, buttons), changing the fabric

material (mechanical properties and texture). The mannequin can be interactively

changed as well, both for measurements and for postures and motion sequences. [2]

Interactive design software provides high-quality garment simulation, not only by

simulating accurately the elastic behavior of deformable cloth through a model taking

into account elastic strain-stress curves, but also by providing accurate simulation of

the dissipative behavior of cloth for producing high-quality animations. The main

purpose of the real-time simulation is to provide to the designer a pre-view of the

garments on virtual humans. The demonstration of a simulation chain of a dressed

virtual human with the precise approach requires several minutes of computation.

While the real-time method makes the delivering of the same clothes almost

immediate. [2]

3.2. The Mechanical Model


8/17

8

Weft, warp and shear deformation speeds are precisely measured on each part and

translated into strain-stress forced curves defined by the mechanical properties. These

forces are then reproduced onto the mesh vertices, and any kind of combination

scheme traditionally used for particle systems. [2]

Another advantage of the model is that it does not rely on regular particle arrays, butsatisfies itself from any triangle mesh for describing the cloth surface. This allows

complete liberty in the design of the pattern shape, as well as finest surface

representations using adapted or dynamic local mesh refinements. [2]

If even more accuracy is required for representing cloth animation, the fifth-order

Runge-Kutta scheme with error evaluation for adaptive time step is accessible in the

system. With the highly increasing stiffness of the forces and the smallness of the

mesh elements, it ensures a guaranteed accuracy in both the position and the speed of

the cloth. So, we get a good choice for testing the effect of mechanical parameters on

the motion of the cloth. [2]

3.3 Collision Detection

The cloth surface, as well as the body surface, is represented by polygonal meshes that

can have several thousand polygons each. Testing each couple of polygons for

potential collisions is an unlikely task. [2]

In the case of cloth simulation, bounding-volume hierarchies are sufficient algorithms

for collision detection, since the topology of the animated meshes mostly remains

constant, and therefore a constant pre-computed hierarchy could be used. [2]

Designing a cloth simulation frame work requires the detection of self collisions in the

cloth surface, which can be bend, wrinkle and crumple in very complex patterns. This

kind of detection is very incompetent, as every adjacent elements of the mesh are seen

as colliding by the detection algorithm. Hence, self-collisions can only be detected

within surface regions that are curved sufficiently to display them. [2]

3.4. Simulation of Dynamic Meshes

An interactive design framework always needs efficient mechanical simulation and

collision techniques for animating mechanical objects rapidly for an urgent feedbackof the design actions. However, user interaction will only be useful if an adequate

management of the pattern design give urgent feedback of the changes to the

mechanical simulation system. [2]

The key idea of the system is to take advantage of a vigorously constructed mesh that

automatically adapts to the shape and feature changes of the garment patterns during


9/17

9

their design. So, any action altering the 2D shape of the patterns would have a straight

mechanical effect on the 3D shape of the garment surface. [2]

3.4.1. Altering the Shape of Garment Patterns

Most pattern correction deal with resizing and improving the shape of the patterns forbetter fit to the body. It is often useless to perform a complete reconstruction of the

garment mesh in these cases. An alteration of the fabric mesh vertices is sufficient for

matching the new pattern shape. Such simulation system scheme is possible as it does

not rely on regular framework for performing the simulation. [2]

Fig.5. Interactive edition of patterns: Each mesh vertex of the pattern surface is

displaced by a weighted amount of the displacement of the pattern contour point. [2]

Interactive Design System takes benefit of a mapping update algorithm which updates

the 2D mesh position on the fabric according to the 2D shape adjustment of the

pattern. For this reason, there are extended mesh illustration where each vertex

"remembers" which pattern vertices has originated it. Finally, the fabric coordinates of

a mesh vertex is actually obtained as a weighted sum of fabric coordinates of vertices

defining the pattern shape. When one of these vertices is displaced, all relevant mesh

vertices are updated according to the coefficients of the weighted sum which are

stored in the data structure of program. [2]

3.4.2 Techniques for Fitting Garments on a Body

Taking care of body sizes and postures is important for designing garments that fit the

body well. Rather than recreating a new 3D garment for each body to be dressed,

advantage can be taken of the versatility of the design system to provide automatic

garment adaptation to any body size and posture change. [2]


10/17

10

Cloth deformation data can easily be extracted from the mechanical model used in the

system. This cloth deformation can be displayed directly on the cloth surface in the

form of strain or stress diagrams. These figures illustrate the deformation of the fabric

tension accurately on each region of the cloth. The garment designer can judge where

the garment is excessively in tension, he can correct the pattern shapes accordingly

and can observe the effect of the correction in real-time animation. Pressure of thegarment on the body skin demonstrates the comfortability of the garment on body. [2]

Anybody may be described by a set of measurements, which can either be explicitly

specified, either computed from other specified measurements using statistics. Input

data may for instance be extracted from 3D body scanner data. While the initial

draping of a designed garment is performed on a generic body of "standard"

measurements, the user may then change any measurement with on-the-fly fitting of

the garment on the body, immediately assess fitting and comfortability, and change

garment size and measurement accordingly. [2]

Fig.6. Bodies of different measurements. [2]

Postures can be changed interactively in the same way like standard body shape.

While the garment is usually created on a generic body posture that facilitates garment

assembly and draping, the user may then switch between any suitable postures. The

system automatically generates a small animation of the body from the initial postureto the new one, and mechanical computation will automatically adapt the draped

garment to the new posture (Fig.7). Besides creating artistic poses, this also helps the

garment designer to validate the shape of the garment using the comfortability tools.

[2]


11/17

11

Fig.7. Animation from one posture to another allows testing the fitness and the

comfortability of a garment. [2]

3.5. Real-Time Animation of Garments

The real-time animation is integrated to the garment design tool to provide a preview

of the clothes. Animated body and a garment whose rest shape are computed with the

garment design tool; this module provides the real-time visualization of the garments

on the animated body. This module can be used at any time during the making of theclothes that helps the designers to judge the quality of their clothes. [2]

The movement of the garment can be classified into several categories depending on

how the garment is laid on, whether it sticks to, or flows on, the body surface. For

instance, a tight pair of trousers will mainly follow the movement of the legs, whilst a

skirt will flow around the legs. Thus, we segment the cloth into three layers that we

define as follows:

- Layer 1 (Stretch cloth): Garment regions that attach to the body with a constant

offset. In this case, the cloth follows exactly the movement of the underlying

skin surface.

- Layer 2 (Loose cloth): Garment regions that move within a certain distance to

the body surface are placed in another category. The best examples are

sleeveless shirts. In this case the cloth surface always collides with the same

skin surface and its movement is mainly perpendicular to the body surface.

- Layer 3 (Floating cloth): Garment regions that flow around the body. The

movement of the cloth does not follow exactly the movement of the body.


12/17

12

Collisions are not predictable; for a long skirt, for instance, the left side of the

skirt may collide with the right leg during animation. [2]

Fig.8. Segmentation of garments. [2]

The segmentation process dispatches each garment region to its adequate layer. It

starts from the garment in its rest shape on the initial body, the distance between the

garment and the skin surface is used to determine to which category the cloth triangles

belong. Associated with each segment are distances from the skin surface that are used

to determine the category. Each segment falls into one of three categories: tight, loose

and floating clothes. Cloth vertices which are located closely to the skin surface

belong to the first or the second layer. Cloth vertices that do not collide with any skin

surface belong to the third layer. [2]

3.5.2. Garment Animation

Garment vertices are animated with three different methods, depending on which layer

they belong and it is defined during the pre-processing stage. [2]

Tight clothes in Layer 1 follow the deformation of the underlying skin and thesedeformations are calculated and planned.

For Layer 2 that is composed of loose clothes, the relative movements of clothes to

the skin remain relatively small, keeps a certain distance from the skin surface. In

considering the movement of sleeve in relation with the arm: for a certain region of

the garment, the collision area falls within a fixed region of the skin surface during


13/17

13

simulation. With this motion in mind, the scope of the collision detection can be

strictly limited. A basic supposition made is that the movement of the garment largely

depends on that of the underlying skin and yet it should not follow the skin surface

rigidly. The local displacement of the garment from the skin surface is necessary to

simulate. [2]

Two different methods are developed for this purpose, one for cloth deformation on

the limbs (trousers and sleeves) and the other one for the deformation of cloth on the

trunk. Cloth vertices on the limbs are enclosed in half spheres that are attached to the

skin surface (fig.9). Vertices inside these spheres are displaced with the equation of

the rigid body motion. [2]

Fig.9. Cross section of a limb with a garment. Fig.10. Control (light) and attach

(dark) points for FFD. [2]

Layer 3 is composed of vertices that freely float around the body. This will take care

of scenarios, for example a large skirt floating around the legs. Any body part on this

skirt can have a collision with any part of the leg. The simulation of this layer uses a

classical approach with particle system and collision avoidance. [2]

3.6. The Virtual Try-On

The garment design tool would not be complete without the visualization of the

garments by the customers. The web application "Virtual Try-On" has been developed

to serve for this purpose. With the Virtual Try-On, customers have a free choice and

can choose garments and try on 3D mannequins that are adjusted to their body

measurements. These tools are assisted to conduct proper online purchase of apparels.


14/17

14

The Virtual Try-On supports a number of efficient and interactive operations, such as

automatic adjustment of the 3D mannequin according to the shoppers body

measurement, the selection and trial of different garment items. It also includes the

online fitting/resizing of the garment to the mannequin and real-time simulation of the

garment movement. [2]

Fig.11. Interface for a web-based virtual Fig.12. Real-time animation of a dress

try-on application. [2]

The online clothing store Web server consists of two databases: first one is the body

database that contains 3D mannequins and the second one is garment database that is

composed of the garments available for purchasing. Upon user selection, the chosen

3D garment model and the body are downloaded to the client. These garments have

been designed with the garment design tool and exported to the garment database. [2]


15/17

15

Fig.13. Architecture of the web-based virtual try-on application. [2]

The Web Client application contains the body/garment sizing module and the real-time

garment simulation module. The body/garment sizing module provides functionalities

to deform the 3D mannequin from the customers input body size and resize the

selected garment consequently. Once the garments and the mannequin have been

adapted to the customer's measurements, real time garment simulation is done by the

animation of dressed mannequin. [2]

4. Designers and Brands Using Interactive Fashion Design System

Various Designers and Brands are using Interactive Design System for the

development of garments nowadays. But most popular are [5]

Gucci

WEEL Technologies

Alexander McQueen

Tommy Hilfiger
http://www.weeltechnologies.com/http://www.weeltechnologies.com/


16/17

16

4. Interactive Fashion Garments

[6] [7] [8] [9]

5. Conclusion:

By using Interactive Fashion Design System, a lot of different and complex textile

designs and garments can be designed and visualized without actual manufacturing. It

saves a lot of money and time, as without this system we have to spend a lot of time,

energies and money for development and testing fabric to garment on mannequins. Yet

it is difficult at this stage to correlate the interactive fabric design on 2D to actually


17/17

17

see its drape and look on 3D Garment simulation due to technical limitations in

software and motion of human body parts. But research is being done for its

improvement and in near future, designers will be successful to correlate fabric design

with garment simulation.

6. References:

1. From Early Virtual Garment Simulation to Interactive Fashion Design

Pascal VOLINO, Frederic CORDIER, Nadia MAGNENAT-THALMANNMIRALab, C.U.I., University of Geneva - CH-1211, Switzerlandhttp://www.miralab.ch

2. AN INTERACTIVE FASHION DESIGN

3. AN INTERACTIVE FASHION DESIGN SYSTEM 'INFADS'

TOSIYASU L. KUNII,t TAKAKO AMANO,~: HIROSHI ARISAWA:~ and SACHIKOOKADA

Man-Machine Intelligence Project, Information Science Laboratories, University ofTokyo, 7-3-1, Hongo, Tokyo 113, Japan

4. http://fohn.net/monarch-butterfly-pictures/

5. http://fashionista.com/2010/09/gucci-launches-interactive-fashion-show-

technology/

6. http://cmk.typepad.com/digitaldeities/interactive-fashion/

7. http://www.talk2myshirt.com/blog/archives/347

8. http://www.pleatfarm.com/2010/02/12/interactive-fashion-ying-gao/

9. http://ambientenvironments.wordpress.com/2010/09/28/philips-and-hussein-

chalayan-clothes-that-show-the-emotion-of-the-wearer/
http://www.miralab.ch/http://fohn.net/monarch-butterfly-pictures/http://fashionista.com/2010/09/gucci-launches-interactive-fashion-show-technology/http://fashionista.com/2010/09/gucci-launches-interactive-fashion-show-technology/http://cmk.typepad.com/digitaldeities/interactive-fashion/http://www.talk2myshirt.com/blog/archives/347http://www.pleatfarm.com/2010/02/12/interactive-fashion-ying-gao/http://ambientenvironments.wordpress.com/2010/09/28/philips-and-hussein-chalayan-clothes-that-show-the-emotion-of-the-wearer/http://ambientenvironments.wordpress.com/2010/09/28/philips-and-hussein-chalayan-clothes-that-show-the-emotion-of-the-wearer/http://www.miralab.ch/http://fohn.net/monarch-butterfly-pictures/http://fashionista.com/2010/09/gucci-launches-interactive-fashion-show-technology/http://fashionista.com/2010/09/gucci-launches-interactive-fashion-show-technology/http://cmk.typepad.com/digitaldeities/interactive-fashion/http://www.talk2myshirt.com/blog/archives/347http://www.pleatfarm.com/2010/02/12/interactive-fashion-ying-gao/http://ambientenvironments.wordpress.com/2010/09/28/philips-and-hussein-chalayan-clothes-that-show-the-emotion-of-the-wearer/http://ambientenvironments.wordpress.com/2010/09/28/philips-and-hussein-chalayan-clothes-that-show-the-emotion-of-the-wearer/

Interactive Design process

Documents

Transcript of Interactive Design process