32
• 1- hw Lena image rotate. • 2- study opengl history softly. wikipedia.. • next week monday quiz.. abbreviations, and their relations. from recent history backward. • http://www-inst.cs.berkeley.edu/ ~cs184/sp15/

1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

Embed Size (px)

Citation preview

Page 1: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• 1- hw Lena image rotate.

• 2- study opengl history softly. wikipedia..

• next week monday quiz.. abbreviations, and their relations. from recent history backward.

• http://www-inst.cs.berkeley.edu/~cs184/sp15/

Page 2: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

The word photography came from two Greek

words that mean "writing with light." The first time the word "photography" was used was in 1839, the year the invention of

the photographic process was made public, by Sir John

Herschel.

Page 3: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

The Chinese were the first people that we know of to write about the basic idea of the pinhole camera or

"camera obscura" (Latin words meaning "dark room"). About 2,500 years ago (5th Century B.C.) they wrote

about how an image was formed upside down on a wall from a pinhole on the opposite wall.

Page 4: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

About 2,400 years ago (4th Century B.C.) the famous philosopher

Aristotle talked about a pinhole image

formation in his work. He wondered why "when light shines

through a rectangular peep-hole, it appears

circular in the form of a cone?" He didn't find

an answer to his question and the problem wasn't

answered until about 2,000 years later in the

1500s.

Page 5: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

In the 1500s many artists, including Michelangelo and Leonardo da Vinci, used the "camera obscura" to help

them draw pictures. A person or object would be outside the dark room and their image was reflected on a piece

of paper and the artist would trace it.

Page 6: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

This is a drawing of a camera obscura done in 1646. This drawing shows an outer shell with lenses in the center of each wall and an inner shell with transparent paper for drawing. The

artist needed to enter by a trap door in the bottom.

Page 7: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

Here the painting is "View of Delft" by Jan van der Meer (Jan Vermeer), ~1660, His painting known for "camera-like" detail

and quality. 150 years earlier then the invention of the camera, the camera obscura is employed. .

 

 !

Page 8: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

The camera obscura is believed to be used in this painting. Jan Vermeer painted this in 1665. 

Page 9: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

 The camera obscura was made portable by the 1700s by putting it in a box with a pinhole on one side and a glass screen on the other. Light coming through this pinhole projected an image onto the glass screen,

where the artist could easily trace it by hand. Artists soon discovered that they could obtain an even sharper

image by using a small lens in place of the pinhole.

Page 10: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• many resources are available, • even in youtube, • concentration will be on 3D computer graphics..

• assignments your own computer graphics programs.

• lightening.. rastering, and rendering.. Google search for spherical?? harmonic lighting and

• a technique that's very widely used today in 3D computer graphics and most recent video games, and

• many recent movies utilize some versions of that.

• It's also being used for example by Adobe for relighting and trying to relight images.

• adobe.. • ill conditioned problem.. is shading must be an np-complete

problem.. ??.. prove that it is np..• or many reconstruction algorithms likewise.

Page 11: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• realistic imaging. – image analysis and determining the structural

objects, and registering them to their correct position, is the problem of image processing and computer vision, and redcuing it it primitives..

– a variety of topics in computer graphics image synthesis, another 10-20 years to go..

• rendering: how do you create realistic images: – acquire images from the real world to create realistic

visual appearance of objects. – simulate the realistic beauty and appearance of the

real world.

Page 12: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• journal on computer graphics.. ACM SIGGRAPH

• two main goals. • 1- writing in the systems level.

– programing in 3D computer graphics and write your own 3D graphics programs. both real-time graphics programs using OpenGL, which is a graphics API.

– OpenGL shading language.– a real time scene viewer. – develop programs off line for a technique known as ray tracing, which will

enable you to create realistic images of 3D scenes, from 2D.• 2- the theory of computer graphics, in particular the mathematical

techniques and the algorithms that underlie most of modern 3D graphics systems.

• also possible utilizing but not here, – specifics of a particular 3D graphics programming environment like Maya,

