Narrations interactives : une introduction

NARRATIONS interactives

juin 2015

tlab.mars

Annabel Roux - Design interactif

NARRATIONS interactives

?

cc by-nc-sa annabel roux @ tlab.mars

#documentaire interactif

#webdoc#fiction interactive #newsgames

#long-form#série digitale


#storytelling digital

#storytelling interactif

#nouvelles écritures

#serious games#webfiction

#expérience interactive

un art du récit pour aujourd’hui

des histoires dans lesquelles je m’implique

Why so serious - campagne transmédia The Dark Knight - 2008


J’influe sur le cours du récit

par mes choix et actions

Uchroniques par Henri Tripod, Patrick Mallet - documentaire interactif - 2015


http://uchroniques.nouvelles-ecritures.francetv.fr/


Le récit s’adapte

à mon profil, mes usages, mon contexte

In Limbo par Antoine Viviani - documentaire interactif - 2015


http://inlimbo.tv/fr/


je participe à la conversation

au travers de mon activité en ligne

Viol, les vois du silence- France Télévision - documentaire interactif + plateforme participative- 2013


http://viol-les-voix-du-silence.francetv.fr/


J'interagis avec les protagonistes /

les autres utilisateurssur les réseaux sociaux, dans le réel

Fais pas ci, fais pas ça - France Télévision - accompagnement transmédia de la série -


https://www.facebook.com/fanfan2quinzeansapres

Je suis le co-auteur /

co-producteurgrâce à mes contributions créatives / financières

The Johnny Cash Project - Chris Milk - 2010


https://www.youtube.com/watch?v=WwNVlNt9iDk

http://www.thejohnnycashproject.com/

Je m’approprie l’univers narratif

je remixe, je créé (fan art, fan fiction)

Citizen Fan - France Télévisions Nouvelles Ecritures - documentaire interactif- 2014

http://citizen-fan.nouvelles-ecritures.francetv.fr/

#narration

#journalisme

#communication

#fiction

#documentaire


#information#publicité

#sensibilisation

#data journalism

http://www.nytimes.com/projects/2012/snow-fall/#/?part=tunnel-creek

http://awwwards.com

http://sortieenmer.com/

http://www.lavieasac.com/

http://www.bloomberg.com/graphics/2015-oscar-winners/

#(hyper)texte

#vidéo

#photographie#illustration

#son#animation

#BD


#données

http://thelasthunt.nfb.ca/#/thelasthunt

http://lebruitdesmots.radio-canada.ca/

http://alma.arte.tv/fr

http://serialpodcast.org/

http://pinepoint.nfb.ca/#/pinepoint

http://annefrank.arte.tv/fr/

http://www.theguardian.com/world/ng-interactive/2014/jul/23/a-global-guide-to-the-first-world-war-interactive-documentary


#transmédia

#crossmédia

#bimédia#app mobile

#web app

#site web

#installation

#monomédia

#multi-supports

http://cathedrale.arte.tv/le-webdoc.php


http://futur-par-starck.arte.tv/

https://itunes.apple.com/fr/app/id667443268

https://www.youtube.com/watch?t=31&v=kN3PZ3ay1Lw

ÉCRITURES interactives


#délinéarisation

#multimédia

#hypertexte


#hypermédia

#feedback#agency


#interactivité

#flow

En quête d’un équilibre entre narration & interaction

le paradoxe des narrations interactives


entre narration & interaction structure du récit

# Linéaire # Linéaire élastique (en arrêtes de poisson) # Ramifiée (à embranchements) # Multimodale (constellation, sémantique…)

# Générative # Ouverte (monde ouvert, exploratoire)

cc by-nc-sa - annabel roux / nicolas dupont / nicolas bole @ tlab.mars / florent maurin @pixel hunt / gerald holubowicz @ chewbahat

Narration

Interaction

http://insitu.arte.tv/fr/

http://www.hollowdocumentary.com/

http://assemblee-nationale.curiosphere.tv/#/bienvenue

http://www.un-ete-a-alger.com/

http://the-end.nouvelles-ecritures.francetv.fr/

http://worldbrain.arte.tv/#/

entre narration & interaction affaire de point de vue

# Unique : favorise l’identification # Multiple : offre des opportunités d’extension, donne

