-
Notifications
You must be signed in to change notification settings - Fork 0
/
project-LA Story.html
119 lines (112 loc) · 5.94 KB
/
project-LA Story.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Chunsu Ouyang - Portfolio</title>
<link rel="shortcut icon" href="favicon.ico" />
<!-- Load CSS -->
<link href="css/style.css" rel="stylesheet" type="text/css" />
<!-- Load Fonts -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Droid+Serif:regular,italic,bold,bolditalic" type="text/css" />
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Droid+Sans:regular,bold" type="text/css" />
<!-- Load jQuery library -->
<script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script>
<!-- Load custom js -->
<script type="text/javascript" src="scripts/panelslide.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
<!-- Load topcontrol js -->
<script type="text/javascript" src="scripts/scrolltopcontrol.js"></script>
<!-- Load NIVO Slider -->
<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/nivo-theme.css" type="text/css" media="screen" />
<script src="scripts/jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="scripts/nivo-options.js" type="text/javascript"></script>
<!-- Load fancybox -->
<script type="text/javascript" src="scripts/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="scripts/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="scripts/jquery.mousewheel-3.0.4.pack.js"></script>
<link rel="stylesheet" href="css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
</head>
<body>
<!--This is the START of the header-->
<div id="topcontrol" style="position: fixed; bottom: 5px; left: 960px; opacity: 0; cursor: pointer;" title="Go to Top"></div>
<div id="header-wrapper">
<div id="header">
<div id="logo"><a href="index.html"><img src="images/logo.png" width="100" height="80" alt="logo" /></a></div>
<div id="header-text">
</div>
</div>
</div>
<!--END of header-->
<!--This is the START of the menu-->
<div id="menu-wrapper">
<div id="main-menu">
<ul>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
<!--END of menu-->
<!--This is the START of the content-->
<div id="content">
<!--This is the START of the NIVO slider-->
<div class="slider-wrapper theme-co">
<div id="slider" class="nivoSlider">
<img src="images/sample-project/slider-LA Story/slide1.jpg" alt="" title="#img1" />
<img src="images/sample-project/slider-LA Story/slide2.jpg" alt="" title="#img2" />
<img src="images/sample-project/slider-LA Story/slide3.jpg" alt="" title="#img3" />
<img src="images/sample-project/slider-LA Story/slide4.jpg" alt="" title="#img4" />
<img src="images/sample-project/slider-LA Story/slide5.jpg" alt="" title="#img5" />
<img src="images/sample-project/slider-LA Story/slide6.jpg" alt="" title="#img6" />
<img src="images/sample-project/slider-LA Story/slide7.jpg" alt="" title="#img7" />
<img src="images/sample-project/slider-LA Story/slide8.jpg" alt="" title="#img8" />
<img src="images/sample-project/slider-LA Story/slide9.jpg" alt="" title="#img9" />
<img src="images/sample-project/slider-LA Story/slide10.jpg" alt="" title="#img10" />
<img src="images/sample-project/slider-LA Story/slide11.jpg" alt="" title="#img11" />
<img src="images/sample-project/slider-LA Story/slide12.jpg" alt="" title="#img12" />
<img src="images/sample-project/slider-LA Story/slide13.jpg" alt="" title="#img13" />
<img src="images/sample-project/slider-LA Story/slide14.jpg" alt="" title="#img14" />
<img src="images/sample-project/slider-LA Story/slide15.jpg" alt="" title="#img15" />
<img src="images/sample-project/slider-LA Story/slide16.jpg" alt="" title="#img16" />
</div>
<div id="slider-shadow"></div>
</div>
<!--END of NIVO Slider-->
<!--This is the START of the project-->
<div class="project">
<div id="description">
<h3>Motel.Make Believe</h3>
<p>Entertainment Studio 2019-2020, led by Natasha Sandmeier & Nathan Su. </p>
<p>Project by Chunsu Ouyang, Gesthimani Roumpani, & Yanrong Yang.</p>
<p>Software: Rhino, Cinema 4D </p>
<br>
<br>
<h5>Los Angeles is the established world capital of filmmaking. Embracing its identity, the urban
fabric has learned to facilitate all functional needs of the entertainment industry, and manages
to contain smaller, constantly transforming worlds within its world, all at various scales.
Everything is seen as a potential movie set. In this context, we discovered the story of Pink
Motel, a 1949 motel in Burbank, whose identity is now being preserved only for the needs of
the movie industry.
<br>
<br>
Inspired by the motel's multipurpose identity and staying within the room scale, we examine
how an environment as mundane as a typical motel room can be treated as a blank canvas to
accommodate different movie genres, moods, and ambiences, as an introduction of ourselves
to worldbuilding. All these elements that visually and emotionally contribute to the fictional
worlds we are creating, define a scene's aesthetics and transform even the most seemingly rigid
spaces. It is by utilizing these tools that we can create well-crafted fictions that resemble reality</h5>
</div>
</div>
<!--END of project-->
<iframe src="https://player.bilibili.com/player.html?aid=90434528&bvid=BV1p7411P7bt&cid=154446231&page=1" width="720" height="405" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
<p>Motel.Make Believe - Realfiction<a class="readmore" href="https://www.bilibili.com/video/BV1p7411P7bt/">Bilibili</a></p>
<br>
<img src="images/sample-project/slider-LA Story/slide00.jpg" />
<br>
<!--This is the START of the gallery-->
<div class="spacer"></div>
</div>
<!--END of content-->
</body>
</html>