Différences entre les versions de « ERG::interactivenarration »

De {}
Aller à la navigation Aller à la recherche
Ligne 1 : Ligne 1 :
−
le lien du drive avec les modifications du code ( ce qui suit n'est plus en vigueur ) : https://drive.google.com/drive/folders/1XSQhMwiNszfi0TzcNnsJlqS93_7S1l48
+
 
 +
 
 +
 
 +
 
 +
 
  
 
==premiere sess==   
 
==premiere sess==   
Ligne 629 : Ligne 633 :
 
==schéma actuel de la narration==
 
==schéma actuel de la narration==
 
[[Fichier:chema2.png]]
 
[[Fichier:chema2.png]]
 +
==le projet de violette==
 +
Le but c'est d'appliquer la trame narrative de base à une navigation de pages en pages.
 +
 +
Ca fonctionne avec php. En transformant des variables SESSION en variables POST, toutes les informations données par l'utilisateur sont enregistrées et permettent dêtre ré expoitées plus tard.
 +
Ce qui fait une bonne narration entre autres c'est comment on va au au bout de ce qu 'on peut exploiter avec les éléments on a mis en place.
 +
 +
La première page correspond à la caractérisation d'un personnage. Toutes les variables permettent une avancée du récit.Pour ce qui concerne la catégorie voix off, le but initial était de les générer (aléatoirement)durant la navigation. (en fait les moments dont déterminéset ils apparaissent parfois sous forme d'alert). Elle permet d'"accéder à l'intériorité du personnage", ainsi lorsque la dramaturgie mise en place, donc tout l'extime tout ce qui se voit en acte (comme un dialogue) , n'est pas suffisant pour cerner la situation, on peut y avoir accès à travers l'intime.
 +
La catégorie bio se retrouve sur une tombe en cas d'échec.
 +
 +
La page 2 est l'élément déclencheur. Il existe plusieurs solutions pour la page 3 par rapport aux caractère choisi à l'index.
 +
Avec la combinaison téméraire/lui sauver la vie. Le personnage rentre dans les péripéties. Si on a choisi la personnalité tout mou, on est trop faible pour ce monde et l'on est renvoyé à la page mort.
 +
il y a aussi la possibilité de refuser de rentrer dans ce qui s'apparente aux péripéties ce qui bloque tout le processus narratif et bloque le personnage à une exposition illimitée et l'impossibilité d'en sortir sinon la mort
 +
 +
A la page 4, les 3 réactions renvoie aux caractère choisi. L'option soin ou le fait de faire matcher le caractère et la réaction permet de poursuivre la navigation.

Version du 6 mai 2019 à 09:46




premiere sess

Histoire choix entre différentes propositions prédéfinies à l'avance. Générer une narration à l'aide d'une banque d'images (PNG) pour illustrer les choix fait parmi différentes propositions établies à l'avance.

