-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
135 lines (126 loc) · 5.32 KB
/
index.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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ViewScore - Quantifying Window View Satisfaction</title>
<style>
body { font-family: Arial, sans-serif; margin: 0; padding: 0; color: #333; }
header, footer { background-color: #333; color: #fff; padding: 1em 0; text-align: center; }
.container { width: 90%; max-width: 1200px; margin: 0 auto; }
.hero { background-image: url('cityscape.jpg'); background-size: cover; color: #fff; text-align: center; padding: 100px 20px; }
.hero h1 { font-size: 3em; }
.hero p { font-size: 1.2em; margin-top: 10px; }
.button { background-color: #ff5722; color: #fff; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; }
.features, .how-it-works, .applications, .testimonials, .cta { padding: 50px 0; text-align: center; }
.features h2, .how-it-works h2, .applications h2, .testimonials h2, .cta h2 { font-size: 2.5em; margin-bottom: 10px; }
.feature, .step, .application, .testimonial { margin-bottom: 20px; }
footer .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }
footer .socials a { margin: 0 10px; color: #fff; text-decoration: none; }
</style>
</head>
<body>
<header>
<div class="container">
<h1>ViewScore</h1>
<nav>
<a href="#features">Features</a> |
<a href="#how-it-works">How it Works</a> |
<a href="#applications">Applications</a> |
<a href="#testimonials">Testimonials</a> |
<a href="#contact">Contact Us</a>
</nav>
</div>
</header>
<section class="hero">
<div class="container">
<h1>Transform Building Design with ViewScore</h1>
<p>The smart solution for predicting occupant satisfaction with window views, powered by real data and machine learning.</p>
<button class="button">Try ViewScore Now</button>
</div>
</section>
<section id="features" class="features">
<div class="container">
<h2>Features</h2>
<div class="feature">
<h3>Data-Driven Predictions</h3>
<p>ViewScore analyzes window views using a unique dataset from human studies, offering accurate satisfaction scores based on real preferences.</p>
</div>
<div class="feature">
<h3>Advanced ML Prediction Model</h3>
<p>Our model predicts view satisfaction using image and depth data, adaptable to real estate photos and design mockups.</p>
</div>
<div class="feature">
<h3>Easy Integration for Designers</h3>
<p>A custom CAD plugin enables architects and developers to assess view satisfaction directly in design software, optimizing layouts.</p>
</div>
</div>
</section>
<section id="how-it-works" class="how-it-works">
<div class="container">
<h2>How It Works</h2>
<div class="step">
<h3>1. Data Collection</h3>
<p>Our dataset includes diverse view rankings from human subject studies.</p>
</div>
<div class="step">
<h3>2. Machine Learning</h3>
<p>An ML model predicts satisfaction using depth and visual data.</p>
</div>
<div class="step">
<h3>3. Seamless Integration</h3>
<p>Use ViewScore in CAD tools or real estate listings to visualize satisfaction scores instantly.</p>
</div>
</div>
</section>
<section id="applications" class="applications">
<div class="container">
<h2>Applications</h2>
<div class="application">
<h3>Real Estate</h3>
<p>Evaluate properties based on view satisfaction scores for improved client experiences.</p>
</div>
<div class="application">
<h3>Architecture & Development</h3>
<p>Optimize designs with data-backed insights for enhanced occupant well-being.</p>
</div>
<div class="application">
<h3>Interior Design</h3>
<p>Make informed decisions about window placements and layouts.</p>
</div>
</div>
</section>
<section id="testimonials" class="testimonials">
<div class="container">
<h2>Testimonials</h2>
<div class="testimonial">
<p>"ViewScore transformed our design process, helping us predict occupant satisfaction early on." — <strong>Architect, Urban Designs Inc.</strong></p>
</div>
<div class="testimonial">
<p>"Clients love knowing that views are objectively evaluated!" — <strong>Real Estate Agent, Realty Plus</strong></p>
</div>
</div>
</section>
<section class="cta">
<div class="container">
<h2>Ready to Revolutionize Building Design?</h2>
<button class="button">Request a Demo</button>
</div>
</section>
<footer>
<div class="container">
<p>© 2024 ViewScore. All rights reserved.</p>
<nav>
<a href="#features">About Us</a> |
<a href="#privacy">Privacy Policy</a> |
<a href="#terms">Terms of Service</a>
</nav>
<div class="socials">
<a href="#">Facebook</a>
<a href="#">Twitter</a>
<a href="#">LinkedIn</a>
</div>
</div>
</footer>
</body>
</html>