2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons,...
-
Upload
vernon-neal -
Category
Documents
-
view
213 -
download
0
Transcript of 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons,...
![Page 1: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/1.jpg)
![Page 2: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/2.jpg)
2
![Page 3: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/3.jpg)
Many picture books and graphic novels with dynamic and interesting styles
For commercial reasons, publishers create derivative digital products including animation and games
When digitising these books for animation or games backgrounds and scenes are just static images, which appear instantaneously or through fading
The entertainment industry is asking for alternatives
![Page 4: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/4.jpg)
Commercial opportunity as Case Study:Bo children's book series Bo = transparent piglet aimed at ages 4-6 teach children how to
deal with emotions multiple traditional
painting techniques Recreate scenes from the book the way that the artist
made them unique recreation of the visual style to visualise the progression of the story/game
(as the player continues, more and more is revealed)
![Page 5: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/5.jpg)
Tools to allow artists to quickly and intuitively create and animate hand-painted scenes
capturing the way an artist creates his picture books allowing traditional hand-painted strokes to be generated digitally Real-time animated recreation of hand-painted scenes
running on mobile devices animated recreation of captured scenes
(e.g., stroke by stroke) optimisation for mobile devices Integration in existing (game) engine Unity3D
![Page 6: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/6.jpg)
6
![Page 7: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/7.jpg)
Physical simulation
![Page 8: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/8.jpg)
Non-photorealistic Rendering (NPR)
![Page 9: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/9.jpg)
Raster graphics
![Page 10: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/10.jpg)
Raster graphics
![Page 11: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/11.jpg)
Trade-off Accuracy
indistinguishable from reality
Performance speed of recreating captured data
Animatability ability to animate stroke by stroke drawing from start to finish
Changeability flexibility when designing (e.g., moving drawn strokes)
Artistic freedom
![Page 12: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/12.jpg)
Immediate Mode Rendering (IMR) < PC graphics industry
forward facing polygon -> rendered -> shaded -> textured -> Z-buffer -> frame buffer
(most) android devices
Tile-Based Deferred Rendering (TBDR) < PowerVR architecture
tile based (parallel) + deferred rendering (hidden surface removal)
all Apple mobile devices
![Page 13: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/13.jpg)
Original plan Raster graphics and TBDR Bad benchmarking test: ARM + PowerVR architecture
write-to-texture operations not efficient for pixel-based strokes
Mesh-based Strokes Combination of NPR and raster graphics
Creation: strokes are flat meshes approximating the contour of brush strokes
Colouring using textures: GPU shader program
Allows for fast rendering of meshes on the GPU
![Page 14: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/14.jpg)
14
![Page 15: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/15.jpg)
Main characteristics Rubber paint roller for background elements Paper cut stencils for adding details Scanned paintings for animals and insects Blending for the final composition
![Page 16: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/16.jpg)
Sampling of input points (< digital tablet) Pressure determines width Boundaries determine geometry of brush footprint Fading out of paint Use uv-coordinates as a length-parameter to determine start
and end of the stroke as a shader has no context
![Page 17: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/17.jpg)
General fading out supported by base stroke Background consist of transparant, slowly fading strokes new parameters: fade offset + fade multiplier Unique strokes create wide texture using two dollops of paint for each stroke randomly select narrow band from texture
![Page 18: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/18.jpg)
Pattern of white dots when rolling back and forth in a fanning pattern
due to the relief created by the paint itself as thin layers of dried paint on the surface of the roller prevent paint in between from touching the paper
Employ a black and white mask white representing spots where the paint should adhere,
black where it doesn’t add mask as texture and multiply
![Page 19: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/19.jpg)
Create effect of individual blades of grass artist: achieved by ripping of a corner of paper, dipping it in
paint and dragging it over the canvas tool: mask with transparent inside and grass-like outside is
stretched over the length of the stroke
![Page 20: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/20.jpg)
Using masks and additional parameters Oily brush Stencil roller brush Stamp brushes
![Page 21: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/21.jpg)
21
![Page 22: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/22.jpg)
Management of brushes, preview canvas…
![Page 23: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/23.jpg)
Painting, timeline, recording functionality…
![Page 24: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/24.jpg)
24
![Page 25: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/25.jpg)
![Page 26: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/26.jpg)
60 strokes 4500 vertices 2400 triangles
![Page 27: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/27.jpg)
150 strokes 3600 vertices 2300 triangles
![Page 28: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/28.jpg)
iPad2 Initially frame rate dropped from 60 fps to 5 fps
due to overdraw of transparent strokes: cover significant amount of the screen and, hence, there is much overlap
![Page 29: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/29.jpg)
Render-to-texture (RTT) render to image first i.o. rendering to screen
drawback: background is flattened
RTT for strokes that have been drawn completely and need not to be animated anymore do this for every 10-20 new strokes Consistent frame rate of 60 fps
![Page 30: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/30.jpg)
![Page 31: 2 Many picture books and graphic novels with dynamic and interesting styles For commercial reasons, publishers create derivative digital products including.](https://reader030.fdocuments.us/reader030/viewer/2022032803/56649e355503460f94b233ff/html5/thumbnails/31.jpg)