Page type simplifiée: Phrase à trou ex : "Le.... (choix entre 5 propositions) prend une douche".

  • 1 -Determination du sujet (personnage, taille/couleur/forme/...) les mots clés detrminent l'avatar
  • 2 -Exposition/Contexte ( décor, environnement,...)
  • 3 -élément perturbateur (problème/rencontre/découverte/...)
  • 4 -quête (série d'obstacles)
  • 5 -résolution


forme finale: - Navigation de page en page avec prise en compte des choix -constituion d'une nouvelle image style cadavre exquis -Une page qui s'anime en temps réel en fonction des choix faits.

CyberBotanica Raphaël Bergère Still Moving Maurice Benayoun Jeu vidéo; façade. [1]


Session du 01/10

violette&louisa


Le but c'est pas de montrer de l'image sur un support numérique et juste de cliquer sur page suivante

Ce n'est pas non plus de mettre au point une narration de A à Z mais plutôt explorer de manière de faire de la narration interactive ( des concepts )

[Examples]

Anthony Rageul "Prise de tête une bande dessinée numérique explorant différentes possibilités d’interaction http://www.prisedetete.net/pdt/prisedetete

son mémoire "BANDE DESSINEE INTERACTIVE : COMMENT RACONTER UNE HISTOIRE ? " memoire

"The Boat" animation/BB [2]

The Guardian - Digital deadly sins [3]

mouchette des interfaces où on peut écrire des trucs, et on clique sur un lien , on atterrit ailleurs. créer de la narration sous ce genre de format http://mouchette.org/to/you/only/private.html

"Hans Hoogerbrugge - Hotel" [4]

Session du 08/10

violette&louisa&laura

PROJET

C'est une plateforme, avec une navigation de pages en pages ( on ne clique pas sur suivant)

La navigation est permise par : des cases à cocher, des liens surs lesquels cliquer

Les manières d'évoluer comptent aussi des inputs d'images, de son, de texte qui réapparaitront plusieurs pages plus tard, soit en générant de la causalité, soit non

Ceci est au service d'une narration qui reprend les grandes étapes de la narration concentrée (exposition, élément déclencheur, péripéties ).

Il y a le caractère principal qui a un rêve à poursuivre, un adjuvant et un opposant Page 1 :on définit le perso principal avec des traits de caractère

Prototype: comment encoder les personnages avec des traits de caractère comment utiliser les traits pour faire varier l'action sur une page 2

--> langage coté serveur php ou python

Schemalh.jpg


Session du 15/10

violette&matthias

Voici une base de codage, vue au cours du 15/10 /!\ il faut aller dans l'onglet modifer pour copier/coller le code tel qu'il est écrit, car le site interprète déjà certains signes et certains mots /!\ (il serait plus efficace de faire un drive pour se partager les fichiers)

-code html

<!doctype html> <html> <head> <title> Démo php </title> <meta charset= "UTF-8"> <link rel="stylesheet" href="habillage.css">

</head> <body> <section> <article> <header> </header>

</article> <form action="traitement.php" method="post">

prénom

<input type="text" name="prénom">

nom

<input type="text" name="nom">

age

<input type="number" name="age">

ton histoire personelle

<textarea name="bio"></textarea>

pilosité

  • <input type="radio" value="barbu" name="pilosité"> barbu
  • <input type="radio" value="imberbe" name="pilosité"> imberbe
  • <input type="radio" value="moustachu" name="pilosité"> moustachu

personnalité

  • <input type="radio" value="téméraire" name="personnalité"> téméraire
  • <input type="radio" value="réfléchi" name="personnalité"> réfléchi
  • <input type="radio" value="débile profond" name="personnalité"> débile profond

morphologie

  • <input type="radio" value="gros" name="morphologie"> gros
  • <input type="radio" value="maigre" name="morphologie"> maigre
  • <input type="radio" value="non mais oh !" name="morphologie"> non mais oh !

<input type="submit" value="envoyer"> </form> </section> </body> </html>

code php

<?php echo "hello world" ;

echo '

'.$_POST['prénom'].'

' ;/* $_POST plus discret que $_GET */ echo '

'.$_POST['nom'].'

' ;/* . sers à joindre une instruction à interpréter et du texte brut = la concaténation */ echo '

'.$_POST['age'].'

' ; echo '

'.$_POST['pilosité'].'

' ; echo '

'.$_POST['personnalité'].'

' ; echo '

'.$_POST['morphologie'].'

' ;

?>


Session du 22/10

violette

les deux pages de la dernière fois , modifiées . le html 

<!doctype html> 
<html> 
<head> 
<title> Démo php </title> 
<meta charset= "UTF-8"> 
<link rel="stylesheet" href="style.css"  >

</head> 
<body> 
<section> 
<article> 
<header> </header>

</article> 
<form action="traitement.php" method="post" >

prénom

<input type="text" name="prénom">

nom

<input type="text" name="nom">

age

<input type="number" name="age">

ton histoire personelle

<textarea name="bio"></textarea>

<p>pilosité</p>

    <input type="radio" value="barbu" name="pilosite"> barbu
    <input type="radio" value="imberbe" name="pilosite"> imberbe
    <input type="radio" value="moustachu" name="pilosite"> moustachu

<p>personnalité</p>

    <input type="radio" value="temeraire" name="personnalite"> téméraire
    <input type="radio" value="refléchi" name="personnalite"> réfléchi
    <input type="radio" value="debile profond" name="personnalite"> débile profond

<p>morphologie</p>

    <input type="radio" value="gros" name="morphologie"> gros
    <input type="radio" value="maigre" name="morphologie"> maigre
    <input type="radio" value="non mais oh !" name="morphologie"> non mais oh !

<input type="submit" value="envoyer"> 
    </form> 
    </section> 
    
    <a href="page2.php">  
<h1>
 le contexte
</h1>
    </a>

    </body> </html>

ET LE PHP 

<?php echo "hello world" ;
echo '

'.$_POST['prénom'].'
' ;/* $_POST plus discret que $_GET */ echo '

'.$_POST['nom'].'
' ;/* . sert à joindre une instruction à interpréter et du texte brut = la concaténation */ echo '



'.$_POST['pilosite'].'
' ; echo '


'.$_POST['morphologie'].'
' ;

if($_POST['pilosite'] == 'barbu'){  
    $variable='rasoir';
    echo "tu es ".$_POST['pilosite']." tu as besoin d'un ".$variable;
}else if($_POST['pilosite'] == 'imberbe'){
    echo 'ta peau est douce';
    
}





?>

et là un essai d'une page mais ça marche pas 

<!doctype html> 
<html>

<head>
<title>contexte
    </title>
<meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
</head>
    
<body>
Nous sommes en 2030, depuis la faille temporelle tout le monde est mort 
    
<p>il y a un enfant en train de se faire bully dans ton champ de vision</p>

    <input type="radio" value="rescue" name="action"> je vais lui sauver la vie
    <input type="radio" value="blc" name="action"> je continue ma life
    

<?php 

if($_POST['il y a un enfant en train de se faire bully dans ton champ de vision'] == 'rescue' && ['personnalite'] == 'debile profond') ){  
    
    echo "tu es ".$_POST['personnalite']." tu as trop peur pour le sauver "
}else if($_POST['il y a un enfant en train de se faire bully dans ton champ de vision'] == 'rescue' && ['personnalite'] == 'temeraire') ){
    echo 'ok go';
    
}





