Date post: | 13-Dec-2015 |
Category: |
Documents |
Upload: | lester-anderson |
View: | 221 times |
Download: | 6 times |
1
Artistic Resizing
A Technique for RichScale-Sensitive Vector Graphics
Merci de ne pas diffuser avant le 30 octobre 05 (brevet en cours)
Pierre Dragicevic
Stéphane Chatty
David Thevenin
Jean-Luc VinotDirection
Générale de l’Aviation
Civile
2
Graphical designers are given moreand more importance in GUIs
Exploitation of vector graphics(e.g, Scalable Vector Graphics)
IntuiKit [Chatty et al, UIST’04]
Graphically Rich User Interfacs
3
The Resizing Problem
Fixedsize
Naivescaling
Common resizing
4
Expressing Resizing
Resizing is commonly described using formulae
These formulae are: Translated into code by the programmer Or used as an input to constraint-solving systems
w
h
wL
hL
yL
xLr
hB
wB
xL = (w-wL) / 2 yL = (h-hL) / 2 wL = 20 hL = 10
wB = 5 hB = 5
r = 20
5
Expressing Resizing
But designers think visually
They are used to produce visual declinations
Variants are also useful to convey general laws
On whitepaper
On blackpaper
On redpaper
Mediumsize
Smallsize
6
Expressing Resizing
Layout design relies on perception and aesthetics
Does not translate into simple formulae
7
Artistic Resizing
1. Designers produce variants using their authoring tool
2. IntuiKit interprets the example set
8
Artistic Resizing
Support for invariants but also for complex laws
w
h
wL
hL
yL
xLr
hB
wB xL = (w-wL) / 2 yL = (h-hL) / 2 wL = 20 hL = 10
wB = 5 hB = 5
r = 20
9
Artistic Resizing A scenario
10
Artistic Resizing A scenario
11
Artistic Resizing A scenario
12
Artistic Resizing A scenario
13
Artistic Resizing A scenario
14
Artistic Resizing A scenario
15
Artistic Resizing A scenario
16
Artistic Resizing How does it work?
Assumes the exclusive use of: Copy & paste for adding new examples Affine transformation tools (move, scale, rotate, shear)
Based on local interpolation of transformations
T1 T1’
17
Artistic Resizing How does it work?
Each variant of T1 is associated withthe example’s bounding box
T1 T1’
?
T1’’ T1’’’
18
Artistic Resizing How does it work?
Problem of multivariate interpolation
width
height
T1’
T1’’’
T1’’
transf.
T1
?
19
An affine transformation matrix:
Artistic Resizing Orthogonal Interpolation
a11 a12 a13
a21 a22 a23
0 0 1
T1
X
Y
1
X0
Y0
1
=
20
Orthogonal Interpolation hypothesis: Width only impacts the X contribution Height only impacts the Y contribution
Artistic Resizing Orthogonal Interpolation
a11 a12 a13
a21 a22 a23
0 0 1
X
Y
1
X0
Y0
1
=
width
height
21
Artistic Resizing Orthogonal Interpolation
X and Y contributions are projected onto separate axis:
width
T1
a11 a12 a13
a21a22
a23
height
X transf. Y transf.
22
A piecewise linear interpolation is performed on each axis:
Artistic Resizing Orthogonal Interpolation
width
height
X transf. Y transf.
→+ a11 a12 a13
a21a22
a23 a11 a12 a13
a21 a22 a23
0 0 1
T
23
Artistic Resizing Properties of Orthogonal Interpolation
Structure-independent: The interpolation is independent from the way
points have been structured into shapes and groups
(Sodipodi) (Illustrator)
p2
T1 T1’T2 T2’
p1 p2 p1
T T’
g g
p2p1 p2 p1
24
Artistic Resizing Properties of Orthogonal Interpolation
Preserves algebraic measures: If horizontal or vertical distances are the same on the
examples they will remain the same
25
Artistic Resizing Properties of Orthogonal Interpolation
Preserves relative ratios: Ratios that are invariant on the examples
will remain invariant
26
Artistic Resizing Properties of Orthogonal Interpolation
Preserves contacts: Two points that coincide on the examples
will always coincide
27
Artistic Resizing Properties of Orthogonal Interpolation
Preserves parallelism: Two lines that are parallel on the examples
will remain parallel
28
Artistic Resizing Limitations of Orthogonal Interpolation
Does not support composition: Composing interpoled transformations may lead to
non-linear resizing behaviors
T1
T2 = Scale(1)
T3 = Scale(1)
T4
T1
T2 = Scale(0.1)
T3 = Scale(20)
T4
Scale = 1Scale = 2
A BT1
T2 = Scale(0.55)
T3 = Scale(10.5)
T4
Scale = 5.775
(A+B)/2
29
Artistic Resizing Limitations of Orthogonal Interpolation
Does not support composition: Scenegraphs must be normalized by pre-composing
transformation matrices
T1
T2
T3 = Scale(1)
T4
T1
T2
T3 = Scale(2)
T4
Scale = 1Scale = 2
A B
T1
T2
T3 = Scale(1.5)
T4
Scale = 1.5
(A+B)/2
30
Artistic Resizing Limitations of Orthogonal Interpolation
Does not support pure rotations: Rotation = Xshear + Yshear
31
Artistic Resizing Limitations of Orthogonal Interpolation
Dependent from the coordinates frame: Interpolation properties depend on the orientation
32
Artistic Resizing Limitations of Orthogonal Interpolation
Does not support cross-axis constraints: No circles, squares, or «squeezing» effects
33
Artistic Resizing Limitations of Orthogonal Interpolation
Does not support high-level constraints: e.g., objects can’t be told to « carriage return »
34
Artistic Resizing vs. Animation Interpolation
Techniques: Separate storage of rotation (Flash, Director,…) Polar decomposition [Shoemake et al. 92]
Animation: Monovariate (time) Axis-independence Objects rotate (rigidity) Can be precomputed
GUI Resizing: Bivariate (width+height) Screen dependence Objects are « elastic » Must update interactively
35
Demonstrational layout specification systems: Peridot [Myers 90] Chimera [Kurlander & Feiner 93]
Constraint inference: Extensive search
for invariants Sensitive to combi-
natorial explosion Over-constrained or
unintended rules
Artistic Resizing vs. Constraint Inference
Orthogonal interpolation: Ensures the preservation of
« interesting » invariants Fast computation, even with
complex vector graphics Limitations are known, results
are easy to predict
36
Artistic Resizing Other Related Work
Layout models: Boxes and glue (TeX, Swing,…) 9-part tiling technique [Hudson & Tanaka 00]
Constraints: Textual formulae Graphical frontends
[Hudson & Mohamed 90]
Image interpolation: Multiple Master Fonts Shape blending, image morphing
37
Artistic Resizing Future Work
More extensive support for SVG attributes
Support for parametrization
Blending with traditional layout managers:
Testing with graphical designers
38
Artistic Resizing Future Work
More extensive support for SVG attributes
Support for parametrization
Blending with traditional layout managers:
Testing with graphical designers
39
Artistic Resizing
Questions ?