-
Notifications
You must be signed in to change notification settings - Fork 2
/
cinematic-designer.html
137 lines (125 loc) · 6.77 KB
/
cinematic-designer.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
---
layout: isdesigner_default
title: Information System Designer | Fonctionnalités - Cinematic Designer
---
<section class="bg_lightest_grey text-center">
<div class="container">
{% include block_heading.html
title="Cinematic Designer"
sub_title="Modéliser vos IHMs"
desc="Cinematic Designer permet de décrire l'enchaînement ainsi que la structure des écrans d'une application."
%}
</div>
</section>
<section >
<div class="container">
{% include block_text_image.html
txt_order="order-1"
title="Modéliser les états d'une application"
desc="<p>La représentation graphique des fonctionnalités de l’application associées aux interactions des utilisateurs permet de structurer et de faciliter la phase de conception d’interfaces homme-machine.</p>
<p>Avec Cinematic Designer, vous pouvez définir facilement les états d’une application et les conditions nécessaires aux changements d’états afin de décrire des scénarios d’utilisations complets.</p>
<p>Des états peuvent êtres agrégés en régions afin de séparer les états de l’application en catégories bien définies.</p>"
lnk_txt=""
lnk_href=""
lnk_target=""
lnk_icon=""
img_order="order-2"
img_src="images/screenshots/cinematic/etat_application.png"
img_title="Information System Designer - What is Information System Designer?"
%}
</div>
</section>
<section >
<div class="container">
{% include block_text_image.html
txt_order="order-2"
title="Modéliser un enchaînement d'écrans"
desc="<p>Cinematic Designer vous permet de représenter les enchaînements d’écrans de votre application en prenant en considération les actions des utilisateurs, et l’état de votre système.</p>
<p>Les structures de vos écrans peuvent être intégrés à cette représentation afin de faciliter la spécification des événements déclencheurs. Chaque enchaînement d’écran peut-être intégré aux différents états de votre application, et réutilisé entre-eux.</p>
<p>Les actions utilisateur sont définies en fonction de la technologie d’IHM désirée (SWT, jFace, HTML, …), permettant ainsi à Cinematic Designer d’être utilisé comme point d’entrée de générateurs d’interfaces graphiques.</p>"
lnk_txt=""
lnk_href=""
lnk_target=""
lnk_icon=""
img_order="order-1"
img_src="images/screenshots/cinematic/enchainement_ecran.png"
img_title="Information System Designer - What is Information System Designer?"
%}
</div>
</section>
<section >
<div class="container">
{% include block_text_image.html
txt_order="order-1"
title="Modéliser la structure d'un écran"
desc="<p>Avec Cinematic Designer, vous pouvez créer les maquettes des écrans votre application. Vous pouvez rapidement prototyper votre interface, en ajoutant et supprimant des éléments afin de vous permettre de trouver une présentation optimale en fonction de vos besoins.</p>
<p>Cinematic Designer assiste l’utilisateur afin de placer ses éléments sur la maquette plus efficacement par un système de guides, et met à disposition un générateur de “layout” pouvant indiquer aux développeurs une hiérarchie de composants graphiques à implémenter.</p>
<p>Les visuels disponibles sont entièrement customisables afin de pouvoir s’adapter à votre charte graphique, et Cinematic Designer propose un outil dédié afin d’ajouter facilement de nouveaux widgets (boutons, zones de saisie, …) qui seraient manquants.</p>"
lnk_txt=""
lnk_href=""
lnk_target=""
lnk_icon=""
img_order="order-2"
img_src="images/screenshots/cinematic/structure_ecran.gif"
img_title="Information System Designer - What is Information System Designer?"
%}
</div>
</section>
<section class="bg_lightest_grey text-center">
<div class="container">
{% include block_heading.html
title="Ressources pour démarrer"
sub_title=""
desc=""
%}
<div class="row">
{% include block_cols.html
col="4 offset-md-2"
icon_name="far fa-file-alt"
icon_color="txt_indigo"
title="Documentation"
desc="Apprenez à utiliser Cinematic Designer, grâce à son guide d'utilisation en ligne"
href="https://github.com/ObeoNetwork/InformationSystem/wiki/ISD---Cinematic-tooling"
link_txt="En savoir plus"
href_icon="fas fa-arrow-alt-circle-right"
%}
{% include block_cols.html
col="4"
icon_name="fas fa-download"
icon_color="txt_indigo"
title="Téléchargement"
desc="Découvrez Cinematic Designer en téléchargeant la dernière release"
href="https://github.com/ObeoNetwork/InformationSystem/releases"
link_txt="En savoir plus"
href_icon="fas fa-arrow-alt-circle-right"
%}
</div>
</div>
</section>
<!-- <div class="card banner bg-dark text-white text-center">
<img src="images/banners/banner_features.jpg" class="card-img" alt="Fonctionnalités">
<div class="container card-img-overlay">
<section>
{% include block_heading.html
title="Voir aussi"
sub_title=""
desc=""
%}
<div class="row">
<div class="col-md-4 wow fadeInLeft" data-wow-delay=".05s">
<h3>Requirements Designer</h3>
<p><a href="requirements-designer.html">Modéliser les exigences liées à l’application <i class="fa fa-external-link" aria-hidden="true"></i></a></p>
</div>
<div class="col-md-4 wow fadeInLeft" data-wow-delay=".09s">
<h3>Graal Designer</h3>
<p><a href="graal-designer.html">Modéliser les besoins utilisateurs <i class="fa fa-external-link" aria-hidden="true"></i></a></p>
</div>
<div class="col-md-4 wow fadeInLeft" data-wow-delay=".11s">
<h3>SOA Designer</h3>
<p><a href="soa-designer.html">Modéliser les interfaces de composants applicatifs <i class="fa fa-external-link" aria-hidden="true"></i></a></p>
</div>
</div>
</section>
</div>
</div>
</div> -->