?>

    </body> 
</html>

session du 5/11

nouveau schéma de fonctionnement : index.php ( renseigne toutes les infos ) -----> page2.php ( partie traitement = transforme les variables POST en SESSION ; partie formulaire renseigne la variable action)---->page3.php ( partie traitement = transforme les variables POST en SESSION ; partie affichage echo 2 phrases différentes pour deux combinaisons débile profond/ rescue, et téméraire/rescue )

bilan quadri

Le but c'est d'appliquer la trame narrative de base à une navigation de pages en pages. Ca fonctionne avec php , les input radio influent la narration mais on aimerait bien trouver d'autres formes d'interactivité. Les informations rentrées par le spectateur influent plus tard dans la narration, par exemple la biographie renseignée au début apparait sur la tombe dans le cas de mort. Pour l'instant, les moments narratifs de base sont : 

-à la page 2 il y a possibilité de refuser de rentrer dans ce qui s'apparente aux péripéties ce qui bloque tout le processus narratif et bloque le personnage à une exposition illimitée
-la rencontre de l'adjuvant puis d'un super super-adjuvant
-La détermination de l'objet de quête page 6

Par ailleurs, on est en train de faire en sorte de créer une jauge, alimentée par la force, ou l'intégrité Schemanarration.png

code actuel INDEX : détermination de personnage 

<!doctype html> 
<?php
	session_start();
	$_SESSION['force'] = 0;
	$_SESSION['integrite'] = 0;
	$_SESSION['score'] = $_SESSION['force']+$_SESSION['integrite'];
?>

<!doctype html> 
<html> 
<head> 
<title> Démo php </title> 
<meta charset= "UTF-8"> 
<link rel="stylesheet" href="style.css"  >

</head> 
<body> 
<section> 
<article> 
<header> merci de bien rensigner toutes les infos</header>

</article> 
<form action="page2.php" method="post" >

prénom

<input type="text" name="prenom">

nom

<input type="text" name="nom">

age

<input type="number" name="age">

ton histoire personelle

<!-- <textarea name="bio"></textarea> -->
<input type="text" name="bio">

<p>pilosité</p>

    <input type="radio" value="barbu" name="pilosite"> barbu
    <input type="radio" value="imberbe" name="pilosite"> imberbe
    <input type="radio" value="moustachu" name="pilosite"> moustachu