une plus grande liberté

# Subjectif / Interne : fréquemment employé pour susciter immersion et empathie

# Objectif / Externe - Omniscient / Zéro

cc by-nc-sa annabel roux / nicolas dupont / nicolas bole @ tlab.mars / florent mourin @pixel hunt / gerald holubowicz @ chewbahat

http://bear71.nfb.ca/#/bear71

http://gaza-sderot.arte.tv/


http://assemblee-nationale.curiosphere.tv/

PANORAMA 2013 - 2015

cc by-nc-sa annabel roux @tlab.mars / michael wohlwend @thenounproject

Radio Canada - 2013

Émilie fiction interactive transmédia


http://emilie.radio-canada.ca/

Arte / ONF - 2014

Fort Mc Money jeu documentaire + documentaire


http://www.fortmcmoney.com/#/fortmcmoney

France Télévisions - 2014

Jeu d’influences documentaire + newsgame


http://jeu-d-influences.france5.fr/

Arte / ONF - 2015

In Limbo documentaire interactif +

documentaire



Upian / Arte - 2015

Do Not Track série documentaire interactive


Série documentaire Linéaire Multiple Externe

https://donottrack-doc.com/fr/

Camera Lucida - 2015

The Enemy expérience documentaire en

réalité virtuelle


http://www.apple.fr

The Mill - 2015

Help fiction interactive 360°


https://www.youtube.com/watch?v=prQF4iLLiFw

CRÉER Les 6 étapes de la création interactive

cc by-nc-sa annabel roux @tlab.mars / michael wohlwend @thenounproject

DESIGN INTERACTIF

COMMUNITY BUILDING /

MANAGEMENT

PRODUCTION AUDIOVISUELLE

transdisciplinaire & collaboratif


itératif & incrémental


INTENTION


QUOI ?QUOI ?

QUI ?

COMMUNITY BUILDING

DESIGNINTERACTIF

2

IDÉATION


COMMUNITY BUILDING

DESIGNINTERACTIF

3

QUOI ?QUOI ?

QUI ?

CONCEPTION


COMMUNITY BUILDING

DESIGNINTERACTIF

4

QUOI ?QUOI ?

QUI ?

PROTOTYPAGE


COMMUNITY BUILDING

DESIGNINTERACTIF

5

QUOI ?QUOI ?

QUI ?

DÉVELOPPEMENT


COMMUNITY BUILDING

DESIGNINTERACTIF

6

QUOI ?QUOI ?

QUI ?

CRÉER Acteurs de la création interactive

cc by-nc-sa annabel roux @ tlab.mars / moh kamaru @thenounproject

cc by-nc-sa annabel roux @ tlab.mars / source : designersinteractifs.org

Sa mission

#Ecrivain #Illustrateur

#Journaliste#Réalisateur #Photographe

#Scénariste

écrire l’histoire, créer l’univers

Ses tâches # expliciter son intention, la nature de l’expérience proposée # identifier les thèmes, motifs # définir les arches dramatiques du récit principal, des personnages # documenter l’univers narratif : monde, personnages, factions # veiller à la cohérence narrative

#Auteur

http://designersinteractifs.org


Leur mission

#Designer d’expérience#Designer d’interfaces

#Architecte de l’information

#Ergonome

#Architecte transmédia #Webdesigner

#Designer d’interaction

concevoir des interactions et interfaces faciles à utiliser, porteuses de sens et d’émotion.

Leurs tâches # définir comment est organisé le contenu # identifier et définir les profils d’utilisateurs # définir comment les utilisateurs entrent et circulent dans le

contenu # définir quand et comment les utilisateurs agissent sur le contenu # définir la structure des écrans (navigation, hiérarchie de

l’information)

Leurs tarifs 400 à 550 €/jour

#Game designer

#Designer(s) interactif(s)



Sa mission

#Designer d’interfaces

créer une identité visuelle cohérente et attractive

Ses tâches # définir les principes structurants l’identité visuelle # Logo / signature # Palette chromatique # Typographie # Iconographie / traitement visuel

# élaborer la charte graphique, superviser son application # créer les maquettes graphiques des écrans

Ses tarifs 400 à 500 €/jour

#Directeur artistique interactif

#Directeur artistique#Directeur de création



