BD publiées

BD publiées
Bd persos et collectifs BD

Ma galerie 3D :

SUIVEZ mes actus sur Facebook

mardi 19 juin 2012

Logiciel de création de livre numérique

Aujourd'hui je vais vous parler du logiciel que j'ai utilisé pour réaliser le livre interactif Clémentine et Martin.
Il s'agit de Easy Epub Code Editor.





Ce logiciel iPad permet de coder son ebook puis de l'exporter sur son mac ou PC avant de l'envoyer sur l'appstore.
Le langage de l'epub3 est basé sur le html5 et il est donc possible d'ajouter des animations et effets en tout genre. On peut même importer des librairies javascript telle que jquery.
Pour ma part, pour ce livre, je n'ai utilisé que des animations webkit en CSS.

Coder un epub est long et fastidieux car il faut une certaine hiéarchie des fichiers. Avec Easy Epub Code Editor, tout se fait simplement et on peut se concentrer sur le code.





On peut réaliser des livres sans savoir coder, puisqu'il y a un éditeur wysiswyg. Donc on peut ajouter, formater son texte, ajouter des images et même un texte lu façon karaoké.
Après bien sûr, coder, apporter toute la puissance du html5, avec les interactions, animations....





Vous pouvez voir Clémentine et Martin-0,99€, sur l'ibookstore et il y a un extrait gratuit pour qu'on puisse se rendre compte du résultat.
On peut bien entendu faire des choses plus compliquées, coder des mini jeux etc... Mais ici, ce n'étais pas le propos.

J'essaierai de poster d'autres exemples.


Si vous avez besoin de renseignements supplémentaires, vous pouvez me contacter ou laisser un commentaire. Vous pouvez aussi contacter le développeur qui réponds Aimablement.

