Difference between revisions of "Project6Fall11"

From Immersive Visualization Lab Wiki
Jump to: navigation, search
(Instructions for Creating a Surface of Revolution with Bezier Curves)
(Approach)
 
(5 intermediate revisions by one user not shown)
Line 11: Line 11:
 
You have been tasked by UCSD's administration to submit a design of a TV tower for UCSD. It is supposed to be built on the green in front of Warren Lecture Halls, and its observation deck is going to house brand new computer labs for CSE students. To serve its purpose as a TV tower, it needs to have a tall antenna on its top.  
 
You have been tasked by UCSD's administration to submit a design of a TV tower for UCSD. It is supposed to be built on the green in front of Warren Lecture Halls, and its observation deck is going to house brand new computer labs for CSE students. To serve its purpose as a TV tower, it needs to have a tall antenna on its top.  
  
Use your knowledge about surfaces of revolution and Bezier curves to create a design for the TV tower. You need to texture the surface of the TV tower at least with this [[Media::concrete.ppm | concrete texture]]. Use the following settings for your texture after your first <tt>glBindTexture</tt> for correct lighting, filtering, and to enable texture repeat mode:
+
Use your knowledge about surfaces of revolution and Bezier curves to create a design for the TV tower. You need to texture the surface of the TV tower at least with this [[Media:concrete.ppm | concrete texture]]. Use the following settings for your texture after your first <tt>glBindTexture</tt> for correct lighting, filtering, and to enable texture repeat mode:
  
 
<pre>
 
<pre>
Line 57: Line 57:
 
* Index array for triangle/quad vertices
 
* Index array for triangle/quad vertices
  