Sa mission

#Designer d’interfaces

créer l’habillage graphique

Ses tâches # créer les maquettes graphiques des écrans à partir de la charte graphique et des wireframes

# créer les objets graphiques # préparer les maquettes graphiques pour les développeurs web


#Web designer



Sa mission

#Chef de projet technique

#Codeur créatif

proposer des solutions techniques pertinentes et innovantes

Ses tâches # dresser un état de l’art des technologies # identifier les technologies mobilisables # évaluer la faisabilité et la complexité # définir et spécifier l’architecture et les briques techniques # faire l’interface entre équipe créative et équipe technique # piloter les développements techniques


#Creative technologist#Consultant technique



Sa mission

#Développeur full stack

#Développeur front office / front end

programmer

Ses tâches # coder l’interface et les fonctionnalités # structurer les données # intégrer les briques de code # tester les développements # déployer les développements sur plateforme de diffusion


#Développeur back office / back end

#Développeur web



Sa mission constituer et mobiliser une communauté autour du projet

Ses tâches # cartographier thèmes et communautés affinitaires # constituer un fichier de contacts # définir la stratégie éditoriale et la charte de community

management # dialoguer avec la communauté # animer les points de contact avec la communauté


#Community manager



#Tous les autres#Data scientist

#Data analyst

#Designer sonore

#Scénographe#Maker

#Chercheur

#Motion designer


FINANCER

cc by-nc-sa annabel roux @ tlab.mars / till teenck @ thenounproject

un modèle économique qui se

chercheentre pré-financement et entrepreunariat

cc by-nc-sa annabel roux @ tlab.mars / jacob walti @ unsplash

Alma Une enfant de la violence

550 K€

Documentaire + Documentaire interactif + Livres Upian / Arte

cc by-nc-sa annabel roux / nicolas bole @ tlab.mars / Upian - Arte

Arte : 210 K€ CNC : 100 K€

Tribeca New Media Fund : 50 K$

400 K€

Jeu (web, iPad / Android, Facebook) + installation Agat Films - Ex Nihilo / Arte

cc by-nc-sa annabel roux / nicolas bole @ tlab.mars / Upian - Arte

Arte : 130 K€ CNC : 120 K€

financements publics 50% du budget max.

cc by-nc-sa annabel roux / nicolas dupont @ tlab.mars

# Les aides du CNC # Automatique : le Web COSIP # Sélective : les aides Nouveaux Médias

# L’aide à la production transmedia de l’INA # Les aides des Conseils Régionaux # Les aides Creative Media de l’Union Européenne

http://www.cnc.fr/web/fr/web-cosip

http://www.cnc.fr/web/fr/aide-aux-projets-nouveaux-medias

http://www.institut-national-audiovisuel.fr/appel-transmedia-lancement.html

http://www.mediafrance.eu/-Aides-aux-producteurs-.html

Web COSIP du CNC producteurs avec compte automatique

Sous réserve d’un pré-achat par plateforme de diffusion internet

# Apport en numéraire du diffuseur de 25% min. # Aide à la production non cumulable avec aide

sélective à la production # Cumul possible développement / production


aides sélectives du CNC 2 types d’aide

En fonction du modèle de diffusion

# Multi-supports # TV ou Cinéma + Internet # max. 50 K€

# Internet # web et/ou mobile # max. 20 K€


aides sélectives du CNC auteurs ET producteurs

En fonction de l’avancement du projet

# Ecriture et développement # Possibilité de cumul (aide ventilée) # Dispositif ouvert aux auteurs (écriture)

# Production # Avec engagement d’un diffuseur # Producteurs seuls


aide de l’INA production de projets transmedia

Lancée cette année. Conditionnée par pré-achat diffuseur internet.

# 2 écrans au minimum # Apport en numéraire jusqu’à 200 K€ # Apport en industrie possible

# Droits d’exploitation archives # Moyens de production, post-production


aides régionales

Conditionnées par les dépenses dans la région concernée. Ecriture / développement et/ou production, auteurs et/ou producteurs selon les régions.

# Nord - Pictanovo : Expériences interactives # Aquitaine # PACA # Et bien d’autres : télécharger le guide des

financements publics au transmedia et aux œuvres interactives (2012 -Media PACA)


