1 / 39

Pierre Dragicevic Stéphane Chatty David Thevenin Jean-Luc Vinot

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.

duer
Download Presentation

Pierre Dragicevic Stéphane Chatty David Thevenin Jean-Luc Vinot

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Artistic ResizingA Technique for RichScale-Sensitive Vector GraphicsMerci 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. 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. w xL •  wB = 5 • hB = 5 •  r = 20 •  xL = (w-wL) / 2 •  yL = (h-hL) / 2 •  wL = 20 • hL = 10 r yL h hL wL hB wB 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

  5. Expressing Resizing • But designers think visually • They are used to produce visual declinations • Variants are also useful to convey general laws On whitepaper Smallsize Mediumsize On blackpaper On redpaper

  6. Expressing Resizing • Layout design relies on perception and aesthetics • Does not translate into simple formulae

  7. Artistic Resizing • Designers produce variants using their authoring tool • IntuiKit interprets the example set

  8. w xL r yL h hL wL hB wB •  wB = 5 • hB = 5 •  r = 20 •  xL = (w-wL) / 2 •  yL = (h-hL) / 2 •  wL = 20 • hL = 10 Artistic Resizing • Support for invariants but also for complex laws

  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. T1 T1’ 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

  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 T1’’ T1’ height T1 ? transf. T1’’’ width

  19. Artistic Resizing Orthogonal Interpolation • An affine transformation matrix: T1 a13 a12 a11 X X0 a23 a22 = a21 Y Y0 1 0 0 1 1

  20. Artistic Resizing Orthogonal Interpolation • Orthogonal Interpolation hypothesis: • Width only impacts the X contribution • Height only impacts the Y contribution a13 a12 width a11 X X0 a23 a22 height = a21 Y Y0 1 0 0 1 1

  21. a23 a22 a21 a13 a11 a12 Artistic Resizing Orthogonal Interpolation • X and Y contributions are projected onto separate axis: height T1 Y transf. X transf. width

  22. a13 a11 a12 a23 a21 a22 1 0 0 a23 a22 a13 a11 a12 a21 Artistic Resizing Orthogonal Interpolation • A piecewise linear interpolation is performed on each axis: height Y transf. X transf. width T → +

  23. Artistic Resizing Properties of Orthogonal Interpolation • Structure-independent: • The interpolation is independent from the waypoints have been structured into shapes and groups (Sodipodi) (Illustrator) T’ T T1’ T2’ T2 T1 g g p2 p1 p1 p2 p1 p2 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 exampleswill remain invariant

  26. Artistic Resizing Properties of Orthogonal Interpolation • Preserves contacts: • Two points that coincide on the exampleswill always coincide

  27. Artistic Resizing Properties of Orthogonal Interpolation • Preserves parallelism: • Two lines that are parallel on the exampleswill remain parallel

  28.  (A+B)/2 T1 T2 = Scale(0.55) T3 = Scale(10.5) T4 Scale = 5.775 Artistic Resizing Limitations of Orthogonal Interpolation • Does not support composition: • Composing interpoled transformations may lead to non-linear resizing behaviors B A T1 T1 T2 = Scale(0.1) T2 = Scale(1) T3 = Scale(20) T3 = Scale(1) T4 T4 Scale = 1 Scale = 2

  29.  (A+B)/2 T1 T2 T3 = Scale(1.5) T4 Scale = 1.5 Artistic Resizing Limitations of Orthogonal Interpolation • Does not support composition: • Scenegraphs must be normalized by pre-composing transformation matrices B A T1 T1 T2 T2 T3 = Scale(2) T3 = Scale(1) T4 T4 Scale = 1 Scale = 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. Artistic Resizing vs. Constraint Inference • Demonstrational layout specification systems: • Peridot [Myers 90] • Chimera[Kurlander & Feiner 93] • Constraint inference: • Extensive searchfor invariants • Sensitive to combi-natorial explosion • Over-constrained orunintended rules • 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 ?

More Related