SlideShare a Scribd company logo
1 of 37
Download to read offline
VIDÉOS POUR LE WEB
   et réalité augmentée
QUI EST EPIC?
•   Agence créative
    •   Créée en 2009;
    •   7 personnes;
    •   Quelques clients: L’Oréal, Leidgens sprl, Etilux, Quatuor, Chocol@, ...

•   Passionnés de nouvelles technologies et de design
KARIM MAALOUL




45 %
         55 %




Design
Développement flash
KARIM MAALOUL


                       Mais Flash est mort, non ?

                       flash est inutile, parceque html5,
45 %
          55 %         canvas, javascript, c’est génial, c’est
                       beau, c’est propre et ça fait la paix dans le
                       monde...

                       tic tac tic tac...



 Design
 Développement flash
VIDÉO POUR LE WEB
étude de cas #1


  AMÉNAGEMENTS EXTÉRIEURS
LEIDGENS.BE
•   Historique de l’entreprise
    •   L’historique de la société a une vraie valeur ajoutée
    •   Entreprise familiale, personnages charismatiques
    •   Les gens ne lisent pas
LEIDGENS.BE


Interview   +    Courbes   =
LEIDGENS.BE
              •   Design,

              •   Préparation et briefing

7 - 8 JOURS   •   Tournage

              •   Derushage, post-prod

              •   Développement flash
étude de cas #2


  AMÉNAGEMENTS EXTÉRIEURS




  oui encore eux
LEIDGENS.BE
•   Vidéos de présentation
    •   Ambiance, valeurs et procédés
    •   Rassurer le client potentiel
    •   Immerger le visiteur dans la vie de l’entreprise
LEIDGENS.BE


Immersion   +   Stats   =
LEIDGENS.BE
            •   Design,

            •   Préparation et briefing

            •   Tournage

5 JOURS     •   Derushage,

            •   Tracking

            •   Incrustation (after effects)

            •   Compression
étude de cas #3


        AMÉNAGEMENTS EXTÉRIEURS




après on en parle plus, promis !
LEIDGENS.BE
•   Vidéos de jardins
    •   Reproduire la sensation de se promener dans un jardin
    •   Faire découvrir les différents départements
    •   Permettre au visiteur d’en savoir plus sur ce qu’il voit
SOLUTION ?
RA, AVEC WEBCAM
•   Besoin du bon marqueur

•   Technologie capricieuse
    •   luminosité
    •   distance
    •   cpu

•   Très 2008 !

•   Assez simple à implémenter

•   Reste le meilleur compromis pour de la RA via webcam
RA, POUR VIDEOS EN «DIFFÉRÉ»
•   Coller des marqueurs sur les arbres ?

•   Tracking 2D (after effects) + export des données vers flash ?

•   Animer les blocs en flash (timeline) ?

•   Recourir à un logiciel de tracking 3D ?
RA, POUR VIDEOS EN «DIFFÉRÉ»
•   Syntheyes

•   Envoi des données à Flash

•   3D des blocs cliquables grâce à papervision
Premiers tests :
La canette de coca
LEIDGENS.BE
                     •   Design,


        10 JOURS     •
                     •
                         Incrustation (Flash + papervision)

                         Gestion des interactions


                     •   Préparation et briefing

                     •   Tournage

4 -5 JOURS / VIDÉO   •   Derushage,

                     •   Tracking

                     •   Définition des blocs
étude de cas #4


Chocol by Darcis
CHOCOL-AT.BE
•   Concept original

•   Produit personnalisable

•   Produit de luxe

•   Made by Jean-Philippe Darcis
CHOCOL-AT.BE
•   ça serait chouette si on pouvait ...
    •   montrer Darcis entrain de préparer le chocolat
    •   montrer le coffret sous différents angles
    •   montrer le message que le client a écrit dans la vidéo
    •   partager la vidéo avec ses amis
Premiers tests :
Le coffret de chocolat
CHOCOL-AT.BE
               •   Préparation et briefing

               •   Tournage

               •
12 JOURS
                   Derushage, Montage

               •   Tracking

               •   Incrustation (développement flash)

               •   Développement du player video
INSPIRATIONS
•   Stranger than a fiction

•   Release the freq

•   Macro Kingdom

•   Hyundai Accent
PERSPECTIVES
•   Nouvelles fonctionnalités de flash
    •   StageVideo depuis la version 10.2
    •   Le futur player Molehill, (3d complexe, accélération GPU)