<p>personnalité</p>

    <input type="radio" value="temeraire" name="personnalite"> téméraire
    <input type="radio" value="refléchi" name="personnalite"> réfléchi
    <input type="radio" value="debile profond" name="personnalite"> débile profond

<p>morphologie</p>

    <input type="radio" value="gros" name="morphologie"> gros
    <input type="radio" value="maigre" name="morphologie"> maigre
    <input type="radio" value="non mais oh !" name="morphologie"> non mais oh !
	
<input type="submit" value="envoyer"> 
    </form> 
    </section> 
    
    

    </body> </html>


PAGE 2 : l'élément déclencheur 

<?php
    session_start();
    $_SESSION['prenom'] = $_POST['prenom'];
    $_SESSION['nom'] = $_POST['nom'];
    $_SESSION['age'] = $_POST['age'];
    $_SESSION['pilosite'] = $_POST['pilosite'];
    $_SESSION['personnalite'] = $_POST['personnalite'];
    $_SESSION['morphologie'] = $_POST['morphologie'];
    $_SESSION['bio'] = $_POST['bio'];

?>


<!doctype html> 
<html>

<head>
<title>contexte
    </title>
<meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
</head>
    
<body>
Nous sommes en 2030, depuis la faille temporelle tout le monde est mort 
    
<p>il y a un enfant en train de se faire bully dans ton champ de vision</p>
<form action="page3.php" method="post">
    <input type="radio" value="rescue" name="action"> je vais lui sauver la vie
    <input type="radio" value="blc" name="action"> je continue ma life
    <input type='submit' value="envoyer">
</form>


    </body> 
</html>
<!doctype html>

PAGE 3 : réaction au choix, soit poursuite de l'aventure, soit mort car combinaison d'incapacité physique et rescue, soit refus d'entrer dans la narration donc blocage 

<!doctype html> 
<?php
    session_start();
    $_SESSION['action'] = $_POST['action'];
   // print_r($_SESSION);


?>


<!doctype html> 
<html>

<head>
<title>contexte
    </title>
<meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
</head>
    
<body>

<?php 

if($_SESSION['action'] == 'rescue' && $_SESSION['personnalite'] == 'debile profond'){  
    
    echo "tu es ".$_SESSION['personnalite']." tu as trop peur pour le sauver ";
    echo "<a href=\"dead.php\">retour à la case départ bolosse";
}else if($_SESSION['action'] == 'rescue' && $_SESSION['personnalite'] == 'temeraire'|| $_SESSION['personnalite'] == 'reflechi'){
    echo 'ok go';
    echo "<a href=\"page4.php\">l'aventure continue";
//}else if($_SESSION['action'] == 'blc' && $_SESSION['personnalite'] == 'debile profond'{
   // echo 'ouais normal';
}else {
    echo "ok ma caille";
    echo "<a href=\"exposition.php\">les péripéties c est pas pour maintenant";
    
}





?>

    </body> 
</html>


PAGE 4 : les péripéties commencent 

<!doctype html> 

<?php
    session_start();
    // $_SESSION['prenom'] = $_POST['prenom'];
     //$_SESSION['nom'] = $_POST['nom'];
   // $_SESSION['age'] = $_POST['age'];
    // $_SESSION['pilosite'] = $_POST['pilosite'];
     //$_SESSION['personnalite'] = $_POST['personnalite'];
     //$_SESSION['morphologie'] = $_POST['morphologie'];

?>


<!doctype html> 
<html>

<head>
<title>contexte2
    </title>
<meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
</head>
    
<body>
ça bouge avec l'enfant, tac tac tac le bruit des semelles sur le béton armé, par terre tu vois un paquet de biscuits
    
<p>quand tu le prend une souris en sort, mais tu as très faim</p>
<form action="page5.php" method="post">
    <input type="radio" value="mange" name="action2"> j'en mange un et lui donne le reste du paquet"
    <input type="radio" value="mangetout" name="action2"> MIAM MIAM J AI TROP FAIM JE MANGE TOUT
    <input type="radio" value="beurk" name="action2"> je lui donne tout, je suis trop quelqu'un de bien
    <input type='submit' value="envoyer">