DirectX etc. – However, better writing programs in Open GL and the GL shading language

to undrstand the concepts.

• programs should be portable to other systems, op independent, and web applications, java, python.

Page 13: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• applications the movies.– Pixar's recent Brave film.– 3D video games,

• and over the years the visual quality increased to the point that many times they are now close to movie quality in some ways. In industry, – molding, 3d molding, various components cars, – 3d printing, – boing airplane, and nasa, completely simulated on the computer, – computer aided design with lighting effects one very important area in computer

graphics and it's an aspect of realistic image synthesis. – interiors of buildings, interiors of rooms will look. – Autocad.

**********• scientific visualization as well as medical visualization.*************

– Medical applications. Visible Human Project. – Virtual reality systems where you combine the real with the virtual.– Flight simulators and so forth.

• computer graphics is an integral part of surroundings mathematically integral and functionally.

• so integral and integrating part of our life.. • From the text, to postscript, to the images, to the video.• all these gradually evolved from the text, to the typical visual media we've

consumed Flickr. -YouTube.WebGL.

Page 14: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• the next wave in media is 3D geometric models. shadowing, texture, and interaction of such.. Nonlinear relations. – Adobe was one of the first graphics companies (foundational) to the way we handle

images and video. – Blured distinction between real and virtual worlds. – Google Earth, very realistic flythroughs of the real world. – virtual world can be a treatment in psychiatry in which actors and people actually

work. – Electronic publishing, – online gaming is nowadays a huge market and is perhaps the biggest driver of

games.– 3d printing for orthopedics, skull.

• The technical and intellectual challenges. – on the mathematics of 3D computer graphics, – an object and position it correctly on the screen, – drawing surfaces that can be used in 3D computer graphics, will be starting the

mathematics for all of these different aspects. – lighining an object correctly? – How to place light sources and the smooth shading on it properly?

• Requires an understanding of the physics of lighting and shading. How are objects lit in the real world?

• And there are deep system challenges. – How do we build 3D graphics programming software and hardware? – 3D graphics hardware graphic processors, widely beyond the need of computer

graphics.

Page 15: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• The graphics pipeline consists of 3 stages: • modeling, animation and rendering.

• modeling is the process of creating geometric models of objects, a simple model of an object like a teapot, a complicated mesh of an object like a cat sculpture, a 2 billion polygon mesh of Michelangelo's David that was scanned several years ago by Professor Levoy and collaborators.

• animation: objects moving the animation, or the motion of character, often vibrant humanoid motion, want motion of objects from one place to another.

• rendering or creating realistic images, given the geometry and the animation.

• simulate the way the light propagates in the scene to create effects like realistic and intricate shadow details, such as what you see in images on the right.

Page 16: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• These are fundamentally two different ways in which you can create images.

• Rasterization essentially goes through all the geometric primitives and dertermines where in the screen they should go.

• Raytracing does the opposite thing which goes to each point or each pixel in the screen and determines which geometric primitive that corresponds to.

• each have pros and cons, namely raytracing can produce higher quality images, but has historically been slower.

• We'll talk about the distinctions between them later in the course.

• Homeworks will cover the ways in which you can create images of the same screen, same scene using both raytracing and rasterization.

Page 17: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• The skeleton code, in C++, Open GL, GLSL for Homework 1

• Next you will write a raytracer from scratch.

• Need programming background, in C, C++ or Java. The language doesn't matter that much.

• Java and python will be adopted.

Page 18: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• "computer graphics" coined by William Fetter of Boeing in 1960.

• CD systems the mid 1950s, the US Air Force SAGE radar systems, and they were based in the development at MIT.

• Alan Turing's biography, the Manchester Mark I, the future potential of computers. Chess playing machines, even compilers, to high level programming languages,

• but somehow even the notion of (as graphical entity) text escapes him.

• instead bank of LEDs, actual textual displays, has been a major advance,

• 1970ies, creating a smooth shaded geometry on the screen of shaded was some of the very interesting early problems in 2D computer graphics.

