project 1 presentation
TRANSCRIPT
![Page 1: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/1.jpg)
Web Authoring Project 2
The Game of Mafia
Wen Liu
05/17/2013
![Page 2: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/2.jpg)
Find out Who the Killer is
How everyone can survive in this game
![Page 3: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/3.jpg)
SiteMap
Imaging
![Page 4: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/4.jpg)
Character design
Using PNG Files
![Page 5: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/5.jpg)
High res mockup
Other Background Element Design
![Page 6: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/6.jpg)
Background and layoutWidth: “2640”
Height: “2490”
Div class ID
![Page 7: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/7.jpg)
Design Challenge#1
for Mouse click On character
Using jquery.scrollpath.js
Set <nav> in Html and <a href “ID"> in <li> tag
![Page 8: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/8.jpg)
HTML CSS
![Page 9: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/9.jpg)
Design Challenge # 2
Rotation when scroll
Adding .arc and .line to function in JS
![Page 10: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/10.jpg)
![Page 11: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/11.jpg)
Design Challenge# 3
Animation start from the Bullet
Inspiration from the movie “God Father”
![Page 12: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/12.jpg)
HTML and CSS
For the bullet
HTML and CSS
For the Pistol
![Page 13: Project 1 presentation](https://reader031.vdocuments.us/reader031/viewer/2022032616/55a393bf1a28ab1b5c8b458d/html5/thumbnails/13.jpg)
Future Directions
League of legends horizontal scrolling website