Fresh from the Hive

Tech and Passion with love from Studio Melipone

Quels outils pour gérer nos projets ?

gdurelle's avatar le 07 avril 2014

Chez Studio Melipone on travaille avec de nombreux clients, tous très différents, parfois en prestation simple, parfois en association, parfois un mix des deux.

Ce qui amène des personnalités différentes, des méthodes différentes et aussi des outils différents.

Pour gérer nos projets, les listes de fonctionnalités à implémenter, les discutions, etc, on a testé pas mal de d’applications Web (Basecamp, PivotalTracker, Trello, Asana, ProjectFlow, Teambox, Producteev, …) et nous utilisons encore certains d’entre eux.

Petit tour d’horizon :

Basecamp La base. Fait simple et… simplement : listes de tâches, documents écrits et un calendrier basique. Le tout étant commentable.

Pivotal est axé sur la méthode SCRUM et fait ça très bien. Le fait de changer le statut d’une tâche rend les choses bien visibles à tous points de vue (devs, clients, product owners)

Mais il ne vous laisse rien faire d’autre. Et la quantité de boutons un peu partout donne au final une interface plutôt indigeste. Less is better s’appliquerait parfaitement ici.

Trello donne quelque chose d’assez cool avec son système de cartes en colonnes et beaucoup de fonctionnalités qui ne rendent pas l’interface horrible.

Mais l’expérimentation nous a montré qu’avec un grand nombre de tâches à accomplir, le scroll horizontal n’est vraiment pas un usage naturel.

Asana a des bons concepts, notamment le fait de pouvoir mettre un tag sur une tâche, mais au final on est revenu sur Basecamp car ça devenait vite rébarbatif de le faire à chaque fois sur chaque tâche.

ProjectFlow Inspiré de Trello en ultra light donc plutôt cool mais vraiment trop limité pour notre usage.

RedBooth (anciennement Teambox) veux tout faire (tasks, time tracking, planning, chat’, gantt, le café, …) mais au final il y en a tellement partout que ce n’est pas du tout pratique à utiliser. On est donc revenu à Basecamp comme avec les autres.

Au final on a jamais rien trouvé de mieux que Basecamp, tout en ayant un petit manque au niveau visibilité sur le futur.

Si notre nouvel outil de planning nous aide (article ici et beta privée ici), il n’est pas du tout envisagé pour la gestion de projet.

Nous avons besoin de voir les tâches à accomplir sur l’ensemble de nos projets. L’expérimentation sur les tags nous a aussi donné quelques idées…

On est jamais mieux servi que par soi-même !

On aimait l’idée de tags, de colonnes et on avait besoin pour nous même de voir plusieurs projets à la fois.

On a donc commencé à travailler sur OrbitalBoard.

On met quoi dedans ?

La base + nos 2 besoins spécifiques :

  • Dashboard : voir les prochaines tâches des différents projets en cours sur une même vue.
  • Tags : que les tâches importantes pour nous soient mises en valeur.

Du coup on en a profité pour rajouter une synchro avec Basecamp, une gestion de statuts de tâche et un poil de flexibilité sur la présentation.

Et on obtient :

  • Des listes à la basecamp mais qu’on peut «retailler» en 2 ou 3 colonnes pour en voir plus d’un coup.
  • Des Statuts light sur les tâches qui changent en 1 clic.
  • Des Tags intelligents qu’on définit une seule fois et qui trouvent eux mêmes ce qu’il faut mettre en exergue.
  • Nos fameux dashboards : voir autant de listes de différents projets qu’on veut dans une seule et même vue ! Avec le même système de listes/colonnes que les projets.
  • Et pour finir : une Connexion/Synchronisation Basecamp qui permet de continuer à utiliser notre outil préféré.

Et comme on aime beaucoup ParisWeb on a gardé tout ça responsive, accessible et bisous compatible !

Je vous invite à tester OrbitalBoard c’est complètement gratuit pour l’instant.

On prévoit le paiement par Stripe et Bitpay. Oui ! On aime aussi les Bitcoins ;)

Tadaam !

loic-guitaut's avatar le 25 février 2014

Qu’est-ce que c’est ?

Tadaam est un planning d’entreprise qui se veut simple et devait répondre aux besoins que nous avons chez Studio Melipone (comprendre relativement basiques).

Pourquoi ?

Nous sommes une petite équipe (quatre personnes) mais nous avons besoin de savoir facilement en un coup d’œil qui travaille sur quoi et quand.

Nous nous sommes alors mis en quête de trouver l’outil répondant à notre besoin, à savoir :

  • Visualisation des tâches planifiées sur le mois en cours
  • Découpage du temps à la demi-journée
  • Gestion des jours travaillés par personne
  • Gestion des vacances
  • Avoir quelques statistiques sur le temps passé par projets

