450 likes | 574 Views
A Web-based 3D Model of the Ancient Roman Camp Vindonissa. LivingVindonissa: Final Presentation. Dain Cilke Pierce Edwards Jeremy Reed Gabe Tambos Nathan Thompson. The Team. Dain Cilke, Nathan Thompson, Pierce Edwards, Gabe Tambos, Jeremy Reed. Nathan Thompson. LivingVindonissa.
E N D
A Web-based 3D Model of the Ancient Roman Camp Vindonissa LivingVindonissa:Final Presentation Dain Cilke Pierce Edwards Jeremy Reed Gabe Tambos Nathan Thompson
The Team Dain Cilke, Nathan Thompson, Pierce Edwards, Gabe Tambos, Jeremy Reed Nathan Thompson LivingVindonissa
Focus of This Presentation • Project Overview • The Class • Swiss System • The Problem • The Solution • Demonstration • Architecture Nathan Thompson LivingVindonissa
Senior Projects • Composed of 42 Senior Undergraduate Students • All Computer Science Majors • Split up into Teams of Four or Five • A Total of Nine Projects are Under Development • Over 40 Projects Were Proposed This Year • Students Selected Which Project to Pursue Nathan Thompson LivingVindonissa
Swiss Team Prof. Dr. Christoph Holliger Physics Prof. Mario Doulis Industrial Design, Media Arts Marco Rietman Computer Science Hans Peter Wyss Media Arts / Mech. Engineer Nathan Thompson LivingVindonissa
Swiss Team’s System • Institute of Archeology of Canton Aargau Has Been Analyzing Vindonissa for Many Years • Analysis Used to Create 3D OpenGL Model of Site Nathan Thompson LivingVindonissa Nathan Thompson LivingVindonissa
Vindonissa Model • Implemented by Institute of 4D Techonologies • Can be Viewed at on-site on a Stereoscopic Screen • Archeologists can Navigate Model in Realtime • Able to Navigate Model in 3D “Free Fly” View • Can Also Follow Predefined Paths Through Model • Labels and Photographs can be Inserted into Model Nathan Thompson LivingVindonissa
The Problem • Limited Access • Users Must be on-site to See Model • Not Readily Available to All Users • Archeologists Want to Share this Resource • Solution: • LivingVindonissa Nathan Thompson LivingVindonissa
Purpose • WebGL Implementation of Vindonissa Model • Expand Audience • Users From Across the World can Access Model • Information Available to Many Types of Users • Archeologists, Students, Enthusiasts, Etc. Jeremy Reed LivingVindonissa
Environmental Requirements • Software / Development Environment: • WebGL Capable Browser (Chrome 9, etc.) • WebGL • HTML or HTML 5 • CSS 2 • Javascript 1.8 or Later • Windows XP SP2, Mac OS X 10.6, or Ubuntu Linux 8.04 or Later Jeremy Reed LivingVindonissa
Environmental Requirements (Cont.) • Hardware Environment: • OpenGL 2.0 Supported GPU • Keyboard and Two-Button Pointing Device • Broadband Internet Connection • Minimum 1024 x 768 Pixel 24-Bit Color Display • Minimum 2.4 GHz Processor • Minimum 2 GB RAM Jeremy Reed LivingVindonissa
Functional Requirements • Emulation of All Features of i4D’s Model • “Free Fly” View, Path Following, Etc. • 3D “Person” View • Ability to Designate Admin Users • These Users May Insert Data • Interactive JavaScript Popups / HTML Windows Jeremy Reed LivingVindonissa
Conceptual Overview Dain Cilke LivingVindonissa
Website UI Dain Cilke Dain Cilke LivingVindonissa
Navigation Menu • Will allow the user to choose between two options: • Free View • Follow Path Dain Cilke LivingVindonissa
Free View Tab • Fly Over – Allows the user to “fly” through the model • Walkthrough – Allows the user to walk through the model as a person would • Jump To – Allows the user to jump to a keyframe Dain Cilke LivingVindonissa
Follow Path Tab • Load Path – Allows the user to load a path to explore • Standard Playback Controls – Allows user to play path Dain Cilke LivingVindonissa
Create Path Menu • Record Path – Start recording a path • Pause Recording – Pause recording a path so the user can explore the model • Keyframe – Set a keyframe in the model • New Path – Start a new path • Save Path – Save the path to the database for users to explore Dain Cilke LivingVindonissa
Point of Interest Menu • When the user gets near a POI, the menu will update • Upon clicking the menu, the user will be able to access additional information about the POI LivingVindonissa Dain Cilke
Compass • As the user navigates through the model, the Compass updates to tell him where he is looking LivingVindonissa Dain Cilke
Support • Information • About Vindonissa • About the Project • Help Documents • User Feedback and Submission LivingVindonissa Dain Cilke
Focus of This Presentation Gabe Tambos LivingVindonissa Project Overview Demonstration Architecture 22
Focus of This Presentation Pierce Edwards LivingVindonissa • Project Overview • Demonstration • Architecture • General • Paths • Points of Interest 23
Architecture: Main LivingVindonissa Pierce Edwards LivingVindonissa
Architecture: Renderer LivingVindonissa Pierce Edwards LivingVindonissa
Parse Model • First we request the model from the server • When the server returns the JSON we pull out the fields and bind to variables for WebGL to use Pierce Edwards LivingVindonissa
Calculating Texture Placement • Texture placement occurs dynamically • Which texture is used is based on the normal of the surface. Pierce Edwards LivingVindonissa
Render Scene • Calculate camera placement • Calculate camera pitch quaternion • Calculate camera roll quaternion • Calculate camera placement quaternion • Place the camera in the scene with the proper rotation Pierce Edwards LivingVindonissa
Architecture: GUI Pierce Edwards LivingVindonissa Pierce Edwards LivingVindonissa
Event Handler • Listen for a key press or mouse movement • When an event is detected, call the proper handler • Update the state machine as necessary Pierce Edwards LivingVindonissa
Draw Scene • Set viewport and perspective • Place the camera in the screen with the proper rotation • Add a light to the scene Pierce Edwards LivingVindonissa
Paths • Set of points to move through like a movie • Data generated via frequent polling of a user's position • Data stored in the db detailed on the Database Schema slide LivingVindonissa Gabe Tambos
Path Database Schema LivingVindonissa Gabe Tambos
Path Retrieval • Generate MySQL query in PHP • Make an Ajax call to retrieve path information • Wait for call to return and store path locally LivingVindonissa Gabe Tambos
Points of Interest • Structures of particular historic importance • Possess additional information / related links • Data stored in the db detailed on the POI Database Schema slide LivingVindonissa Gabe Tambos
POI Database Schema LivingVindonissa Gabe Tambos
Point of Interest Retrieval • Generate MySQL query in PHP • Make an Ajax call to retrieve POI information • Wait for call to return • Determine proximity of Points of Interest • Populate Point of Interest Menu LivingVindonissa Gabe Tambos
Dain’s Contribution • Developed Architecture for Displaying Model in WebGL • Added Event Handler and Camera to The Model • Implemented Model Shaders • Created Requirements and Design Documents Gabe Tambos LivingVindonissa
Pierce’s Contribution • Wrote Conversion Script to Change OpenSceneGraph Models into JSON • Database Administration and Schema Design • Overall Project Architectural Design Gabe Tambos LivingVindonissa
Jeremy’s Contribution • Created the Support Pages to the Website • Testing • Refined Documentation • Implemented Compression for model • Contributed to Shader Implementation Gabe Tambos LivingVindonissa
Gabe’s Contribution • Built Homepage Framework • Contributed to Database Setup • PHP and Javascript Scripts for Dealing with Paths • PHP and Javascript Scripts for Parsing POIs LivingVindonissa Gabe Tambos
Nathan’s Contribution • Developed UI Mockups with Input From Team • Implemented Head-Up Display • Implemented Compass • Produced User Documentation Videos Gabe Tambos LivingVindonissa
Challenges • Converting the Model into JSON • Displaying Full Model in WebGL • Implementing a Quaternion Camera • Applying Shaders Gabe Tambos LivingVindonissa
Summary • Project Overview • The Class • Swiss System • The Problem • The Solution • Demonstration • Architecture • General • Paths • Points of Interest LivingVindonissa Gabe Tambos
Thanks! • This project has been very challenging, but rewarding • This was a very cool learning experience • Thanks for allowing us to collaborate on this project! LivingVindonissa Gabe Tambos