available and upcoming web graphics standards
play

Available and Upcoming Web Graphics Standards Canon, Inc. Jun - PowerPoint PPT Presentation

Jan 13, 2023 •360 likes •485 views

Available and Upcoming Web Graphics Standards Canon, Inc. Jun Fujisawa fujisawa.jun@canon.co.jp General 2D/3D Graphics APIs HTML Canvas: www.w3.org/TR/2dcontext/ WebGL: www.khronos.org/registry/webgl/ specs/1.0/ Consider using SVG

  1. Available and Upcoming Web Graphics Standards Canon, Inc. Jun Fujisawa fujisawa.jun@canon.co.jp

  2. General 2D/3D Graphics APIs • HTML Canvas: www.w3.org/TR/2dcontext/ • WebGL: www.khronos.org/registry/webgl/ specs/1.0/ • Consider using SVG instead when retained graphics are needed • Consider using CSS Animations/Transitions to reduce battery consumption caused by complex JavaScript processing

  3. 2D/3D Transformation and Transitions • CSS Transforms: www.w3.org/TR/css3- transforms/ • CSS Transitions: www.w3.org/TR/css3- transitions/ • Useful for 2.5D user interface design like “Cover Flow” • CSS Transforms is a unified specification applicable to both HTML and SVG

  4. Background Graphics and Borders • CSS Backgrounds and Borders: www.w3.org/TR/css3-background/ • Flexible background and border manipulation without complex DOMs • Defines rounded corners, image slicing, and drop shadows as well

  5. Media Adaptation • Media Queries: www.w3.org/TR/css3- mediaqueries/ • Selects style sheets based on dimension, orientation, or color of output media • Key features to achieve “Responsive Web Design”

  6. Web Fonts • WOFF File Format: www.w3.org/TR/ WOFF/ • A new compressed font packaging format specifically designed for downloadable fonts • Alternative to OpenType or TrueType fonts where licensing considerations make their use less acceptable

  7. Image References and Gradients • CSS Image Values and Replaced Content: www.w3.org/TR/css3-images/ • Provides native CSS support for sprites • Clip referenced images by using the ‘#xywh=’ spacial fragment • Defines linear and radial gradients as well

  8. Text Layout across Multiple Regions • CSS Regions: www.w3.org/TR/css3-regions/ • CSS Exclusions and Shapes: www.w3.org/ TR/css3-exclusions/ • Essential to support high-design text contents like magazine • Currently discussed as Advanced Adaptive Layout Extension proposal to EPUB 3

  9. Compositing and Blending • Compositing and Blending: dvcs.w3.org/hg/ FXTF/raw-file/82ac2d2fe099/compositing/ index.html • Porter-Duff compositing operators from SVG • Compositing and Blending is a unified specification applicable to both HTML and SVG

  10. Filter Effects • Filter Effects: dvcs.w3.org/hg/FXTF/raw-file/ 82ac2d2fe099/filters/index.html • Raster image filter effects from SVG • Filter Effects is a unified specification applicable to both HTML and SVG

  11. Web Animation • Web Animation: dvcs.w3.org/hg/FXTF/raw- file/593e1ac28b20/web-animations/ index.html • An effort to combine two different animation models, CSS Animation and SVG Animation • Web Animation is a unified specification applicable to both HTML and SVG

  12. Scalable Vector Graphics • SVG 1.1: www.w3.org/TR/SVG11/ • SVG 2.0: svgwg.org/svg2-draft/ • SVG 2.0 adds new features including advanced gradients, canned filters, and new animation • Scheduled to be Candidate Recommendation around March 2014

Download Presentation
Download Policy: The content available on the website is offered to you 'AS IS' for your personal information and use only. It cannot be commercialized, licensed, or distributed on other websites without prior consent from the author. To download a presentation, simply click this link. If you encounter any difficulties during the download process, it's possible that the publisher has removed the file from their server.

Recommend

Announcement Upcoming graphics courses: Color Computer Animation: Algorithms &

Announcement Upcoming graphics courses: Color Computer Animation: Algorithms &

Announcement Upcoming graphics courses: Color Computer Animation: Algorithms & Techniques (Winter) Procedural Shading (Spring) Applications in VR (Virtual Theatre) (Fall) AI for Interactive Environments (Spring) Logistics

293 views • 13 slides
Graphics Murray Cole Graphics 1 Graphics 2 Graphics 3 Graphics 4 Graphics 5 Graphics 6

Graphics Murray Cole Graphics 1 Graphics 2 Graphics 3 Graphics 4 Graphics 5 Graphics 6