</form>


    </body> 
</html>

PAGE 5 : l'enfant devient ( éventuellement )un adjuvant 

<!doctype html> 

<?php
    session_start();
    $_SESSION['action2'] = $_POST['action2'];
    //$_SESSION['prenom'] = $_POST['prenom'];
   // print_r($_SESSION);

?>

<!doctype html> 
<html>

<head>
<title>page5
    </title>
<meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
</head>
    
<body>

<?php 

if($_SESSION['action2'] == 'mange'){  
echo "tu as un peu faim mais ce n'est rien comparé à la lueur de remerciement dans les yeux de l'enfant, +1 force +4 intégrité ";
    
}else if($_SESSION['action2'] == 'mangetout' ){
    echo "oula j ai le bidou tout rempli, +2 force";
   
//}else if($_SESSION['action'] == 'blc' && $_SESSION['personnalite'] == 'debile profond'{
   // echo 'ouais normal';
}else {
    echo "bon, cet enfant te doit la vie mais tu as toujours très faim, +5 intégrité ";}

echo "tu as .... GAGNE MA CONFIANCE  ".$_SESSION['prenom'] ;
echo "<a href=\"coach.php\">  je vais te faire rencontrer mon coach ";








?>
 
    </body> 
</html>

PAGE COACH : le coach s'avère être le destinataire de l'objet de la quête 

<!doctype html> 

<?php
    session_start();
   
?>


<!doctype html> 
<html>

<head>
<title>contexte
    </title>
<meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
</head>
    
<body>
 
 je suis coach en dévellopement personnel, je suis sévère mais juste, attention aux pervers narcissiques
    

<img id="coach" src="coach.jpg">
<p> ENFANT dit : c'est le super adjuvant</p>

<p>COACH dit : je suis l'adjuvant ultime oui, quel est l'objet de ta quête ?</p>
    
    <p>ma quête</p>
<form action="page6.php" method="post">
    <input type="radio" value="survivre" name="quete"> survivre
    <input type="radio" value="fort" name="quete"> devenir le plus fort
    <input type="radio" value="7" name="quete"> découvrir mes 7 blessures de l'âme
    
</form>
    
    
    </body> 
</html>

schéma actuel de la narration

Chema2.png

le projet de violette

Le but c'est d'appliquer la trame narrative de base à une navigation de pages en pages.

Ca fonctionne avec php. En transformant des variables SESSION en variables POST, toutes les informations données par l'utilisateur sont enregistrées et permettent dêtre ré expoitées plus tard. Ce qui fait une bonne narration entre autres c'est comment on va au au bout de ce qu 'on peut exploiter avec les éléments on a mis en place.

La première page correspond à la caractérisation d'un personnage. Toutes les variables permettent une avancée du récit.Pour ce qui concerne la catégorie voix off, le but initial était de les générer (aléatoirement)durant la navigation. (en fait les moments dont déterminéset ils apparaissent parfois sous forme d'alert). Elle permet d'"accéder à l'intériorité du personnage", ainsi lorsque la dramaturgie mise en place, donc tout l'extime tout ce qui se voit en acte (comme un dialogue) , n'est pas suffisant pour cerner la situation, on peut y avoir accès à travers l'intime. La catégorie bio se retrouve sur une tombe en cas d'échec.

La page 2 est l'élément déclencheur. Il existe plusieurs solutions pour la page 3 par rapport aux caractère choisi à l'index. Avec la combinaison téméraire/lui sauver la vie. Le personnage rentre dans les péripéties. Si on a choisi la personnalité tout mou, on est trop faible pour ce monde et l'on est renvoyé à la page mort. il y a aussi la possibilité de refuser de rentrer dans ce qui s'apparente aux péripéties ce qui bloque tout le processus narratif et bloque le personnage à une exposition illimitée et l'impossibilité d'en sortir sinon la mort

A la page 4, les 3 réactions renvoie aux caractère choisi. L'option soin ou le fait de faire matcher le caractère et la réaction permet de poursuivre la navigation.

Récupérée de « https://curlybraces.be/wiki/index.php?title=ERG::interactivenarration&oldid=3210 »