http://www.mediafrance.eu/IMG/pdf/Guide_des_financements_publics_au_transmedia_Juin_2012.pdf

financements privés 50% du budget min.

# Les apports des diffuseurs # Le crowdfunding # Le mécénat

# Fondations d’entreprises # ONG

# Le sponsoring


# Le Pixel Lab (Power to the Pixel, UK) # Sundance New Frontier Story Lab (Sundance

Institute, USA) # Dispositifs d’aides régionaux incluant un

accompagnement.


accompagnement à destination des producteurs

http://www.powertothepixel.com/#pixel-lab-area

http://www.sundance.org/programs/new-frontier

bourses à la création à destination des auteurs

# La SCAM (6 K€ max.) # Brouillon d’un rêve numérique (octobre) # Brouillon d’un rêve multimédia (mars)

# La SACD / Orange : formats innovants (mars, 7K€) # La Fondation Lagardère : créateur numérique

(juin, 26 K€) # Et à destination des producteurs : TFI New Media

Fund (mai, 100 K$ max.)


http://www.scam.fr/Portals/0/Contenus/documents/appel_candidatures/Bourses/BOURSE_NUM.pdf

http://www.scam.fr/Portals/0/Contenus/documents/appel_candidatures/Bourses/BoursesMultimedia.pdf

http://beaumarchais.asso.fr/aides-a-lecriture/formats-innovants/

https://tribecafilminstitute.org/pages/new_media_rules

résidences d’écriture à destination des auteurs

# Écriture transmedia (Agence culturelle Alsace -février)

# Numérique et transmedia (Écla Aquitaine - été) # Laboratoire Emergence (Institut Français - The

BANFF Centre) # … : ouvrez l’œil !


http://www.formations.culture-alsace.org/fr/cinema-et-image-animee/residence-d-ecriture-transmedia

http://chaletmauriac.aquitaine.fr/?page_id=136

http://www.banffcentre.ca//programs/program.aspx?id=1591

revenus modèle entrepreneurial

# Commercialiser l’œuvre # App stores # VOD

# et ses produits dérivés # Livre / BD # Merchandising # …


DIFFUSER


Diffuseurs TV

# France Télévisions # Arte # Canal + # Chaînes TNT


Médias d’information

# Le Monde # Télérama, Rue 89, Mediapart, Courrier

international, L’Équipe … # Radio France # …


Et aussi…

# YouTube # DailyMotion # Vimeo # Plateformes VOD # Plateformes auto-édition # …


Et enfin…

# Cross Vidéo Days # FIPA # Power to the Pixel # Sunny Side # IDFA # Et de plus en plus de festivals intégrant les

narrations interactives


LIENS


# Un art du récit pour aujourd’hui # Chris Anderson, The Long Tail

(2006) # Chris Anderson, Free, why $0.00 is

the future of business (2008) # Étude The Future of Storytelling

(2013) # Citizen Fan

# J’influe sur le court du récit # Voyage au bout du charbon # Thanatorama # Jour de Vote # The end etc. # Fort McMoney # Jeu d’influences # Uchroniques

# Le récit s’adapte # In Limbo # Do Not Track

# Je participe à la conversation # The Brussel Business Online # Prison Valley # Fort McMoney # Viol, les voix du silence # Do Not Track

# Je suis co-auteur / co-producteur # Anarchy # The Johnny Cash Project


http://www.longtail.com/about.html

http://archive.wired.com/techbiz/it/magazine/16-03/ff_free?currentPage=all

http://www.futureofstorytellingproject.com/


http://www.lemonde.fr/asie-pacifique/visuel/2008/11/17/voyage-au-bout-du-charbon_1118477_3216.html

http://www.thanatorama.com/



http://www.fortmcmoney.com/



http://inlimbo.tv/


http://brusselsbusiness.arte.tv/

http://prisonvalley.arte.tv/




http://anarchy.nouvelles-ecritures.francetv.fr/

https://www.youtube.com/watch?v=WwNVlNt9iDk

# Je m’approprie l’univers # Citizen Fan

# Genres # Information

# 2014 the year in interactive storytelling - New York Times

# Snow Fall - New York Times # How to build an oscar winner -

Bloomberg # Communication

