Download presentation
Presentation is loading. Please wait.
Published byLester Anderson Modified over 9 years ago
1
1 Artistic Resizing A Technique for Rich Scale-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 Vinot Direction Générale de l’Aviation Civile
2
2 Graphical designers are given more and more importance in GUIs Exploitation of vector graphics (e.g, Scalable Vector Graphics) IntuiKit [Chatty et al, UIST’04] Graphically Rich User Interfacs
3
3 The Resizing Problem Fixed size Naive scaling Common resizing
4
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 wLwL hLhL yLyL xLxL r hBhB wBwB x L = (w-w L ) / 2 y L = (h-h L ) / 2 w L = 20 h L = 10 w B = 5 h B = 5 r = 20
5
5 Expressing Resizing But designers think visually They are used to produce visual declinations Variants are also useful to convey general laws On white paper On black paper On red paper Medium size Small size
6
6 Expressing Resizing Layout design relies on perception and aesthetics Does not translate into simple formulae
7
7 Artistic Resizing 1. Designers produce variants using their authoring tool 2. IntuiKit interprets the example set
8
8 Artistic Resizing Support for invariants but also for complex laws w h wLwL hLhL yLyL xLxL r hBhB wBwB x L = (w-w L ) / 2 y L = (h-h L ) / 2 w L = 20 h L = 10 w B = 5 h B = 5 r = 20
9
9 Artistic Resizing A scenario
10
10 Artistic Resizing A scenario
11
11 Artistic Resizing A scenario
12
12 Artistic Resizing A scenario
13
13 Artistic Resizing A scenario
14
14 Artistic Resizing A scenario
15
15 Artistic Resizing A scenario
16
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 T1T1 T1’T1’
17
17 Artistic Resizing How does it work? Each variant of T1 is associated with the example’s bounding box T1T1 T1’T1’ ? T 1 ’’ T 1 ’’’
18
18 Artistic Resizing How does it work? Problem of multivariate interpolation width height T1’T1’ T 1 ’’’ T 1 ’’ transf. T1T1 ?
19
19 An affine transformation matrix: Artistic Resizing Orthogonal Interpolation a 11 a 12 a 13 a 21 a 22 a 23 0 0 1 T1T1 X Y 1 X0X0 Y0Y0 1 =
20
20 Orthogonal Interpolation hypothesis: Width only impacts the X contribution Height only impacts the Y contribution Artistic Resizing Orthogonal Interpolation a 11 a 12 a 13 a 21 a 22 a 23 0 0 1 X Y 1 X0X0 Y0Y0 1 = width height
21
21 Artistic Resizing Orthogonal Interpolation X and Y contributions are projected onto separate axis: width T1T1 a 11 a 12 a 13 a 21 a 22 a 23 height X transf. Y transf.
22
22 A piecewise linear interpolation is performed on each axis: Artistic Resizing Orthogonal Interpolation width height X transf. Y transf. → + a 11 a 12 a 13 a 21 a 22 a 23 a 11 a 12 a 13 a 21 a 22 a 23 0 0 1 T
23
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 T1T1 T1’T1’ T2T2 T2’T2’ p1 p2 p1 T T’ g g p2 p1 p2 p1
24
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
25 Artistic Resizing Properties of Orthogonal Interpolation Preserves relative ratios: Ratios that are invariant on the examples will remain invariant
26
26 Artistic Resizing Properties of Orthogonal Interpolation Preserves contacts: Two points that coincide on the examples will always coincide
27
27 Artistic Resizing Properties of Orthogonal Interpolation Preserves parallelism: Two lines that are parallel on the examples will remain parallel
28
28 Artistic Resizing Limitations of Orthogonal Interpolation Does not support composition: Composing interpoled transformations may lead to non-linear resizing behaviors T1T1 T 2 = Scale(1) T 3 = Scale(1) T4T4 T1T1 T 2 = Scale(0.1) T 3 = Scale(20) T4T4 Scale = 1 Scale = 2 A B T1T1 T 2 = Scale(0.55) T 3 = Scale(10.5) T4T4 Scale = 5.775 ( A + B )/ 2
29
29 Artistic Resizing Limitations of Orthogonal Interpolation Does not support composition: Scenegraphs must be normalized by pre-composing transformation matrices T1T1 T2T2 T 3 = Scale(1) T4T4 T1T1 T2T2 T 3 = Scale(2) T4T4 Scale = 1 Scale = 2 A B T1T1 T2T2 T 3 = Scale(1.5) T4T4 Scale = 1.5 ( A + B )/ 2
30
30 Artistic Resizing Limitations of Orthogonal Interpolation Does not support pure rotations: Rotation = Xshear + Yshear
31
31 Artistic Resizing Limitations of Orthogonal Interpolation Dependent from the coordinates frame: Interpolation properties depend on the orientation
32
32 Artistic Resizing Limitations of Orthogonal Interpolation Does not support cross-axis constraints: No circles, squares, or «squeezing» effects
33
33 Artistic Resizing Limitations of Orthogonal Interpolation Does not support high-level constraints: e.g., objects can’t be told to « carriage return »
34
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
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
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
37 Artistic Resizing Future Work More extensive support for SVG attributes Support for parametrization Blending with traditional layout managers: Testing with graphical designers
38
38 Artistic Resizing Future Work More extensive support for SVG attributes Support for parametrization Blending with traditional layout managers: Testing with graphical designers
39
39 Artistic Resizing Questions ?
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.