I V N E U R S E I H T Y T O H F G R E U D I B N Graphics Murray Cole Graphics 1 Graphics 2 Graphics 3 Graphics 4 Graphics 5 Graphics 6 class Smiley extends JFrame { public Smiley() { super ("Love n

638 views • 24 slides
Discussion Upcoming pronouncements Upcoming pronouncements Summary Revenue recognition Revenue

Discussion Upcoming pronouncements Upcoming pronouncements Summary Revenue recognition Revenue

10/18/2019 Nonprofit Accounting Update: Present & Future UFLC 2019 Dallas, Texas Bill Sims , CP A, Partner S almon S ims Thomas Ashley Voss , CP A, Partner Ratliff & Associates 1 New reporting standards New reporting standards

462 views • 7 slides
UPCOMING EVENTS FOR 2014 Winter Software Festival STATA basics, STATA graphics, UCINET, & GIS

UPCOMING EVENTS FOR 2014 Winter Software Festival STATA basics, STATA graphics, UCINET, & GIS

QIPSR UPCOMING EVENTS FOR 2014 Winter Software Festival STATA basics, STATA graphics, UCINET, & GIS Methodological Emphasis on Structural Equation Models 1 -January Introduction to SEM by UK faculty 2 -April 10-11, State of the SEM Art

383 views • 17 slides
Status of the upcoming ODF 1.3 Svante.Schubert@gmail.com Reason for Standards Svante Schubert

Status of the upcoming ODF 1.3 Svante.Schubert@gmail.com Reason for Standards Svante Schubert

Status of the upcoming ODF 1.3 Svante.Schubert@gmail.com Reason for Standards Svante Schubert 2 Reason for ODF Standard ODF Specification Blueprint for ODF applications Specifying the Model (Shock frozen document) ODF Tests

461 views • 18 slides
CS378 - Mobile Computing 3D Graphics 2D Graphics android.graphics library for 2D graphics

CS378 - Mobile Computing 3D Graphics 2D Graphics android.graphics library for 2D graphics

CS378 - Mobile Computing 3D Graphics 2D Graphics android.graphics library for 2D graphics (not Java AWT and Swing) classes such as Canvas, Drawable, Bitmap, and others to create 2D graphics Various attempts to make two d graphics

411 views • 40 slides
Graphics Processing CS418 Computer Graphics John C. Hart Graphics Processing Graphics

Graphics Processing CS418 Computer Graphics John C. Hart Graphics Processing Graphics

Graphics Processing CS418 Computer Graphics John C. Hart Graphics Processing Graphics Processor Triangle mesh with Image of RGB-colored vertices at 3-D floating- pixels at 2-D integer point spatial coordinate planar coordinate positions

542 views • 14 slides
6. Graphics MULTIMEDIA & GRAPHICS Graphics covers wide range of pictorial representations.

6. Graphics MULTIMEDIA & GRAPHICS Graphics covers wide range of pictorial representations.

10/12/2016 CHAPTER 6. Graphics MULTIMEDIA & GRAPHICS Graphics covers wide range of pictorial representations. Uses for computer graphics include: U f t hi i l d Buttons Charts Diagrams Animated images g 2 1

470 views • 20 slides
Agenda for today Graphics! XploRe Multidimensional Graphics 1-2 Graphics 1 plot (x1 {, x2 {,

Agenda for today Graphics! XploRe Multidimensional Graphics 1-2 Graphics 1 plot (x1 {, x2 {,

0-1 Agenda for today Graphics! XploRe Multidimensional Graphics 1-2 Graphics 1 plot (x1 {, x2 {, ... {x5 }}}) plots the three -dimensional data sets x1 , ..., 2 x5 3 gr = grsurface(x {, col}) generates surface from the function

796 views • 43 slides
Workshop 5.2: The Grammar of Graphics Murray Logan 16 Jul 2017 Section 1 Graphics in R

Workshop 5.2: The Grammar of Graphics Murray Logan 16 Jul 2017 Section 1 Graphics in R

Workshop 5.2: The Grammar of Graphics Murray Logan 16 Jul 2017 Section 1 Graphics in R Options Traditional (base) graphics isolated instructions to the device Grid graphics instruction sets lattice ggplot2 > library

1.53k views • 88 slides
Computer Graphics Overview CMSC 435/634 1 Graphics Areas Core graphics areas

Computer Graphics Overview CMSC 435/634 1 Graphics Areas Core graphics areas

Computer Graphics Overview CMSC 435/634 1 Graphics Areas Core graphics areas Modeling Rendering Animation Imaging Other areas which draw on computer graphics User Interaction Virtual Reality

621 views • 48 slides
CS324e - Elements of Graphics and Visualization More Java2D Graphics More 2D Graphics

CS324e - Elements of Graphics and Visualization More Java2D Graphics More 2D Graphics

CS324e - Elements of Graphics and Visualization More Java2D Graphics More 2D Graphics "Primitives" We have already seen: rectangles, ellipses, arcs, lines Today: curves, polygons, areas, paths 2 Quad Curves

991 views • 31 slides
CS324e - Elements of Graphics and Visualization Java2D Graphics Java2D Graphics Render

CS324e - Elements of Graphics and Visualization Java2D Graphics Java2D Graphics Render

CS324e - Elements of Graphics and Visualization Java2D Graphics Java2D Graphics Render Heating animal remains to extract fat generating an image from a (mathematical) model Java2D can handle primitive shapes, text, images

372 views • 26 slides
Standards (code and otherwise) often talk about code standards, but many teams also use

Standards (code and otherwise) often talk about code standards, but many teams also use

Standards (code and otherwise) often talk about code standards, but many teams also use document standards, version control standards, bug reporting standards, process standards, etc goal is to reduce confusion, errors, omissions in

529 views • 5 slides
Scalable Vector Graphics (SVG) XML Graphics for the Web SVG Overview Scalable Vector Graphics

Scalable Vector Graphics (SVG) XML Graphics for the Web SVG Overview Scalable Vector Graphics

Scalable Vector Graphics (SVG) XML Graphics for the Web SVG Overview Scalable Vector Graphics (SVG) is a language for describing two- dimensional graphics and graphical applications in XML. SVG is suitable for Web applications based on

407 views • 17 slides
State of the Intel Kernel Graphics Driver Daniel Vetter, Intel OTC LinuxTag Berlin 2014

State of the Intel Kernel Graphics Driver Daniel Vetter, Intel OTC LinuxTag Berlin 2014

State of the Intel Kernel Graphics Driver Daniel Vetter, Intel OTC LinuxTag Berlin 2014 overview review of the past year: features, driver internals, testing & documentation highlights of upcoming platforms: broadwell, baytrail

801 views • 20 slides
iOS Animation with Swift Part 4: Advanced View Animations Using an auxiliary view start end

iOS Animation with Swift Part 4: Advanced View Animations Using an auxiliary view start end

iOS Animation with Swift Part 4: Advanced View Animations Using an auxiliary view start end transition duration time time Demo: Cross fade via auxiliary view Simple cube transition add temporary label remove temporary label start time

578 views • 8 slides
Animation Example: Cloth time evolution of a mesh subject to Simulation with Meshes

Animation Example: Cloth time evolution of a mesh subject to Simulation with Meshes

Animation Example: Cloth time evolution of a mesh subject to Simulation with Meshes internal forces stretch and bending stretch and bending external forces From Volino & Magnenat-Thalmann gravity, drag, user applied

505 views • 3 slides
Chapter 15 Recursion CS1: Java Programming Colorado State University Original slides by Daniel

Chapter 15 Recursion CS1: Java Programming Colorado State University Original slides by Daniel

Chapter 15 Recursion CS1: Java Programming Colorado State University Original slides by Daniel Liang Modified slides by Kris Brown Liang, Introduction to Java Programming, Tenth Edition, (c) 2013 Pearson Education, Inc. All 1 rights reserved.

3.08k views • 53 slides
Building Java Programs Chapter 3 Lecture 6: Graphics Reading: Supplement 3G 2 Objects

Building Java Programs Chapter 3 Lecture 6: Graphics Reading: Supplement 3G 2 Objects

Building Java Programs Chapter 3 Lecture 6: Graphics Reading: Supplement 3G 2 Objects (briefly) object: An entity that contains data and behavior. data : variables inside the object behavior : methods inside the object You

373 views • 16 slides
Chapter 8 PowerPoint Creating Slides General Instructions: 1. Read the text thoroughly. 2.

Chapter 8 PowerPoint Creating Slides General Instructions: 1. Read the text thoroughly. 2.

Chapter 8 PowerPoint Creating Slides General Instructions: 1. Read the text thoroughly. 2. This chapter is for practical practice only. SmartArt allows you to communicate information with graphics instead of just using text. There are a

557 views • 13 slides
Animations Animations with Timers Double Buffering 1 CS 349 - Animations Animation A

Animations Animations with Timers Double Buffering 1 CS 349 - Animations Animation A

Animations Animations with Timers Double Buffering 1 CS 349 - Animations Animation A simulation of movement created by displaying a series of pictures, or frames. Animation: drawing frames at a consistent rate . Goals: Move

350 views • 13 slides
Practical Animation Reconstruction Hao Li Local Shape Matching: Advanced Animation Reconstruction

Practical Animation Reconstruction Hao Li Local Shape Matching: Advanced Animation Reconstruction

Practical Animation Reconstruction Hao Li Local Shape Matching: Advanced Animation Reconstruction Correspondence Problem Classification How many meshes? More than two: multi-view registration Initial registration available? Yes: Local

1.63k views • 141 slides
Web Technologies and Course Content Applications Introduction Databases & WWW

Web Technologies and Course Content Applications Introduction Databases & WWW

Web Technologies and Course Content Applications Introduction Databases & WWW Internet and WWW SGML / XML Winter 2001 Protocols Managing servers HTML and beyond Search Engines CMPUT 499: Animation and

294 views • 6 slides

More recommend