Page 19: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• 1- First major breakthrough with the textual representations but they haven't been the widespread usage for many decades.

• 2- second, major breakthrough was the the graphical user interface of Xerox Palo Alto Research Center around 1975.

• First apperance was in the Apple Macintosh, and subsequently, became a standard for computers anywhere.

• Ivan Sutherland's sketch pad system, developed in MIT in 1960s, that can be considered as the first interactive computer graphics system, and it is the first PHD thesis in computer graphics.

• Drawing was one of the early applications of computer graphics. , the concepts for drawing in current systems, constraint based drawing, hierarchical modeling.

Page 20: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• The development of paint systems, SuperPaint system, which was developed by Richard Shoup and Alvy Ray Smith at Xerox's Palo Alto research center in the 1970s.

• SuperPaint system presages modern softwares, like Adobe Photoshop.

• Image processing has been a very significant aspect of graphical application in media.

• Altering images by cropping, scaling, compositing them. • Add or remove objects.

• Sports broadcasting combining multi-dimensionality and modality, in 2D and 3D. Smart image and video processing.

Page 21: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• Geometric modeling is the process of creating 3D geometry, which can then be used in a computer graphics system.

• '70s and '80s, one of the major developments is the creation of spline curves and surfaces.

• And these were geometric methods that enabled the Utah Teapot, as it's known, to be created.

• the teapot has lots of interesting geometry. • It's not a genus 0 surface. It has one handle, a

spout and all of which could be developed with spline models.

Page 22: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• Digital Michelangelo Project, by Professor Levoy at Stanford: were scans of many of the 2 billion polygonal model of the Davids.

• 1960's the challenge was handling visibility. • Hidden line algorithms, hidden surface algorithms.• ***************************• Two cube drawings, which corner is closer.. depth.. • no real way of interpreting which object or corner is in front of each

other.• *****************• And this is a challenge in art as well to create images that convey the

notion of depth perception.• ******************• perceiving the depth, the hidden line, surface elimination was a problem

in the 1960s, and Roberts and Appel. • Which object is before which object.

• Sutherland's paper, 1974, where he reduces visibility to • 1- sorting and • 2- compared a number of different visibility algorithms in this way.

Page 23: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• next coloring the objects. Just colored them in a constant color. polygonial, coloring

• 1970s smooth shaded image of this geometry was a challenge. – Gouraud shading. It's still used in OpenGL today. Images a lot smoother,

like real curved surfaces, matte, or clay, still just a constant color. – Phong shading, and illumination: the notion of specular lighting, enabled the

use of highlights, appearance is much more realistic, a plastic appearance of a diffuse, or body color component and the specular highlight. 80's and 90's,

• The next challenge was known as global illumination.

• The rendering equation, a unified way dealing with many of the visual phenomena, Kajiya, 1986 introduced something, from ray tracing or radiosity.

• The first recursive ray-tracing algorithm, Turner Whitted, 1980. • The second revolution was the radiosity, simulating the interaction

between the wall and one of the boxes as a chain of reflections.• The Cornell Box developed at Cornell University.

• 80's and 90's involved ways to solve the rendering equation. And this challenge to consider global illumination of light from everywhere in the scene, remains a challenge to the current day.

Page 24: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• vectors to store offsets, displacements and locations• x,y,z orthogonal orthonormal units. Absolute position of a vector

is not an issue.. positions not added as vectors, to add pixel postions, each has implicitly wrt origin.

• V=<vx, vy, vz>..• A vector is supposed to be independent of the origin, can be

translated with respect to itself. Nevertheless, it is very convenient to also represent positions as vectors, and to multiply them as matrices to do various transformations.

• O - operations• O1- operations vector sum, commutative, • V3 = V1 +V2 = v1x+v2x+..+v1z+v2z, • Geometrically the parallelogram rule, calculate diagonal: Take

the vector V2 and translate it, sliding over V1, so that the tail of vector b is attached with the head of vector a.

