1. LivingVindonissa: The State of the Project 1 A Web-based 3D Model of the Ancient Roman Camp Vindonissa Dain Cilke Pierce Edwards Jeremy Reed Gabe Tambos Nathan Thompson

2. The Team Dain Cilke, Nathan Thompson, Pierce Edwards, Gabe Tambos, Jeremy Reed 2 Nathan ThompsonLivingVindonissa

3. Focus of This Presentation CU Senior Project Class Class Summary Other Projects Swiss Team’s System Boulder Team’s Contribution: LivingVindonissa Purpose Requirements Conceptual Overview Design Software Demonstration A Look Ahead 3 Nathan ThompsonLivingVindonissa

4. 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 4 Nathan ThompsonLivingVindonissa

5. Other Projects: Volumizer Also Sponsored by Alex Repenning Web-Based Application Converts 2D Drawings into 3D Icons Also Uses WebGL 5 Nathan ThompsonLivingVindonissa

6. Other Projects: ICUP Application for Android Smart Phones Provides Users With Information from Collegepedia Shopping Deals, Upcoming Events, Etc. 6 Nathan ThompsonLivingVindonissa

7. Focus of This Presentation CU Senior Project Class Swiss Team’s System Team Introduction Current System The Problem Boulder Team’s Contribution: LivingVindonissa 7 Nathan ThompsonLivingVindonissa

8. 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

9. Swiss Team’s System 9 Nathan ThompsonLivingVindonissa Nathan ThompsonLivingVindonissa Institute of Archeology of Canton Aargau Has Been Analyzing Vindonissa for Many Years Analysis Used to Create 3D OpenGL Model of Site

10. 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 10 Nathan ThompsonLivingVindonissa

11. 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 11 Nathan ThompsonLivingVindonissa

12. Focus of This Presentation CU Senior Project Class Swiss Team’s System Boulder Team’s Contribution: LivingVindonissa Purpose Requirements Conceptual Overview Design Software Demonstration A Look Ahead 12 Nathan ThompsonLivingVindonissa

13. 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. 13 Jeremy ReedLivingVindonissa

14. Environmental Requirements Software / Development Environment: 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 Minefield, Webkit, or Chromium Database: PHP + mySQL 14 Jeremy ReedLivingVindonissa

15. Environmental Requirements (Cont.) Hardware Environment: 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 OpenGL 2.0 Supported GPU 15 Jeremy ReedLivingVindonissa

16. 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 16 Jeremy ReedLivingVindonissa

17. Conceptual Overview 17 Dain CilkeLivingVindonissa

18. Jeremy’s Contribution Created the Support Pages to the Website Testing Refined Documentation 18 Jeremy ReedLivingVindonissa

19. Nathan’s Contribution Developed UI Mockups with Input From Team Implemented Navigation Menu Begun Work on Point of Interest Menu Nathan ThompsonLivingVindonissa 19

20. Dain’s Contribution Created Requirements and Design Documents Developed Architecture for Displaying Model in WebGL Added Event Handler and Camera to The Model Dain CilkeLivingVindonissa 20

21. Pierce’s Contribution Wrote Conversion Script to Change OpenSceneGraph Models into JSON Database Administration and Schema Design Overall Projector Architectural Design Pierce EdwardsLivingVindonissa 21

22. Gabe’s Contribution Built Homepage Framework Contributed to Database Setup PHP and Javascript Scripts for Dealing with Paths Gabe Tambos LivingVindonissa 22

23. Website UI 23 Dain Cilke LivingVindonissa

24. Menu UI Will allow the user to choose between three options: Free View Follow Path Create Path 24 LivingVindonissaDain Cilke

25. Free View 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 25 LivingVindonissaDain Cilke

26. Follow Path Load Path – Allows the user to load a path to explore 26 LivingVindonissaDain Cilke

27. Create Path 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 27 LivingVindonissaDain Cilke

28. Point of Interest UI When the user hovers over a POI, a menu will pop up with the name of the POI Upon clicking the menu, the user will be able to access additional information about the POI 28 LivingVindonissa Dain Cilke

29. Support Information About Vindonissa About the Project Help Documents User Feedback and Submission 29 Dain Cilke LivingVindonissa

30. User Annotations 30 Dain Cilke LivingVindonissa

31. Architecture: Main 31 Pierce Edwards LivingVindonissa

32. Architecture: Renderer 32 Pierce Edwards LivingVindonissa

33. 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 33 Pierce EdwardsLivingVindonissa

34. Calculating Texture Placement Texture placement will occur dynamically Placement will depend on the angles of the planes Functionality still needs to be implemented 34 Pierce EdwardsLivingVindonissa

35. 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 35 Pierce EdwardsLivingVindonissa

36. Architecture: GUI 36 Pierce EdwardsLivingVindonissa Pierce EdwardsLivingVindonissa

37. 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 37 Pierce EdwardsLivingVindonissa

38. Draw Scene Set viewport and perspective Place the camera in the screen with the proper rotation Add a light to the scene 38 Pierce EdwardsLivingVindonissa

39. 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 39 Gabe Tambos LivingVindonissa

40. Database Schema 40 Zpatial PK id xyzxyz Path PK pathID posInPath FKpointID lookID Objects PK id name file LivingVindonissa Gabe Tambos

41. Path Retrieval Generate MySQL query in PHP Make an Ajax call to retrieve path information Wait for call to return and store path locally 41 Gabe Tambos LivingVindonissa

42. Software Demonstration 42 Gabe Tambos LivingVindonissa

43. Challenges Converting the Model from OpenSceneGraph Format to.obj Learning the WebGL Architecture as Well as Proper design of WebGL Programs Designing the Architecture of the Program to Allow Menu Interaction Working Around the Constraints of MySQL Designing a Visually Appealing Website Gabe Tambos LivingVindonissa 43

44. A Look Ahead: More Development Yet to Come: Apply Shader Hook Up JavaScript Menus Flesh Out Additional Content Current Timeline: Finish Major Development in December Begin Alpha Testing in Mid-January 44 Gabe Tambos LivingVindonissa

45. Summary CU Senior Project Class Other Projects i4D’s System LivingVindonissa Purpose Requirements Conceptual Overview Design Software Demonstration A Look Ahead 45 LivingVindonissa Gabe Tambos