-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathindex.html
executable file
·297 lines (258 loc) · 12.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
<doctype html>
<!-- camille brizard - Chapitô by Code Troopers -->
<html>
<head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-5F96BC7');</script>
<!-- End Google Tag Manager -->
<meta charset = "UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Chapitô</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/pushy.css">
<link rel="icon" type="image/png" href="img/favicon.png">
<!-- Lien pour la typographie-->
<link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<meta property="og:title" content="Chapitô" />
<meta property="og:site_name" content="Chapitô" />
<meta property="og:url" content="http://chapi.to/" />
<meta property="og:image" content="http://chapi.to/img/Concertlogos.jpg"/>
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@codetroopers" />
<meta name="twitter:creator" content="@codetroopers" />
<meta name="twitter:title" content="Chapitô" />
<meta name="twitter:url" content="http://chapi.to/" />
<meta name="twitter:description" content="Chapitô permet aux organisateurs d’événements de pouvoir créer des applications sur-mesure sans aucune compétence en développement" />
<meta name="twitter:image" content="http://chapi.to/img/Concertlogos.jpg"/>
<meta name="description" content="Chapitô permet aux organisateurs d’événements de pouvoir créer des applications sur-mesure sans aucune compétence en développement" />
<meta property="og:description" content="Chapitô permet aux organisateurs d’événements de pouvoir créer des applications sur-mesure sans aucune compétence en développement"/>
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5F96BC7"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<!-- Header avec le logo centré et le menu -->
<div class="fond">
<header>
<button class="hamburger">☰</button>
<button class="cross">˟</button>
</header>
<a href="javascript:" id="return-to-top"><i class="icon-chevron-up"></i></a>
<div class="menu">
<ul>
<li><a href="#quoi" class="quoi">Quoi, qui, où?</a></li>
<li><a href="#fonction" class="fonction"> Les fonctionnalités</a></li>
<li><a href="#appli" class="appli">L'application</a></li>
<li><a href="#avantages" class="avantages">Les avantages</a></li>
<li><a href="#tarifs" class="tarifs">Les tarifs et parrainage</a></li>
<li><a href="#contact" class="contact">Nous contacter</a></li>
</ul>
</div>
<div class="logo">
<img src="/img/Concertlogos.jpg">
</div>
</div>
<!-- Partie 0 Video -->
<div class="container0">
<div class="row">
<div class="col-md-1">
<div class="container-ytplayer">
<iframe id="ytplayer" type="text/html" width="640" height="360"
src="https://www.youtube.com/embed/I9T-_mMNavo?rel=0&showinfo=0&modestbranding=1&controls=0"
frameborder="0">
</iframe>
</div>
</div>
</div>
</div>
<!-- Partie 1 "le Chapito" -->
<div class="container1">
<div class="row">
<div class="col-md-1">
<h1>CHAPITÔ</h1>
<p>Chapitô est un outil 100% en ligne. Le but de Chapitô est de permettre à n’importe quel organisateur de festival de pouvoir créer une application “sur-mesure” sans avoir de connaissance en développement web ni en développement d’application.</p>
<div class="comment">
<img src="/img/Commentcamarche-01.png" onmouseover="this.src='/img/Commentcamarche-04.png'" onmouseout="this.src='/img/Commentcamarche-01.png'" >
<img src="/img/Commentcamarche-02.png" onmouseover="this.src='/img/Commentcamarche-05.png'" onmouseout="this.src='/img/Commentcamarche-02.png'">
<img src="/img/Commentcamarche-03.png" onmouseover="this.src='/img/Commentcamarche-06.png'" onmouseout="this.src='/img/Commentcamarche-03.png'">
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
<!-- Partie 2 "Pour quoi?"-->
<div class="container2">
<div class="row">
<div class="col-md-2">
<h1 id="quoi">Pour quoi ?</h1>
<p>Créer une application pour votre festival permet à votre public de connaître toutes les informations relatives à votre événement :</p>
<div class="italic"><p>Les artistes présents, les horaires des concerts, la programmation, des extraits musicaux et musiques, les infos pratiques, les principaux points d’intérêt, les partenaires, etc...</p></div>
<p>MAIS ! également de rester informé des changements et être alerté des nouveautés grâce aux notifications ! Elles seront immédiates ou programmables.</p>
<div class="paragraphe"><p>L’application est un outil de communication à part entière et est au service de l’événement qu’elle promeut !</p></div>
</div>
<div class="col-md-2">
<div class="festival">
<img src="/img/Festivals.jpg">
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
<!-- Partie 3 "Pour qui? Où la trouver?"-->
<div class="container3">
<div class="qui">
<h1>Pour qui ?</h1>
<p>Vos festivaliers pourront enfin avoir accès à toutes les informations dont ils ont besoin directement sur leurs smartphones grâce à votre application !</p>
<img src="/img/80.png">
</div>
<div class="trouver">
<h1>Où la trouver ?</h1>
<p>L’application sera téléchargeable gratuitement sur iPhone et Android, elle correspondra parfaitement à votre festival. <br>La classe !</p>
<img src="/img/Apple.png">
<img src="/img/Android.png">
</div>
</div>
<div class="clearfix"></div>
<!-- Partie 4 "Photo parallaxe"-->
<div class="container4"></div>
<div class="clearfix"></div>
<!-- Partie 5 "Carousel Webdesign"-->
<div class="container5">
<div class="owl-carousel">
<div class="items">
<h1 id="">La plateforme web : Chapitô</h1>
<img src="img/Carousel1.jpg">
</div>
<div class="items">
<h1 id="">Votre application</h1>
<img src="img/Carousel2.jpg">
</div>
</div>
</div>
<div class="clearfix"></div>
<!-- Partie 6 "Les fonctionnalités et Avantages"-->
<div class="container6">
<h1 id="fonction">Les fonctionnalités et avantages</h1>
<img src="/img/Fonction.png">
</div>
<div class="clearfix"></div>
<!-- Partie 7 "Que comportent les applications"-->
<div class="container7">
<h1 id="appli">Très précisément, <br>que comportent les applications ?</h1>
<div class="row">
<div class="col-md-7">
<h2>Concernant le festival</h2>
<ul>
<li>Le programme du festival</li>
<li>Les Informations sur le festival (dates, lieux, liens vers le site web, les réseaux sociaux et la boutique en ligne)</li>
<li>La liste des artistes avant/durant/après le festival</li>
<li>Une page unique par artiste</li>
<li>La carte du festival</li>
<li>La description du festival</li>
<li>Les Vidéos Youtube / Vimeo pour chaque artiste</li>
<li>Les extraits ou chansons entières avec Spotify et autres plateformes musicales</li>
</ul>
</div>
<div class="col-md-7">
<h2>Les informations pratiques</h2>
<ul>
<li>Les informations de contact</li>
<li>Sponsors et partenaires du festival</li>
<li>Diverses informations pratiques</li>
<li>Gestion de notifications push</li>
<li>Page d’accès à la billetterie en ligne</li>
<li>Page d’accès à un service externe de paiement Cashless</li>
<br><li><b>Possibilité de rajouter deux espaces publicitaires pour mettre en avant vos partenaires</b></li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="blocblanc">
<p>Chapitô et les applications qui en sont générées, sont vendues dans la version actuelle mais peuvent connaitre des évolutions pour s’adapter à vos besoins précis.</p>
</div>
<div class="clearfix"></div>
<!-- Partie 8 "Les avantages de cette application"-->
<div class="container8">
<div class="row">
<div class="col-md-8">
<div class="avantage">
<h1 id="avantages">Les avantages de cette application</h1>
<p>Télécharger une application mobile est déjà un premier engagement, vous êtes certains que tous ceux qui téléchargent votre application sont sensibles à votre événement .
<br>Pour accéder à votre application, un *clic* suffira. En facilitant l’accès à vos contenus, les festivaliers les consulteront plus souvent.
<br>Seule une application mobile permet d’envoyer directement des notifications push à votre audience .</p>
</div>
</div>
<div class="col-md-8">
<div class="notification">
<p><b>Un événement de dernière minute à signaler ou une nouvelle importante ?</b></p>
<p>Chapitô vous permettra d’envoyer une notification à tous ceux qui auront installé l’application du festival. <br>Votre message sera transmis !</p>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
<!-- Partie 9 "Photo parallaxe"-->
<div class="container9"></div>
<div class="clearfix"></div>
<!-- Partie 10 "Tarifs et parrainage"-->
<div class="container10">
<div class="tarif">
<h1 id="tarifs">Tarifs de Chapitô</h1>
<img src="/img/Prix.png">
<p>Accédez à l’outil Chapitô afin de générez une application pour votre événement sur iPhone et sur Android </p>
</div>
<div class="parrainage">
<h1>Offre Parrainage</h1>
<img src="/img/Parrainage.png">
<p>Parrainez un autre événement, vous obtiendrez une réduction de 500€ et votre filleul 250€.</p>
</div>
</div>
<div class="blocbleu">
<p>Pour toutes demandes annexes, adaptations à vos besoins précis, un devis peut-être effectué. Les évolutions et améliorations du produit de notre ressort pendant votre période d’utilisation ne vous seront, elles, pas facturées. </p>
</div>
<div class="clearfix"></div>
<!-- Partie 11 "Carousel Appli"-->
<div class="container11">
<h1 id="">Pré-visuels requis</h1>
<div class="owl-carousel">
<div class="item">
<img src="img/Visuel1.jpg">
</div>
<div class="item">
<img src="img/Visuel2.jpg">
</div>
</div>
</div>
<div class="clearfix"></div>
<!-- Partie 12 "Qui sommes nous? Contact"-->
<div class="container12">
<div class="mame">
<img src="/img/Mamelocalise.jpg">
</div>
<div class="contact1">
<h1 id="contact">Qui sommes-nous ?</h1>
<p>Festivaliers dans l’âme, nous ressentions le besoin d’avoir à notre disposition une application permettant de retrouver toutes les informations concernant un festival, les artistes et précisions sur ce dernier, les horaires des concerts, les actualités, etc. c’est alors qu’a germé l’idée de Chapitô.
<br>Très rapidement nous nous sommes rendu compte que Chapitô répondait aux besoins de festivals proches de chez nous. Ils nous ont rapidement fait confiance : Terres du Son 2017 & 2018, Aucard de Tours depuis 2016… Et bientôt vous !</p>
</div>
<div class="contact2">
<h1>Nous contacter</h1>
<p>Pour toute information complémentaire ou pour prendre rendez-vous veuillez contacter notre service commercial :</p>
<p><br>MAME <br>Cité de la création et du numérique <br>49 boulevard Preuilly 37000 Tours</p><p>nicolas@chapi.to <br>06 66 70 13 79</p>
</div>
</div>
<div class="clearfix"></div>
<i class="icon-arrow-down"></i>
<footer>2018 Chapitô by <a href="https://code-troopers.com/">Code Troopers</a> © - Tous droits réservés - Création graphique Camille Brizard - <a href="/privacy_policy.html">Politique de confidentialité</a></footer>
<script type="text/javascript" src="js/jquery-3.1.1.js" ></script>
<script type="text/javascript" src="js/main.js" ></script>
<script type="text/javascript" src="js/owl.carousel.min.js" ></script>
</body>
</html>