http://nameless.cis.udel.edu/class_wiki/index.php?title=CISC440_S2022_HW4&feed=atom&action=historyCISC440 S2022 HW4 - Revision history2024-03-28T15:37:52ZRevision history for this page on the wikiMediaWiki 1.28.0http://nameless.cis.udel.edu/class_wiki/index.php?title=CISC440_S2022_HW4&diff=2324&oldid=prevCer at 15:01, 19 April 20222022-04-19T15:01:39Z<p></p>
<table class="diff diff-contentalign-left" data-mw="interface">
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;' lang='en'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">← Older revision</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">Revision as of 15:01, 19 April 2022</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l1" >Line 1:</td>
<td colspan="2" class="diff-lineno">Line 1:</td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>''Due <del class="diffchange diffchange-inline">Tuesday</del>, <del class="diffchange diffchange-inline">April 26</del>''  </div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>''Due <ins class="diffchange diffchange-inline">Sunday</ins>, <ins class="diffchange diffchange-inline">May 1</ins>''  </div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==Description==</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==Description==</div></td></tr>
</table>Cerhttp://nameless.cis.udel.edu/class_wiki/index.php?title=CISC440_S2022_HW4&diff=2321&oldid=prevCer: /* Required elements */2022-04-19T14:23:15Z<p><span dir="auto"><span class="autocomment">Required elements</span></span></p>
<table class="diff diff-contentalign-left" data-mw="interface">
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;' lang='en'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">← Older revision</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">Revision as of 14:23, 19 April 2022</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l7" >Line 7:</td>
<td colspan="2" class="diff-lineno">Line 7:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==Required elements==</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==Required elements==</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>* In Blender, create and texture an object and export it as an .obj that is loadable by your OpenGL program [<del class="diffchange diffchange-inline">5 </del>points]</div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>* In Blender, create and texture an object and export it as an .obj that is loadable by your OpenGL program [<ins class="diffchange diffchange-inline">6 </ins>points]</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** The object may not be a default mesh in Blender such as a plane, monkey, cylinder, or sphere.  Rather, it should be an edited version such as the [https://www.youtube.com/watch?v=iEVAGnR2GRQ apple created in this tutorial] or the [https://www.youtube.com/watch?v=rBffAMQh1Qc cube manipulations here]</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** The object may not be a default mesh in Blender such as a plane, monkey, cylinder, or sphere.  Rather, it should be an edited version such as the [https://www.youtube.com/watch?v=iEVAGnR2GRQ apple created in this tutorial] or the [https://www.youtube.com/watch?v=rBffAMQh1Qc cube manipulations here]</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** Apply at least one texture to the object either through [https://www.youtube.com/watch?v=6F5M0ZuL-eg wrapping] or [https://www.youtube.com/watch?v=JX-UwgKaPsA painting] and save the resulting .obj</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** Apply at least one texture to the object either through [https://www.youtube.com/watch?v=6F5M0ZuL-eg wrapping] or [https://www.youtube.com/watch?v=JX-UwgKaPsA painting] and save the resulting .obj</div></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>* In your C++ OpenGL program, load the .obj and animate a camera path that shows it from different angles and distances, calling glm::lookat() to recompute the view matrix at every step  [<del class="diffchange diffchange-inline">7 </del>points]</div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>* In your C++ OpenGL program, load the .obj and animate a camera path that shows it from different angles and distances, calling glm::lookat() to recompute the view matrix at every step  [<ins class="diffchange diffchange-inline">6 </ins>points]</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** Your camera path should be created from a Catmull-Rom cubic spline.  All control points should be chosen by you and hard-coded your program as an array of at least 25 3-D positions.</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** Your camera path should be created from a Catmull-Rom cubic spline.  All control points should be chosen by you and hard-coded your program as an array of at least 25 3-D positions.</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** The camera path should be displayed initially as a continuous curve (i.e., connected line segments).  So it should be computed outside of your animation loop</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>** The camera path should be displayed initially as a continuous curve (i.e., connected line segments).  So it should be computed outside of your animation loop</div></td></tr>
</table>Cerhttp://nameless.cis.udel.edu/class_wiki/index.php?title=CISC440_S2022_HW4&diff=2320&oldid=prevCer: /* Graduate students only */2022-04-19T14:20:17Z<p><span dir="auto"><span class="autocomment">Graduate students only</span></span></p>
<table class="diff diff-contentalign-left" data-mw="interface">
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;' lang='en'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">← Older revision</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">Revision as of 14:20, 19 April 2022</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l21" >Line 21:</td>
<td colspan="2" class="diff-lineno">Line 21:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==Graduate students only==</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==Graduate students only==</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;"><!--</del></div></td><td colspan="2"> </td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* Add a square textured "floor" to your scene which animates a morph between two face images.  You should use the mesh-warping algorithm introduced in class and described in further detail in Section 2.1 of [http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.7.9782&rep=rep1&type=pdf Wolberg, "Recent Advances in Image Morphing", 2003].   </div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* Add a square textured "floor" to your scene which animates a morph between two face images.  You should use the mesh-warping algorithm introduced in class and described in further detail in Section 2.1 of [http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.7.9782&rep=rep1&type=pdf Wolberg, "Recent Advances in Image Morphing", 2003].   </div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* The 'f' key should toggle between whatever center point you are using for glm::lookat() during the normal camera animation, and looking at the center of the morph square (even as the camera continues to move)</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* The 'f' key should toggle between whatever center point you are using for glm::lookat() during the normal camera animation, and looking at the center of the morph square (even as the camera continues to move)</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* The morph should take about 5 seconds to complete and then repeat</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* The morph should take about 5 seconds to complete and then repeat</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* The face images can have any names, and it is up to you to determine the matching points in the meshes so that the morph looks as good as possible.  The paper appears to use 7 x 7 meshes, so please do the same</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>* The face images can have any names, and it is up to you to determine the matching points in the meshes so that the morph looks as good as possible.  The paper appears to use 7 x 7 meshes, so please do the same</div></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">--></del></div></td><td colspan="2"> </td></tr>
</table>Cerhttp://nameless.cis.udel.edu/class_wiki/index.php?title=CISC440_S2022_HW4&diff=2314&oldid=prevCer: Created page with "''Due Tuesday, April 26'' ==Description== In this assignment you will create and texture an object (loosely defined) in [https://www.blender.org/ Blender], then display it..."2022-04-14T13:50:40Z<p>Created page with "''Due Tuesday, April 26'' ==Description== In this assignment you will create and texture an object (loosely defined) in [https://www.blender.org/ Blender], then display it..."</p>
<p><b>New page</b></p><div>''Due Tuesday, April 26'' <br />
<br />
==Description==<br />
<br />
In this assignment you will create and texture an object (loosely defined) in [https://www.blender.org/ Blender], then display it in an OpenGL program which animates camera motion along a Catmull-Rom spline.<br />
<br />
==Required elements==<br />
<br />
* In Blender, create and texture an object and export it as an .obj that is loadable by your OpenGL program [5 points]<br />
** The object may not be a default mesh in Blender such as a plane, monkey, cylinder, or sphere. Rather, it should be an edited version such as the [https://www.youtube.com/watch?v=iEVAGnR2GRQ apple created in this tutorial] or the [https://www.youtube.com/watch?v=rBffAMQh1Qc cube manipulations here]<br />
** Apply at least one texture to the object either through [https://www.youtube.com/watch?v=6F5M0ZuL-eg wrapping] or [https://www.youtube.com/watch?v=JX-UwgKaPsA painting] and save the resulting .obj<br />
* In your C++ OpenGL program, load the .obj and animate a camera path that shows it from different angles and distances, calling glm::lookat() to recompute the view matrix at every step [7 points]<br />
** Your camera path should be created from a Catmull-Rom cubic spline. All control points should be chosen by you and hard-coded your program as an array of at least 25 3-D positions.<br />
** The camera path should be displayed initially as a continuous curve (i.e., connected line segments). So it should be computed outside of your animation loop<br />
** The camera position (i.e., the view matrix) should be updated with each pass through the animation loop and the scene redrawn from the new location. Your up vector may remain constant, and your center point (where the camera is looking) may either be fixed to the centroid of the object that you loaded, or it can be updated to "look ahead" of the camera for an architectural walk-through or roller coaster scenario.<br />
** The camera path does not need to be a loop. Regardless, when the last position is reached, the animation should automatically start over at the first position<br />
** The 'p' key should toggle pause/play in the animation. In pause mode the camera should not move<br />
<br />
No particular template code is provided, but you may want to start from [http://www.opengl-tutorial.org/beginners-tutorials/tutorial-7-model-loading/ Tutorial 7: Model Loading]. Submit your C++ code, the textured .obj you created, and a short text description of how you created it.<br />
<br />
==Graduate students only==<br />
<br />
<!--<br />
* Add a square textured "floor" to your scene which animates a morph between two face images. You should use the mesh-warping algorithm introduced in class and described in further detail in Section 2.1 of [http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.7.9782&rep=rep1&type=pdf Wolberg, "Recent Advances in Image Morphing", 2003]. <br />
* The 'f' key should toggle between whatever center point you are using for glm::lookat() during the normal camera animation, and looking at the center of the morph square (even as the camera continues to move)<br />
* The morph should take about 5 seconds to complete and then repeat<br />
* The face images can have any names, and it is up to you to determine the matching points in the meshes so that the morph looks as good as possible. The paper appears to use 7 x 7 meshes, so please do the same<br />
--></div>Cer