# Why so Serious ? # The Art of Heist # Sortie en Mer # Awwwards # La Vie en Sac # À l’abri de rien # Diplomates

# Médias # Texte

# The Last Hunt # Photographie

# Le Corps Incarcéré # Le Bruit des Mots # Clichés de Campagne

# Illustration # Jeu d’influences # Alma

# BD # Iranorama # Anne Frank au Pays du Manga

# Animation # Je suis Super 2.dtg # Pine Point

# Son # Serial



http://www.nytimes.com/interactive/2014/12/29/us/year-in-interactive-storytelling.html?_r=1

http://www.nytimes.com/projects/2012/snow-fall/

http://www.bloomberg.com/graphics/2015-oscar-winners/

https://www.youtube.com/watch?v=z5w2CNB9clw

http://sortieenmer.com/

http://awwwards.com

http://www.lavieasac.com/

http://www.a-l-abri-de-rien.com/

http://webdocs.diplomatie.gouv.fr/diplomates/


http://www.lemonde.fr/societe/visuel/2009/06/22/le-corps-incarcere_1209087_3224.html


http://clichesdecampagne.franceinter.fr/#main



http://webdoc.france24.com/iranorama-1/

http://annefrank.arte.tv/

http://je-suis-super.nouvelles-ecritures.francetv.fr/

http://pinepoint.nfb.ca/#/pinepoint

http://serialpodcast.org/

# Données # We Feel Fine # Bear 71 # Génération Quoi # La première guerre mondiale,

histoire d’un conflit international # In Limbo

# Plateformes # Apps

# Alt-Minds # Type:rider # Corto Maltese, Secrets de Venise

# Installations # Type:rider # The Enemy # Jaurès Pas à Pas

# Bimédia / second écran # Futur par Starck # Cut

# Crossmédia # Prison Valley # Alma # In Limbo

# Transmédia # In Situ # Le Défi des Bâtisseurs

# Écritures interactives # Structure linéaire

# In Situ # The Last Hunt # World Brain # In Limbo

# Structure élastique # Prison Valley # Hollow # Do Not Track


http://www.wefeelfine.org/


http://generation-quoi.france2.fr/

http://www.theguardian.com/world/ng-interactive/2014/jul/23/a-global-guide-to-the-first-world-war-interactive-documentary

http://inlimbo.tv/

https://itunes.apple.com/fr/app/id667443268

https://itunes.apple.com/fr/app/corto-maltese-secrets-venise/id933914745?mt=8

https://www.youtube.com/watch?t=31&v=kN3PZ3ay1Lw

http://theenemyishere.org/fr/

http://jaures-pas-a-pas.fr/

http://futur-par-starck.arte.tv/

https://www.facebook.com/Jules974.Cut

http://prisonvalley.arte.tv/


http://inlimbo.tv/

http://insitu.arte.tv/fr/#/home

http://cathedrale.arte.tv/le-webdoc.php

http://insitu.arte.tv/fr/#/home


http://worldbrain.arte.tv/

http://inlimbo.tv/fr




# Structure ramifiée (à embranchements) # Voyage au bout du charbon # Thanatorama # Jour de Vote

# Structure multimodale # Le Corps Incarcéré # Gaza / Sderot # Le Bruit des Mots # Un Été à Alger

# Structure ouverte (monde ouvert) # Fort McMoney # Je suis Super 2.dtg # World Brain

# Structure générative # The end etc. # Le jeu des mille histoires


# Point de vue unique # Jour de vote # Bear 71

# Point de vue multiple # Gaza Sderot # Un Été à Alger

# Focalisation interne # Bear 71

http://www.lemonde.fr/asie-pacifique/visuel/2008/11/17/voyage-au-bout-du-charbon_1118477_3216.html

http://www.thanatorama.com/


http://www.lemonde.fr/societe/visuel/2009/06/22/le-corps-incarcere_1209087_3224.html

http://gaza-sderot.arte.tv/fr/




http://je-suis-super.nouvelles-ecritures.francetv.fr/

http://worldbrain.arte.tv/#/


http://1000-histoires.franceinter.fr/



http://gaza-sderot.arte.tv/fr/



MERCI !

tlab.mars @TLabMars - tlabmars.org

@annabelroux - fbrq.fr

http://tlabmars.org

http://fbrq.fr