•   Nouvelles technologies de tracking
    •   Kinect (pas encore adapté au web)
    •   Head-tracking
ON CHERCHE
Un project manager / account
    info@epicagency.net
QUESTIONS ? COMMENTAIRES ?
     @epicwebagency / @yakudoo

        www.epicagency.net
MERCI !

More Related Content

Similar to Café Numérique Liège #9: la Vidéo Numérique

Kujjuk Solution globale de présentation de produits - fiches produits
Kujjuk Solution globale de présentation de produits - fiches produitsKujjuk Solution globale de présentation de produits - fiches produits
Kujjuk Solution globale de présentation de produits - fiches produitsLeoGinailhac
 
Agence Audiovisuelle Pinkanova - Présentation
Agence Audiovisuelle Pinkanova - PrésentationAgence Audiovisuelle Pinkanova - Présentation
Agence Audiovisuelle Pinkanova - PrésentationPinkanova
 
Formations Mobiles : le catalogue 2014-2015
Formations Mobiles : le catalogue 2014-2015Formations Mobiles : le catalogue 2014-2015
Formations Mobiles : le catalogue 2014-2015Dominique Dufour 杜多
 
Comment intégrer la R&D dans la création d'un business viable ?
Comment intégrer la R&D dans la création d'un business viable ?Comment intégrer la R&D dans la création d'un business viable ?
Comment intégrer la R&D dans la création d'un business viable ?Technofutur TIC
 
Introduction rencontre Mobile Product Management par WDPM
Introduction rencontre Mobile Product Management par WDPMIntroduction rencontre Mobile Product Management par WDPM
Introduction rencontre Mobile Product Management par WDPMWDPM
 
Comment construire son Netflix
Comment construire son NetflixComment construire son Netflix
Comment construire son NetflixJustindwah
 
Real Options - Agile France 2013
Real Options - Agile France 2013Real Options - Agile France 2013
Real Options - Agile France 2013AgileCoach.net
 
HTML5 / CSS3 : Mythes et realite
HTML5 / CSS3 : Mythes et realiteHTML5 / CSS3 : Mythes et realite
HTML5 / CSS3 : Mythes et realiteRaphaël Goetter
 
Breew presentation 2015 - hes lausanne
Breew presentation 2015 - hes lausanneBreew presentation 2015 - hes lausanne
Breew presentation 2015 - hes lausanneThierry Weber
 
Scrum : les sujets qui fâchent
Scrum : les sujets qui fâchentScrum : les sujets qui fâchent
Scrum : les sujets qui fâchentBruno Borghi
 
Real Options Lean Kanban France 2013
Real Options Lean Kanban France 2013Real Options Lean Kanban France 2013
Real Options Lean Kanban France 2013AgileCoach.net
 
Présentation de l'agence Eliophot
Présentation de l'agence EliophotPrésentation de l'agence Eliophot
Présentation de l'agence EliophotFabrice Granier
 
meetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetes
meetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetesmeetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetes
meetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetesFrederic Leger
 
Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012
Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012
Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012Chipway
 
Agile Tour 2010 - Mise en place d'un projet agile
Agile Tour 2010 - Mise en place d'un projet agileAgile Tour 2010 - Mise en place d'un projet agile
Agile Tour 2010 - Mise en place d'un projet agileLaurent Deséchalliers
 
AT2010 Mise place d'un projet Agile
AT2010 Mise place d'un projet AgileAT2010 Mise place d'un projet Agile
AT2010 Mise place d'un projet AgileNormandy JUG
 

Similar to Café Numérique Liège #9: la Vidéo Numérique (20)

Kujjuk Solution globale de présentation de produits - fiches produits
Kujjuk Solution globale de présentation de produits - fiches produitsKujjuk Solution globale de présentation de produits - fiches produits
Kujjuk Solution globale de présentation de produits - fiches produits
 
Kinect en entreprise
Kinect en entrepriseKinect en entreprise
Kinect en entreprise
 
Agence Audiovisuelle Pinkanova - Présentation
Agence Audiovisuelle Pinkanova - PrésentationAgence Audiovisuelle Pinkanova - Présentation
Agence Audiovisuelle Pinkanova - Présentation
 