• O2- Transpose, • O3-vector magnitute • - ||V3|| = V1*V2' = sqrt([v1x .. v1z] * [v2z .. v2z]')

Page 25: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• V = Σ Vi ei;• O4- "•" Scalar prp.. Commutativity, ..

• A•B = ||A|| ||B|| cos(ΘA-ΘB) = ||A|| ||B|| cos(ΘAB) ,

• distributive, A•(B+C) = A•B + A•C• associativity does not make sense - HW -, bcs • A • (B • C) = k•!!C• however, scalability, k(A•B) = kA•B • Θ = arccos(A•B / ( ||A|| ||B|| ) ) = 1/cos(..), • Angle between light source and surface for shading..• Finding projection of one vector on another vectors.. • C = A - B, ||C||2 = ... = ||A||2 + ||B||2 - 2A•B

• ||C||2 = ||A||2+||B||2 - 2cos(ΘAB). .. 1- HW proove.

Page 26: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

O5-cross prd: 'x' or '^'

122131132332

321321

,,

,,,,

bababababababa

bbbbandaaaa

sinvuvu

• Think [i,j,k; a1,a2,a3;b1,b2;b3].

Page 27: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

Extended HW, 1- evalaute associativity,

2- evaluate distributivity and 3- evaluate the validity of the following these

relations.

wvuwvu

wuvuwvu

Page 28: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

cross prd• Scalibility.

• and• parallel vectors should work?.

0u00u

0uu

vcuvucvuc

Page 29: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

coordinate systems• representing points, positions, locations not just your single XYZ ,

many different sets of coordinate systems.• use dot and cross products to create an orthonormal coordinate frame.

• A coordinate system associated with the model, associated with the local coordinates, and associated with the world,

• separate coordinate systems for the each, the head, the shoulder, the torso, the legs, etc.

• And a very important part is to get all of these different objects in their consistent frame of reference. So a critical issue is transforming between these different coordinate systems. Transformations of objects from one to anther one, and respective viewing and the way in which you can use matrices and vectors for that purpose.

• 3 vectors in 3 dimensions, such that the vectors are of unit norm w, u, v, mutually orthogonal to each other that they obey certain operative rules, of course ach one is equal to the product of other two vertors.

Page 30: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• A vector P can be written in terms of its projections onto the principle vectors u, v and w. So, Pu= P • u, Pv= P • v, Pw= P • w.

• P = (P • u) u + (P • v) v + (P • w) w • = (Pu) u + (Pv) v + (Pw) w =

• To construct a coordinate frame:• ||u'|| = ||v'|| = ||w'|| = 1• u • v = v • w = u • w = 0• w = u × v• Take the vector A as the viewing direction, create an orthonormal

basis from this, the second vector B, the direction of the camera.

• Associate the vector w with A and the vector v with B,

• but A and B are neither orthogonal vectors

• nor are they a unit norm, and we also need to find the u vector.

Page 31: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

• In three steps, • 1- Take vector w is equal to A. Assume that one axis is on the

directon of A. – Determine unitary w, that is w'=A/||A||,

• 2- How to get v and u? – determine projection of B on w, dot prd from cosine law, and removing it

from B, and then determine projection of B vertical to w, as v. – use the cross product btw w' and B, determine vertical unitary vector u to

the surface of w' and B. • 3- Normalize u, and then employ cross product again btw w' and u'

to obtain v'.

• notes: • u'=B x w'/(||Bxw'||), this should not be parallel.• v' = u' x w', this is going to fail when the norm, is equal to zero,

that is when b and w are aligned in parallel in which case their cross product is equal to zero, so not possible to create the coordinate frame.

Page 32: 1- hw Lena image rotate. 2- study opengl history softly. wikipedia.. next week monday quiz.. abbreviations, and their relations. from recent history backward

cross prd axb and the dual matrix of vector A

a b b a

a a a a b a b

b b b a b a b

x y z y z y z

a b x y z z x x z

x y z x y y x

*

0

0

0

a a b

a a b

a a b

z y x

a b A b z x y

y x z