<b>Tip:</b> Try this [http://www.cs.princeton.edu/~min/cs426/jar/bezier.html interactive Java applet] which will let you set control points and show the curves they generate.  You can turn on the C1 continuity hint to see where your next control point should go to have C1 continuity (i.e., a smooth connection between two curves).
+
<b>Tip:</b> This [http://www.cs.princeton.edu/~min/cs426/jar/bezier.html interactive Java applet] will let you visually set control points and show the curves they generate.  You can turn on the C1 continuity hint to see where your next control point should go to have C1 continuity (i.e., a smooth connection between two curves). The app conveniently displays the control point coordinates numerically so that you can copy them right into your code. Note: some web browsers do not allow you to copy the values directly from the web page, so please try this out before you design the perfect curve.
  
 
==2. Add a Flag (<b>40 points</b>)==
 
==2. Add a Flag (<b>40 points</b>)==
Line 67: Line 67:
 
Create a textured cubic Bezier surface patch for the flag:
 
Create a textured cubic Bezier surface patch for the flag:
  
* Create a cubic Bezier patch with a roughly square surface area and uniform tessellation to produce a triangle mesh of sufficiently high resolution for the expected curvature. (<b>15 points</b>)
+
* Create a cubic Bezier patch with a roughly square surface area and uniform tessellation to produce a triangle mesh of sufficiently high resolution for the expected curvature. [http://www.nbb.cornell.edu/neurobio/land/OldStudentProjects/cs490-96to97/anson/BezierPatchApplet/ This Java app] might help, but unfortunately does not display the control points numerically. (<b>15 points</b>)
 
* Compute the normals as the cross product of the partial derivatives at each vertex. (<b>10 points</b>)
 
* Compute the normals as the cross product of the partial derivatives at each vertex. (<b>10 points</b>)
 
* Assign texture coordinates to the mesh vertices using the parameter values and map the texture to the Bezier patch. (<b>10 points</b>)
 
* Assign texture coordinates to the mesh vertices using the parameter values and map the texture to the Bezier patch. (<b>10 points</b>)
 
* Tweak the control points and the position of the light source(s), so that the curvature of the patch is clearly visible. (<b>5 points</b>)
 
* Tweak the control points and the position of the light source(s), so that the curvature of the patch is clearly visible. (<b>5 points</b>)
  
==3. Optional: Add Wind (<b>10 points</b>)==
+
Note: The texture for the flag will be in addition to that of the tower. In order to distinguish between the two textures at rendering time you are going to need to use the <tt>glBindTexture(GL_TEXTURE_2D, texture_id)</tt> command. <tt>texture_id</tt> is a unique ID for each texture, generated by the <tt>glGenTextures</tt> command.
  
Make the flag look like it waves in the wind.
+
==3. Optional: Wind (<b>10 points</b>)==
  
* Add another Bezier patch to the right of the previous one and connect it seamlessly to the first, to allow for more interesting waving patterns. (<b>3 points</b>)
+
You are invited to give a live demonstration of your 3D model to the selection committee and decide that it would look great if the flag looked like it was waving in the wind. In order to achieve this effect, you need to take the following steps:
* Use a custom flag texture which is wider than the given UCSD logo to match the larger size of the Bezier patches. (<b>2 points</b>)
+
 
* Wave the flag in the wind: Use simple functions (e.g., sin, cos) to move the control points in order to make the flag appear to wave in wind. Use [http://www.cplusplus.com/reference/clibrary/cstdlib/rand/ random numbers] where appropriate to make the motion less repetitive. Do not move the two interpolating control points at the end where the flag is attached to the antenna mast. (<b>3 points</b>)
+
* Add another Bezier patch to one side (horizontally or vertically) of the previous one and connect it seamlessly to the first, to allow for more interesting waving patterns. (<b>3 points</b>)
* Support the number keys (1-9) to change the wind speed from slow to fast, which should at the least speed up the waving, but could even change your waving function. (<b>2 points</b>)
+
* Use a custom flag texture which is wider/taller than the given one to match the new aspect ratio of the two connected Bezier patches. (<b>2 points</b>)
 +
* Wave the flag in the wind: Use smooth mathematical functions (e.g., sin, cos) to move the control points in order to make the flag appear to wave in wind. Use [http://www.cplusplus.com/reference/clibrary/cstdlib/rand/ random numbers] where appropriate to make the motion less repetitive. Do not move the two interpolating control points at the end where the flag is attached to the antenna mast. (<b>3 points</b>)
 +
* Support the number keys 1 through 9 to change the wind speed from slow to fast, which should speed up the waving, but could even change your waving function to create an increasingly more dramatic effect with increasing wind speed. (<b>2 points</b>)

Latest revision as of 00:50, 18 November 2011

Contents

Project 6: Bezier Curves

In this project you will create geometry with Bezier curves and patches. This project is due on Friday, November 18th. The assignment will be introduced in the lab by Jorge on Monday, November 7th.

1. Create a TV Tower with Bezier Curves (60 points)

TV towers are tall, skinny towers which are erected to send radio, TV, and other wireless signals over a long distance. Many TV towers have been built with observation decks high above ground. Here are a few examples:

Almaty.jpgBaku.jpgBerlin.jpgDoordarshan.jpgJested.jpgOstankino.jpgShanghai.jpgStuttgart.jpgTallinn.jpgThessaloniki.jpgTianjin.jpgVilnius.jpg

You have been tasked by UCSD's administration to submit a design of a TV tower for UCSD. It is supposed to be built on the green in front of Warren Lecture Halls, and its observation deck is going to house brand new computer labs for CSE students. To serve its purpose as a TV tower, it needs to have a tall antenna on its top.

Use your knowledge about surfaces of revolution and Bezier curves to create a design for the TV tower. You need to texture the surface of the TV tower at least with this concrete texture. Use the following settings for your texture after your first glBindTexture for correct lighting, filtering, and to enable texture repeat mode:

// Select GL_MODULATE to mix texture with color for shading:
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);

// Use bilinear filtering:
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

// Wrap texture over at the edges:
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

Place at least one directional light source in world coordinates, and integrate your trackball rotation function to spin the tower around. Rotations of the tower should not rotate the light source.

Note:Do not use any of the curve generating OpenGL routines for this assignment (i.e., glMap, glEvalCoord, glMapGrid, glEvalMesh, gluNurbsCurve).

Instructions for Creating a Surface of Revolution with Bezier Curves

You will need to create a function which generates a surface of revolution with a set of Bezier curves. You can read up on surfaces of revolution at | Mathworld or at | Wikipedia. The main idea to generate a surface of revolution is to define a 2D curve in the x/y plane, called the generatrix, which is then rotated around the y axis to produce the surface. You should use a piecewise cubic Bezier curve as the generatrix, with at least three pieces.

To produce a mesh of triangles or quads:

  • Create a set of control points for the cubic Bezier generatrix which will create the object outline. The curve should be C1 continuous between its pieces. (15 points)
  • Evaluate a number of sample points along the curve in the x/y plane. (15 points)
  • Rotate the points around the y axis at a set of angles, and connect the resulting points to a mesh of triangles or quads (10 points). The mesh needs to be closed (no gaps) (5 points).
  • Generate normals and texture coordinates at the mesh vertices. The texture coordinates should cover a range much greater than 0 to 1 so that the texture gets repeated several times to create the effect of a higher resolution texture. (15 points)

You can compute normals as follows: Given the generatrix curve (x(t),y(t),0) in the x/y plane, you first compute the tangent vector (x'(t),y'(t),0). The corresponding 3D normal vector is then (-y'(t),x'(t),0), which you rotate around the y axis similar to the vertices. Don't forget to normalize the normal vectors. For the texture coordinates u/v, you can use the curve parameter t at each vertex as the u parameter. The v parameter at each vertex is proportional to the rotation angle around the y axis you applied to get the vertex.

Your function to produce the surface of revolution should have the following input and output parameters:

Input:

  • Number n of Bezier segments
  • Array of Bezier control points in the x/y plane, i.e. (xi, yi, 0). For n cubic segments, you will need (n-1)*3+4 control points.
  • Number of points to evaluate along the curve.
  • Angle increment for a full 360 degree rotation.

Output:

  • Array of vertices
  • Array of normal vectors
  • Array of texture coordinates
  • Index array for triangle/quad vertices

Tip: This interactive Java applet will let you visually set control points and show the curves they generate. You can turn on the C1 continuity hint to see where your next control point should go to have C1 continuity (i.e., a smooth connection between two curves). The app conveniently displays the control point coordinates numerically so that you can copy them right into your code. Note: some web browsers do not allow you to copy the values directly from the web page, so please try this out before you design the perfect curve.

2. Add a Flag (40 points)

You decide that your TV tower proposal would have better chances at winning if there was a flag with the UCSD logo attached to its antenna mast, above the observation deck(s). You can use a different flag texture if you choose.

Approach

Create a textured cubic Bezier surface patch for the flag:

  • Create a cubic Bezier patch with a roughly square surface area and uniform tessellation to produce a triangle mesh of sufficiently high resolution for the expected curvature. This Java app might help, but unfortunately does not display the control points numerically. (15 points)
  • Compute the normals as the cross product of the partial derivatives at each vertex. (10 points)
  • Assign texture coordinates to the mesh vertices using the parameter values and map the texture to the Bezier patch. (10 points)
  • Tweak the control points and the position of the light source(s), so that the curvature of the patch is clearly visible. (5 points)

Note: The texture for the flag will be in addition to that of the tower. In order to distinguish between the two textures at rendering time you are going to need to use the glBindTexture(GL_TEXTURE_2D, texture_id) command. texture_id is a unique ID for each texture, generated by the glGenTextures command.

3. Optional: Wind (10 points)

You are invited to give a live demonstration of your 3D model to the selection committee and decide that it would look great if the flag looked like it was waving in the wind. In order to achieve this effect, you need to take the following steps:

  • Add another Bezier patch to one side (horizontally or vertically) of the previous one and connect it seamlessly to the first, to allow for more interesting waving patterns. (3 points)
  • Use a custom flag texture which is wider/taller than the given one to match the new aspect ratio of the two connected Bezier patches. (2 points)
  • Wave the flag in the wind: Use smooth mathematical functions (e.g., sin, cos) to move the control points in order to make the flag appear to wave in wind. Use random numbers where appropriate to make the motion less repetitive. Do not move the two interpolating control points at the end where the flag is attached to the antenna mast. (3 points)
  • Support the number keys 1 through 9 to change the wind speed from slow to fast, which should speed up the waving, but could even change your waving function to create an increasingly more dramatic effect with increasing wind speed. (2 points)