Formations Mobiles : le catalogue 2014-2015
Formations Mobiles : le catalogue 2014-2015Formations Mobiles : le catalogue 2014-2015
Formations Mobiles : le catalogue 2014-2015
 
Comment intégrer la R&D dans la création d'un business viable ?
Comment intégrer la R&D dans la création d'un business viable ?Comment intégrer la R&D dans la création d'un business viable ?
Comment intégrer la R&D dans la création d'un business viable ?
 
Introduction rencontre Mobile Product Management par WDPM
Introduction rencontre Mobile Product Management par WDPMIntroduction rencontre Mobile Product Management par WDPM
Introduction rencontre Mobile Product Management par WDPM
 
Comment construire son Netflix
Comment construire son NetflixComment construire son Netflix
Comment construire son Netflix
 
Real Options - Agile France 2013
Real Options - Agile France 2013Real Options - Agile France 2013
Real Options - Agile France 2013
 
HTML5 / CSS3 : Mythes et realite
HTML5 / CSS3 : Mythes et realiteHTML5 / CSS3 : Mythes et realite
HTML5 / CSS3 : Mythes et realite
 
Breew presentation 2015 - hes lausanne
Breew presentation 2015 - hes lausanneBreew presentation 2015 - hes lausanne
Breew presentation 2015 - hes lausanne
 
Scrum : les sujets qui fâchent
Scrum : les sujets qui fâchentScrum : les sujets qui fâchent
Scrum : les sujets qui fâchent
 
Borghi scrum day-s
Borghi scrum day-sBorghi scrum day-s
Borghi scrum day-s
 
L'Agilité chez GEE Montréal
L'Agilité chez GEE MontréalL'Agilité chez GEE Montréal
L'Agilité chez GEE Montréal
 
Logiciels d'autoformation 2015
Logiciels d'autoformation 2015Logiciels d'autoformation 2015
Logiciels d'autoformation 2015
 
Real Options Lean Kanban France 2013
Real Options Lean Kanban France 2013Real Options Lean Kanban France 2013
Real Options Lean Kanban France 2013
 
Présentation de l'agence Eliophot
Présentation de l'agence EliophotPrésentation de l'agence Eliophot
Présentation de l'agence Eliophot
 
meetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetes
meetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetesmeetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetes
meetup - Workflow complet de CI/CD pour les geeks avec gitlab et kubernetes
 
Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012
Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012
Bonnes pratiques-drupal-dans-cahier-des-charges conference-dc-lyon-2012
 
Agile Tour 2010 - Mise en place d'un projet agile
Agile Tour 2010 - Mise en place d'un projet agileAgile Tour 2010 - Mise en place d'un projet agile
Agile Tour 2010 - Mise en place d'un projet agile
 
AT2010 Mise place d'un projet Agile
AT2010 Mise place d'un projet AgileAT2010 Mise place d'un projet Agile
AT2010 Mise place d'un projet Agile
 

More from Café Numérique Liège

Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)
Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)
Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)Café Numérique Liège
 
Café Numérique Liège #4: Console Games par David Merzel (Microsoft)
Café Numérique Liège #4: Console Games par David Merzel (Microsoft)Café Numérique Liège #4: Console Games par David Merzel (Microsoft)
Café Numérique Liège #4: Console Games par David Merzel (Microsoft)Café Numérique Liège
 
Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...
Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...
Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...Café Numérique Liège
 
Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...
Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...
Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...Café Numérique Liège
 
Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...
Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...
Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...Café Numérique Liège
 
Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).
Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).
Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).Café Numérique Liège
 

More from Café Numérique Liège (6)

Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)
Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)
Café Numérique Liège #4: Taatu Games par Michel Grignet (Taatu)
 
Café Numérique Liège #4: Console Games par David Merzel (Microsoft)
Café Numérique Liège #4: Console Games par David Merzel (Microsoft)Café Numérique Liège #4: Console Games par David Merzel (Microsoft)
Café Numérique Liège #4: Console Games par David Merzel (Microsoft)
 
Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...
Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...
Café Numérique Liège #2: Les tablettes numériques par Stephan Pire et Florenc...
 
Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...
Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...
Café Numérique Liège #2: Virtual Vertical Integration par Alexandre Legrand (...
 
Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...
Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...
Café Numérique Liège #2: La solution «Narrowcasting Tactile» par Alexandre Le...
 
Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).
Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).
Café Numérique Liège #2: Les Tablettes tactiles par Olivier Matz (Technifutur).
 