14 commentaires:

  1. Cher David, tu es précieux.;) Merci de partager ton expérience !

    RépondreSupprimer
  2. Mais de rien Benoit, je suis content que ça aide d'autres collègues. J'aurais bien aimé tomber sur ce genre d'infos quand j'ai commencé, alors je m'y colle !

    RépondreSupprimer
  3. Bonjour,
    Trés bon travail, félicitations.
    Quelqu'un pourrais éclairer ma lanterne svp, je cherche à savoir comment vous avez fait pour avoir un affichage grand écran, les images animées et du son lorsqu'on touche une image ?
    Quelques exemples serait les bien venu.
    Merci d'avance

    RépondreSupprimer
    Réponses
    1. Bonjour BK. Tu as raison, je devrais poser des exemples mais ça prend du temps... Toutefois, je peux essayer de répondre à tes questions si tu es plus précis. Tu utilises ce logiciel : Easy epub code Editor ? Tu veux publier sur l'ibookstore. Sinon tu peux aussi trouver facilement des tutos sur le net, car le langage est le javascript ou html5.
      Pour le livre Clémentine et Martin, les animations ont été codées en html5 (CSS)

      Supprimer
    2. Merci d'avoir répondue si vite Pékélé,
      Oui j'utilise Easy epub code Editor depuis quelques semaine et je galére avec,je trouve qu'il n'est pas riche en fonctionnalités, surtout les plus simples, comme creer des liens sur un objet, ajout de plusieurs images sur une meme page etc .
      Je veux bien creer mon epub comme je le souhaite et le publier ensuite sur appstore, mais ce que j'ai fais jusqu'a maintenant ne me satisfais pas ! je veux integrer un peux d'animations et d'interactivité.
      j'ai tester d'autres logiciels tel que "CBB" ou Book Creator" mais aucun ne fait l'ensemble de ce que je cherche à faire :-(
      Hélas je suis pas développeur et je ne comprend rien en html5, xhtml ni css, je cherche pendant des jours sur le net des explications, des exemples et je m'en sort comme ça, mais l'a je suis bloqué sur les 3 questions que je t'es déjà posé mais pas précisément !
      Ma 1ere question concerne l'affichage du livre apres lancement, Easy epub génère automatiquement le livre en petite format et non plein écran comme le votre, je voulais savoir ou je peux modifier cette apparence dans quel fichier et à quel ligne stp ?
      Ma 2eme question concerne l'animation des images, est ce que tu a utilisé des gif animées ou des java script pour faire ces animation ?
      Ma 3eme question concerne le son qui se produit au moment ou en touche une image quelconque, est ce qu'il s'agit aussi de script java ou juste du html de type (area href=...) ?

      Supprimer
  4. Bon, je crois que je vais devoir faire un toto... EECE est le meilleur logiciel de création d'ebook que j'ai pu tester sur iPad. Par contre, dès que l'on veut obtenir plus que des images et du texte animés, il faut passer par du code. C'est même dit dans le titre du logiciel. ce dernier vient d'avoir une mise à jour.
    Bon il faut que je m'y replonge dedans car entre temps, je suis passé à des applications sur l'appstore.
    Donc je ne me rappelle plus avoir fait quelque chose pour le plein écran mais je sais que ça peut se résoudre par une ligne de code dans le xhtml avec le viewport. Sinon dans le fichier de comfig du livre com.apple.ibooks.display-options.xml
    Bref, je regarderai.

    Sinon je ne suis pas développeur à la base mais dessinateur et je m'y suis mit. Donc c'est tout à fait faisable pour tout le monde ;p La 1ère chose c'est de se familiariser avec le logiciel et de faire les tutos sur le site de futureJones.
    Comprendre comment est construit un ebook, ça aide aussi.
    Les gifs animés, j'ai pas essayé. En théorie c'est possible il suffit juste de voir si le logiciel peut les importer via itunes.
    J'ai utilisé des animations avec les feuilles de styles CSS. Pas de javascript. Mais j'aurais pu les faire en javascript. Peut être que je ferai ça pour mon tutoriel car ce sera plus simple.
    exemple d'animation en css :http://animateyourhtml5.appspot.com/pres/index.html#1

    Pour ta dernière question, effectivement j'ai utilisé une fonction javascript pour jouer le son. le déclenchement se fait via du langage HTML par la commande onclick() dans la déclaration de l'image à cliquer. par exemple :
    <img src="extras/monImage.png" alt="toto" onclick="alert('je viens de toucher toto');" />

    j'utilise aussi une fonction prévu par Apple pour être lue dans iBooks et qui permet de lire une musique de fond en même temps. Peut être que ce n'est plus nécessaire avec la dernière version d'ibooks et que l'on peut tout faire avec du javascript.

    Pour finir le javascript est un langage différent de java et plus facile d'accès. Je ne connais pas le java.

    Bon, mettre en place quelques tutoriels pour ce que tu demandes va être un peu long. alors patience... Et cherche de ton côté avec les pistes que j'ai laissé.

    RépondreSupprimer
  5. Merci beaucoup Pékélé pour ces explications et éclaircissements, cela va me permettre d'avancer doucement.
    Je suis patient, j'attendrais avec plaisir tes tutos.
    Au plaisir de te lire.

    RépondreSupprimer
    Réponses

    1. Pour le plein écran, j'ai regardé rpidement, j'ai réglé ma taille de livre comme ceci :
      width=738 height=985
      Même en paysage ça fonctionne.
      Donc, dans chaque fichier xhtml de chaque page, il faut régler le viewport en mettant ces valeurs.
      Pareil pour les feuilles de style (CSS), régler la taille du body au même dimension. EECE A ensuite une fonction très pratique pour reprendre le même style à chaque fois.

      Supprimer
    2. Mais c'est déjà le cas, c'est générer automatiquement à chaque nouveau projet !
      dans le les deux fichiers xhtml et css.

      Supprimer
    3. regarde bien que ce sont ces nombres : width=738 height=985

      Supprimer
    4. je peux t'envoyer des captures d'écran si tu veux !

      Supprimer
    5. ok envoie moi la capture du fichier xhtml et du fichier CSS, parce que chez moi si je change ces valeurs, ça enlève le plein écran. Mais de toutes façon, je peux l'avoir en double tapant sur l'écran.

      Supprimer
    6. Il me faut ton adresse Pékélé !

      Supprimer