-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·314 lines (291 loc) · 14.6 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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
---
---
<!DOCTYPE html>
<html lang="en">
<head>
{% include analytics.html %}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Qoncept, Inc.">
<title>QHOME</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom fonts for this template -->
<link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>
<!-- Custom styles for this template -->
<link href="css/theme.css" rel="stylesheet">
<link href="css/index.css" rel="stylesheet">
<link rel="icon" type="image/png" href="img/favicon.png">
</head>
<body id="page-top">
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark fixed-top" id="mainNav">
<div class="container">
<a class="navbar-brand js-scroll-trigger" href="#page-top"><img src="img/brand.png" alt="QHOME" /></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fa fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#features">Features</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#download">Downloads</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#builders">For Business</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#import">Import Models</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#clients">Adopted By</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#company">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="index-ja.html">🇯🇵</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Header -->
<header class="masthead">
<div class="container">
<div class="intro-text">
<div class="intro-lead-in">QHOME</div>
<div class="intro-heading">Walk in floor plans</div>
<a class="btn btn-xl js-scroll-trigger" href="#features">Tell me more</a>
</div>
</div>
</header>
<!-- Features -->
<section id="features">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Features</h2>
<h3 class="section-subheading text-muted">What you can do with QHOME</h3>
</div>
<div class="qh-video col-sm-12 text-center">
<iframe src="https://www.youtube.com/embed/v8LL3gRAq7k?controls=0&showinfo=0&rel=0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
<div class="row text-center">
<div class="col-md-4">
<h4 class="feature-heading">Feel the Size</h4>
<p class="text-muted">Just by looking at a floor plan, or even a 3D reproduction of a room, it is hard to get a feel for the size of it. With QHOME, you can walk around and experience a 3D model through <a data-toggle="popover" data-placement="bottom" title="VR" data-content="Virtual Reality"><strong>VR</strong></a> simulation, and see the size by yourself.<!-- There's no need for special equipment, so you can even walk around in your own home and compare proportions. --></p>
</div>
<div class="col-md-4">
<h4 class="feature-heading">View the Scenery</h4>
<p class="text-muted">Will the view from your living room be as you imagined it to be? Is the window size and positioning going to be just right? To avoid these kind of worries, you can use <a data-toggle="popover" data-placement="bottom" title="VR" data-content="Augmented Reality"><strong>AR</strong></a> to simulate the views beforehand.</p>
</div>
<div class="col-md-4">
<h4 class="feature-heading">Confirm the Visibility</h4>
<p class="text-muted">Can you imagine how the view from upstairs, or from the kitchen to the dining room is going to be like? With QHOME, you can walk around inside a 3D model, and confirm the view from the places and angles that you'd like.</p>
</div>
</div>
</div>
</section>
<!-- Download -->
<section class="bg-light" id="download">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Downloads</h2>
<h3 class="section-subheading text-muted">Available on iPhone and iPad</h3>
</div>
</div>
<div class="row">
<div class="qh-button col-md-12 col-sm-12">
<p><a href="https://itunes.apple.com/us/app/qhome/id1281849948?mt=8"><img src="img/app-store.png" alt="App Store"/></a></p>
<!-- <p>iOS 11 以降、 ARKit 必須</p> -->
</div>
</div>
</div>
</section>
<!-- Builders -->
<section id="builders">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">For Business</h2>
<h3 class="section-subheading text-muted">How to use QHOME for your business</h3>
</div>
</div>
<div class="row text-center">
<div class="col-md-6">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x text-primary"></i>
<i class="fa fa-usd fa-stack-1x fa-inverse"></i>
</span>
<h4 class="feature-heading">Free</h4>
<p class="text-muted">There's no need for special equipment to use QHOME. <a class="js-scroll-trigger" href="#download">Download</a> the free app and use it. <a class="js-scroll-trigger" href="#clients">QHOME has been already used for real business</a>.</p>
</div>
<div class="col-md-6">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x text-primary"></i>
<i class="fa fa-home fa-stack-1x fa-inverse"></i>
</span>
<h4 class="feature-heading">Using Existing Data</h4>
<p class="text-muted">You can use existing model data if your 3D modeling software or 3D CAD can export COLLADA (.dae) files. Import your data into the app by following <a class="js-scroll-trigger" href="#import">these steps</a>.</p>
</div>
<div class="col-md-6">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x text-primary"></i>
<i class="fa fa-mobile fa-stack-1x fa-inverse"></i>
</span>
<h4 class="feature-heading qh-no-transform">AVAILABLE ON iPhone / iPad</h4>
<p class="text-muted">QHOME is available on <a data-toggle="popover" data-placement="bottom" title="Devices which ARKit runs" data-content="{% include arkit-devices.html %}">iPhone and iPad on which ARKit can run</a>. Because it can be installed into your clients' iPhone, it is possible for them to run QHOME in their home and compare proportions.</p>
</div>
<div class="col-md-6">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x text-primary"></i>
<i class="fa fa-share fa-stack-1x fa-inverse"></i>
</span>
<h4 class="feature-heading">Sharing Data with Your Clients</h4>
<p class="text-muted">It is possible to share model data from app to app directly using <a href="https://support.apple.com/en-us/HT204144">AirDrop</a>. On meetings with your clients, let them install the app from <a href="https://itunes.apple.com/us/app/qhome/id1281849948?mt=8">App Store</a> to their own devices and share the data.</p>
</div>
</div>
<div class="row">
<div class="text-center col-md-12 col-sm-12">
<a class="btn btn-xl" href="mailto:[email protected]">Contact Us</a>
</div>
</div>
</div>
</section>
<!-- Import -->
<section class="bg-light" id="import">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Import Models</h2>
<h3 class="section-subheading text-muted">How to import models to the app</h3>
</div>
</div>
<div class="row text-center">
<div class="qh-item col-md-6">
<div>
<img src="img/import/modeling.png" alt="Modeling" />
</div>
<h4 class="feature-heading">1. Make a COLLADA file</h4>
<p class="text-muted">Make a 3D model with the COLLADA (.dae) format. Most 3D modeling software can export a model to a COLLADA file.</p>
</div>
<div class="qh-item col-md-6">
<div>
<img src="img/import/conversion.png" alt="Converting models" />
</div>
<h4 class="feature-heading">2. Convert the data for QHOME</h4>
<p class="text-muted">Generate a QHOME file from a COLLADA file using {% include qhome-maker-link.html %}. Drag and drop a COLLADA onto QHOME Maker（Currently available on Mac only）</p>
</div>
<div class="qh-item col-md-6">
<div>
<img src="img/import/import.png" alt="Importing models" />
</div>
<h4 class="feature-heading">3. Import models to QHOME</h4>
<p class="text-muted"><a href="https://support.apple.com/en-us/HT204144">AirDrop</a> or <a href="https://support.apple.com/en-us/HT201301">iTunes File Sharing</a> is available to import models to the QHOME app. Models imported to QHOME can be sahred directly from app to app using AirDrop in their settings page.</p>
</div>
<div class="qh-item col-md-6">
<div>
<img src="img/import/settings.png" alt="Settings" />
</div>
<h4 class="feature-heading">4. Settings for Models</h4>
<p class="text-muted">Configure the settings of imported models on the QHOME app. Default position, direction, unit of the coordinates and so on can be configured.</p>
</div>
</div>
</div>
</section>
<!-- Clients -->
<section id="clients">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Adopted By</h2>
<h3 class="section-subheading text-muted"></h3>
</div>
</div>
<div class="row">
<div class="col-sm-4"></div>
<div class="col-sm-4">
<a href="http://www.fukuda-lld.jp/">
<img class="img-fluid d-block mx-auto" src="img/logos/fukuda-lld.png" alt="FUKUDA LONG LIFE DESIGN Co.,Ltd.">
</a>
</div>
<div class="col-sm-4"></div>
</div>
</div>
</section>
<!-- Company -->
<section class="bg-black" id="company">
<div class="container">
<div class="row">
<div class="qh-logo col-lg-12 text-center">
<h2 class="section-heading"><img src="img/qoncept-logo-white.png" alt="Qoncept" /></h2>
</div>
<div class="col-lg-8 mx-auto text-center">
<h3 class="section-subheading text-muted">Qoncept is a company started from a research for computer vision, especially real-time image recognition, at <a href="https://en.wikipedia.org/wiki/Osaka_University">Osaka University</a> in Japan. We provide our technoligies for various fields: AR, international games of various sports, TV broadcasting, auto pilot for drones, inspection of infrastructures, space industry and so on.</h3>
</div>
<div class="qh-video col-sm-12 text-center">
<iframe src="https://www.youtube.com/embed/videoseries?version=3&list=PL3LEMl0QsOt_QMnWcoivXOOzyyw5QZdJH&rel=0&showinfo=0&controls=0&autohide=1" frameborder="0" allowfullscreen></iframe>
</div>
</div>
<div class="row">
<div class="qh-button col-md-12 col-sm-12">
<a class="btn btn-xl" href="http://qoncept.co.jp/">Visit our site</a>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer>
<div class="container">
<div class="row">
<div class="col-md-4">
<ul class="list-inline quicklinks">
<li class="list-inline-item">
<!-- <a href="http://qoncept.co.jp/ja/privacy-policy.html">Privacy Policy</a> -->
</li>
</ul>
</div>
<div class="col-md-4">
<ul class="list-inline social-buttons">
<li class="list-inline-item">
<a href="mailto:[email protected]">
<i class="fa fa-envelope"></i>
</a>
</li>
</ul>
</div>
<div class="col-md-4">
<span class="copyright">Copyright © <a href="http://qoncept.co.jp/">Qoncept</a> 2017</span>
</div>
</div>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/popper/popper.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<!-- Plugin JavaScript -->
<script src="vendor/jquery-easing/jquery.easing.min.js"></script>
<!-- Contact form JavaScript -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>
<!-- Custom scripts for this template -->
<script src="js/agency.min.js"></script>
<script>
$(function () {
$('[data-toggle="popover"]').popover({html: true})
});
</script>
</body>
</html>