Café Numérique Liège #9: la Vidéo Numérique

  • 1. VIDÉOS POUR LE WEB et réalité augmentée
  • 2. QUI EST EPIC? • Agence créative • Créée en 2009; • 7 personnes; • Quelques clients: L’Oréal, Leidgens sprl, Etilux, Quatuor, Chocol@, ... • Passionnés de nouvelles technologies et de design
  • 3. KARIM MAALOUL 45 % 55 % Design Développement flash
  • 4. KARIM MAALOUL Mais Flash est mort, non ? flash est inutile, parceque html5, 45 % 55 % canvas, javascript, c’est génial, c’est beau, c’est propre et ça fait la paix dans le monde... tic tac tic tac... Design Développement flash
  • 6. étude de cas #1 AMÉNAGEMENTS EXTÉRIEURS
  • 7. LEIDGENS.BE • Historique de l’entreprise • L’historique de la société a une vraie valeur ajoutée • Entreprise familiale, personnages charismatiques • Les gens ne lisent pas
  • 8. LEIDGENS.BE Interview + Courbes =
  • 9.
  • 10. LEIDGENS.BE • Design, • Préparation et briefing 7 - 8 JOURS • Tournage • Derushage, post-prod • Développement flash
  • 11. étude de cas #2 AMÉNAGEMENTS EXTÉRIEURS oui encore eux
  • 12. LEIDGENS.BE • Vidéos de présentation • Ambiance, valeurs et procédés • Rassurer le client potentiel • Immerger le visiteur dans la vie de l’entreprise
  • 14.
  • 15. LEIDGENS.BE • Design, • Préparation et briefing • Tournage 5 JOURS • Derushage, • Tracking • Incrustation (after effects) • Compression
  • 16. étude de cas #3 AMÉNAGEMENTS EXTÉRIEURS après on en parle plus, promis !
  • 17. LEIDGENS.BE • Vidéos de jardins • Reproduire la sensation de se promener dans un jardin • Faire découvrir les différents départements • Permettre au visiteur d’en savoir plus sur ce qu’il voit
  • 19.
  • 20. RA, AVEC WEBCAM • Besoin du bon marqueur • Technologie capricieuse • luminosité • distance • cpu • Très 2008 ! • Assez simple à implémenter • Reste le meilleur compromis pour de la RA via webcam
  • 21. RA, POUR VIDEOS EN «DIFFÉRÉ» • Coller des marqueurs sur les arbres ? • Tracking 2D (after effects) + export des données vers flash ? • Animer les blocs en flash (timeline) ? • Recourir à un logiciel de tracking 3D ?
  • 22. RA, POUR VIDEOS EN «DIFFÉRÉ» • Syntheyes • Envoi des données à Flash • 3D des blocs cliquables grâce à papervision
  • 23.
  • 24. Premiers tests : La canette de coca
  • 25.
  • 26. LEIDGENS.BE • Design, 10 JOURS • • Incrustation (Flash + papervision) Gestion des interactions • Préparation et briefing • Tournage 4 -5 JOURS / VIDÉO • Derushage, • Tracking • Définition des blocs
  • 27. étude de cas #4 Chocol by Darcis
  • 28. CHOCOL-AT.BE • Concept original • Produit personnalisable • Produit de luxe • Made by Jean-Philippe Darcis
  • 29. CHOCOL-AT.BE • ça serait chouette si on pouvait ... • montrer Darcis entrain de préparer le chocolat • montrer le coffret sous différents angles • montrer le message que le client a écrit dans la vidéo • partager la vidéo avec ses amis
  • 30. Premiers tests : Le coffret de chocolat
  • 31.
  • 32. CHOCOL-AT.BE • Préparation et briefing • Tournage • 12 JOURS Derushage, Montage • Tracking • Incrustation (développement flash) • Développement du player video
  • 33. INSPIRATIONS • Stranger than a fiction • Release the freq • Macro Kingdom • Hyundai Accent
  • 34. PERSPECTIVES • Nouvelles fonctionnalités de flash • StageVideo depuis la version 10.2 • Le futur player Molehill, (3d complexe, accélération GPU) • Nouvelles technologies de tracking • Kinect (pas encore adapté au web) • Head-tracking
  • 35. ON CHERCHE Un project manager / account info@epicagency.net
  • 36. QUESTIONS ? COMMENTAIRES ? @epicwebagency / @yakudoo www.epicagency.net