Nous avons trouvé divers outils, très bien au demeurant, mais qui faisaient toujours beaucoup trop ou qui étaient trop complexes. On ne veut absolument pas un outil de gestion de projet ni un GANTT !

La solution

Comme vous pouvez vous en douter, nous avons donc opté pour la création de notre propre outil répondant aux points cités ci-dessus.

Avant d’opter pour la création d’une application, nous gérions tout ça avec un document Google partagé mais ce n’était pas très évident à utiliser au final, il y avait beaucoup trop de choses à faire manuellement.

L’application que nous avons mise en place est réalisée en Rails 4 (logique ;)) et nous l’utilisons depuis début janvier de manière sérieuse. Nous la faisons évoluer au fur et à mesure bien évidemment mais nous pensons être en mesure à l’heure actuelle de pouvoir la faire tester à un public extérieur d’où le passage en beta privée !

Ce que fait Tadaam

Le planning est découpé en demi-journées représentant un mois complet. Les weekends, les jours non travaillés, les jours fériés et le jour courant sont tous mis en valeur avec des couleurs différentes.

L’accès se fait via un compte pour une entreprise ou une équipe donnée et non pas pour chaque utilisateur. Ainsi tout le monde peut facilement éditer le planning sachant que les modifications sont répercutées en temps réel grâce à des websockets (billet à venir).

La création d’une tâche se veut simple : un cliquer/déplacer de la date de départ à la date de fin et une modal s’ouvre permettant alors la sélection du projet désiré ainsi que l’emplacement où se déroule la tâche. Tous les utilisateurs ont un emplacement par défaut (le bureau par exemple) et c’est cet emplacement qui est utilisé automatiquement lors de la création d’une nouvelle tâche. Le modifier permettra de savoir facilement que la personne n’est pas à son lieu habituel.

Pour ce qui est de la modification d’une tâche, il suffit de cliquer dessus, là aussi une modal apparaîtra permettant de modifier les informations y compris les dates de début et de fin.

Chaque utilisateur possède sa propre configuration pour ses jours travaillés. Le projet spécial « Congés » en tient compte lors du calcul automatique des jours de congés posés.

Pour ce qui est des autres projets, on fait simple, à savoir que tout est décompté que ce soit en semaine, sur le weekend ou autre.

Tester Tadaam

Si vous êtes intéressé par Tadaam suite à ce petit billet, rendez-vous sur https://tada.am et laissez nous votre adresse email. Vous serez prévenu quand votre compte sera activé et nous espérons que vous apprécierez l’application autant que nous ;)

Rendre le drag’n drop accessible

gdurelle's avatar le 18 février 2014

Les propriétés ARIA permettent de rendre accessible votre contenu très facilement. En lisant le rapport sur des tests de lecteurs d’écran, on apprend non seulement quels attributs sont les mieux supportés (et donc les plus importants), mais on en découvre aussi des nouveaux !

Je vais vous parler du support du drag’n drop : un drag’n drop sur une liste simple, avec JQuery.

Nous allons utiliser deux attributs ARIA : aria-grabbed et aria-dropeffect, respectivement affectés à un élément que l’on veut déplacer (li) et un conteneur d’éléments (ul).

La liste html :

<ul id="mylist">
    <li aria-grabbed="false">lorem ipsum</li>
    <li aria-grabbed="false">dolor sit amet</li>
    <li aria-grabbed="false">consectur adiscipicing</li>
</ul>

On ajoute l’attribut aria-grabbed sur les éléments de la liste. Il possède trois valeurs possibles :

  • true : l’élément est en train d’être déplacé
  • false : l’élément peut être déplacé
  • undefined : l’élément ne peut pas être déplacé (valeur par défaut)

On l’initialise donc à false.

Ensuite un petit poil de JavaScript, enfin de CoffeeScript en fait :

$("#mylist").sortable
  items: "li"
  start: (event, ui) ->
    ui.item.attr 'aria-grabbed', "true"
    $("#mylist").attr 'aria-dropeffect', 'move'
  stop: (event, ui) ->
    ui.item.attr 'aria-grabbed', "false"
    $("#mylist").attr 'aria-dropeffect', 'none'

Il suffit de passer l’aria-grabbed à true et d’ajouter l’attribut aria-dropeffect sur le conteneur avec l’une des six valeurs possibles.

Avec move on indique que l’élément déplacé sera coupé de son emplacement actuel et collé sur le nouveau.

Pour plus d’informations :

Sur aria-grabbed :

http://www.w3.org/TR/wai-aria/states_and_properties#aria-grabbed

Sur aria-dropeffect :

http://www.w3.org/TR/wai-aria/states_and_properties#aria-dropeffect

Sur les méthodes de Sortable :

http://api.jqueryui.com/sortable/#event-start