Journal Logiciels de prototypage d'IHM

Posté par  .
Étiquettes :
15
10
août
2009
Bonjour,

Je voulais vous présenter Pencil, un greffon Firefox pour le prototypage d'IHM, que j'ai découvert récemment et que je trouve bien. Il existe aussi en version autonome.

Selon le site (en Anglais uniquement).
L’unique mission du projet Pencil est de développer un outil gratuit et open source, pour la création de diagrammes et le prototypage d'IHM, qui puisse être utilisé par tous.

Pencil apporte des boites à outil toutes prêtes pour faire des dessins d'écrans. Il existe actuellement des éléments pour un visuel XP et pour un visuel GTK. Le logiciel s'utilise, tout simplement, en glissant/déposant depuis les boites à outils vers le plan de travail. Pencil permet
d'utiliser des pages existantes comme arrière plan pour d'autres pages, ce qui permet de créer des squelettes de pages réutilisables.

Les formats de fichiers de Pencil sont XML (enregistrement et bibliothèques). Il ne sait exporter que du PNG (pas de SVG...) mais sur le site il y a une riche documentation sur le format XML des bibliothèques.

Le site : [http://www.evolus.vn/Pencil/Home.html]

Bon prototypage !

  • # prototypage != maquettage

    Posté par  . Évalué à 7.

    Je fais un peu le pinailleur là mais c'est du maquettage, pas du prototypage.
    Une fois que tu as dessiné tes écrans, tu ne peux pas t'en resservir directement pour servir de squelette à ton appli définitive, tu dois redéfinir par le code (ou un autre éditeur genre glade) ton IHM.

    ...Sauf évidemment à développer des fichiers XSL pour transformer ton XML en un fichier réutilisable directement dans le code (si c'est faisable, je veux dire avec un résultat correct). Mais tant que ça n'existe pas, ça reste du maquettage.

    Ce qui n'enlève rien à Pencil, qui m'a l'air ma foi bien sympa (le coup de l'arrière-plan est d'ailleurs plutôt bien pensé, comme la possibilité de pouvoir placer des éléments librement, pour réaliser aussi des mockups de sites)

    • [^] # Re: prototypage != maquettage

      Posté par  . Évalué à 2.

      Pinailler, ce n'est pas grave :)

      Mais je suis plutôt d'accord avec les gens de Pencil, le maquettage porte une connotation graphique que Pencil n'a pas.

      C'est un prototypage fonctionnel, si tu veux. En tant que développeur je ne l'utilise pas mais les fonctionnels avec qui je bosse si.

      • [^] # Re: prototypage != maquettage

        Posté par  (site web personnel) . Évalué à 4.

        Ce serait super bien s'il était de générer un squelette de l'interface graphique à partir de la maquette.

        Par exemple, en Java je fais souvent du prototypage (d'application Swing) en utilisant l'Editeur graphique de Netbeans. Ensuite, je réutilise les classes générées pour débuter mon programme. Cependant, l'outil ne me permet pas de faire la même chose avec des IHM Web.

  • # Cool

    Posté par  . Évalué à 4.

    OMG ! Mais ce petit logiciel est bien sympa ! Du coup, je me sens obligé de poster un commentaire juste pour dire merci de me l'avoir fait découvrir.

    • [^] # Re: Cool

      Posté par  . Évalué à 4.

      Et bien de rien.

      Je suis en train de regarder la doc pour ajouter ma propre collection.
      [http://www.evolus.vn/Pencil/DevGuide-CollectionStructure.htm(...)]
      ça a vraiment pas l'air compliqué..

      Et comme le format XML utilisé c'est peu ou prou du SVG, je vais peu être faire une toolbox spécifique au projet sur lequel je suis (si j'ai le temps ou pas).

  • # Sympathique

    Posté par  (site web personnel) . Évalué à 2.

    Sympathique comme soft, mais pourquoi cette dépendance à Firefox ? Y'a une bonne raison technique ou c'est un choix délibéré de ne pas utiliser XulRunner ?

    • [^] # Re: Sympathique

      Posté par  . Évalué à 2.

      "dépendance"
      heu...

      Dans le journal j'ai bien précisé que :
      Il existe aussi en version autonome..

      Mais il est vrai que sur le site des développeur (je n'en suis pas, hein) il est mis que l'appli peut tourner sur toutes les plateformes qui font tourner firefox 3.

      • [^] # Re: Sympathique

        Posté par  (site web personnel) . Évalué à 2.

        Désolé j'ai lu en diagonale ton journal et sur le site j'ai cliqué directement sur "Install it now !" au lieu de "Downloads" qui contient bien un lien vers des applications utilisant XulRunner.

  • # Qt Designer

    Posté par  . Évalué à 8.

    Par rapport à Qt Designer, ou Qt Creator, on passe plus de temps à positionner les éléments. Je trouve cela moins pratique que d'utiliser directement le générateur d'interface du toolkit que l'on utilise.

    Envoyé depuis mon lapin.

    • [^] # Re: Qt Designer

      Posté par  . Évalué à 2.

      on a posté à la même minute :-)

      De plus, le travail fait pour le maquettage est tout de suite utilisable (cela devient-il un prototypage ?).

      • [^] # Re: Qt Designer

        Posté par  . Évalué à 3.

        Nous, on se sert de cet outil pour faire des écrans d'appli web pour nos cahiers des charges.

        Cela permet aux lecteurs d'avoir une idée très précise du rendu final.

  • # intérêt ?

    Posté par  . Évalué à 6.

    Quel est l'intérêt de ce genre d'application par rapport à simplement utiliser un designer ? (Qt Designer, Glade, etc)
    Il y a bien des trucs qui peuvent un peu dur à faire sans programmer, mais on peut contourner en utilisant une image de ce que l'on voudrait. D'où ma question.

    • [^] # Re: intérêt ?

      Posté par  . Évalué à 3.

      Comme je l'ai laissé entendre dans un poste plus haut, je vois plutôt cela comme un outil pour les fonctionnels que pour les techies.

      Sinon c'est vrai qu'un QT designer c'est plus complet.

      Il faut voir aussi que tu peux créer tes propres librairies adaptées à ton appli web si tu fais des progiciels Java/SOA/N-Tiers WEB ! (foutaises).

      • [^] # Re: intérêt ?

        Posté par  (site web personnel) . Évalué à 1.

        Tu peux aussi utiliser tes propres widget avec Qt Designer.
        Il suffit d'écrire un plugin pour exposer les widgets et ils sont directement utilisable dans Designer: http://doc.qtsoftware.com/4.5/designer-creating-custom-widge(...)

        Les widgets de KDE sont d'ailleurs intégrés dans Designer.

        • [^] # Re: intérêt ?

          Posté par  . Évalué à 3.

          Oui oui, je sais, mais QT Designer, ce n'est pas pour les rédacteur de specs, ce n'est pas pour les fonctionnels.
          En situation réel (les miennes en tout cas) les fonctionnels ont besoins de moyens informels pour générer des exemples IHM.

          Je comprend le point de vu des développeurs. Si tu fais un projet libre, tu n'as probablement pas de fonctionnels et tu ne connais pas ce problème. Mais les logiciels libres sont utilisés aussi pour des progiciels (qui respectent la GPL) et dans ces cas l'intéraction des dév avec les fonctionnels nécessite un outil simple et non technicien. Celui ci me parait convenir à certains cas.

          Mais si ça te conviens pas c'est sûrement normal. Si tu développes du QT tu n'as peut-être pas besoin de ça mais pour du web, il peut être utile d'avoir un logiciel simple et efficace.

      • [^] # Re: intérêt ?

        Posté par  . Évalué à 1.

        je vois plutôt cela comme un outil pour les fonctionnels que pour les techies.

        Les IHM ne sont pas supposées être spécifiées par ceux qui implémentent l'application pilotée.
        Par extension, et parce que la logique du moindre effort existe, j'ajouterais que l'Interface ne doit pas être non plus implémentée par ceux qui la spéficient.

    • [^] # Re: intérêt ?

      Posté par  (site web personnel) . Évalué à 6.

      Pour avoir fait des trucs comme ça au boulot sous logiciel propriétaire, l'avantage d'un outil graphique par rapport à un éditeur d'interface c'est que :

      - Tu peux facilement mettre des données dedans, même des données compliquées
      - Tu peux dessiner des widgets que tu n'as pas encore développé (y a qu'à dessiner)

      C'est surtout intéressant quand tu veux présenter un truc à un client en espérant lui faire comprendre ce que l'appli fera.

  • # Balsamiq Mockups

    Posté par  (site web personnel) . Évalué à -7.

    C'est pas libre, mais ça fonctionne (contrairement à Pencil) et c'est beaucoup plus cool :http://www.balsamiq.com/products/mockups

  • # Et pour les interfaces web ?

    Posté par  (site web personnel) . Évalué à 2.

    J'ai téléchargé le greffon Firefox de Pencil et ça me semble très sympa. Cependant, existe-t'il une bibliothèque de "shapes" Pencil qui serait orientée interface web, en plus de celle pour Qt et Windows ?

    La brève recherche google que j'ai effectué à ce propos ne donne rien hélas.

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.