davidbgk
/
larlet-fr-david-cache

<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
<!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset="utf-8">
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Collaboration productive : comment établir un flux de travail qui fonctionne pour toutes les disciplines (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
    function toggleTheme(themeName) {
        document.documentElement.classList.toggle(
            'forced-dark',
            themeName === 'dark'
        )
        document.documentElement.classList.toggle(
            'forced-light',
            themeName === 'light'
        )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
        toggleTheme(selectedTheme)
    }
</script>

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://numerique.canada.ca/2018/08/21/collaboration-productive/">

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
  <header>
    <h1>Collaboration productive : comment établir un flux de travail qui fonctionne pour toutes les disciplines</h1>
  </header>
  <nav>
    <p class="center">
      <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
      <a href="https://numerique.canada.ca/2018/08/21/collaboration-productive/" title="Lien vers le contenu original">Source originale</a>
    </p>
  </nav>
  <hr>
  <p>Au Service numérique canadien (SNC), nous formons nos équipes de produits pour qu’elles se composent de gestionnaires de produits, de chercheurs, de concepteurs, de développeurs, d’experts en politiques et de spécialistes en communication. Mais le fait de réunir une équipe multidisciplinaire ne signifie pas que la partie la plus difficile est terminée. Toutes les personnes que vous avez rassemblées au sein de votre équipe proviennent de disciplines différentes et chacune a ses propres façons de travailler. Il peut s’agir (sans s’y limiter) du rythme, des outils, des heures, des moments de la journée, des conditions environnementales, des méthodes de communication et des moyens que chaque personne préfère pour donner et recevoir de la rétroaction. Avec tant de variables différentes, il est facile de se sentir rapidement dépassé.</p>

<p>Il y a deux façons principales de régler ce problème :</p>

<ol>
<li>Attribuer aux chefs et aux gestionnaires la tâche difficile d’établir un consensus, en déterminant comment ils pensent que leur équipe <em>devrait</em> fonctionner et en espérant que tout le monde réagira favorablement; OU</li>
<li>Laisser les équipes tracer leur propre voie, c’est-à-dire déterminer elles-mêmes ces différences au fur et à mesure qu’elles s’habituent à travailler ensemble, et espérer qu’elles parviendront à un consensus productif par elles-mêmes.</li>
</ol>

<p>Ces stratégies ne sont pas toujours très productives lorsqu’il y a tant de styles de travail uniques en jeu. Elles ont tendance à créer plus de problèmes qu’elles n’en résolvent et à produire des équipes qui sont réactives plutôt que <strong>proactives</strong>.</p>

<p>Comment pouvons-nous relever certains de ces défis lorsque des équipes sont formées? Et comment pouvons-nous continuer à renforcer les équipes à mesure que le projet avance?</p>

<h2 id="concevoir-le-processus-d-équipe-dans-une-optique-multidisciplinaire">Concevoir le processus d’équipe dans une optique multidisciplinaire</h2>

<p>La culture joue un rôle important dans toute équipe, peu importe sa taille et sa structure. Mais nous ne pouvons pas nous attendre à ce que la culture d’équipe règle tous nos problèmes. Il n’y a pas de solution universelle. Il faut plutôt concevoir une approche multidisciplinaire du <strong>processus d’équipe</strong> et créer un flux de travail organisé qui répond aux besoins de tous les membres de l’équipe et dans lequel ils se sentent déjà à l’aise de fonctionner et de contribuer. C’est certainement plus facile à dire qu’à faire, alors voici un aperçu de la façon dont notre équipe de produit de citoyenneté a procédé pour s’améliorer.</p>

<p>Nous avons travaillé ensemble à l’élaboration de notre propre approche multidisciplinaire unique au cours des six derniers mois (<em>et nous y travaillons encore!</em>). Notre gestionnaire de produits a fait un excellent travail pour ce qui est de nous aligner sur les façons dont nous aimons travailler, en créant de l’espace pour discuter ouvertement de ces détails.</p>

<p>Au cours de notre première séance d’orientation en équipe, nous avons utilisé un outil appelé <a href="https://medium.com/@cassierobinson/a-user-manual-for-me-d3a851fbc694">A User Manual for Me</a> (Manuel de l’utilisateur pour moi) créé par Cassie Robinson.</p>

<p><img width="100%" alt="L'outil Manuel de l'utilisateur pour moi qui offre huit cases où les préférences de travail peuvent être indiquées dont les heures auxquels j'aime travailler et les meilleures façons de communiquer avec moi." src="https://numerique.canada.ca/img/cds/blog-manual-fr.png"></p>

<p>Chaque personne devait remplir cet outil, puis le partager avec l’équipe. Cela nous a permis de discuter de nos styles de travail, un sujet qui ne ressort pas toujours naturellement dans nos conversations. Depuis, nous avons utilisé des variantes de cet outil parmi d’autres équipes de produits du SNC et avons créé une <a href="https://docs.google.com/presentation/d/1KNNLKtFYoLOdTZ5Ez0ZBXwDGcZNB7AcfKr-4iMNF5L0/edit#slide=id.g3fd0daa6c4_0_0">version numérique bilingue</a> pour que les membres de nos équipes élargies puissent la mettre à jour fréquemment.</p>

<p>Nous avons également utilisé un outil du guide de travail d’équipe d’Atlassian appelé <a href="https://www.atlassian.com/team-playbook/plays/roles-and-responsibilities">Roles and Responsibilities</a> (Rôles et responsabilités) pour définir et préciser les compétences, les contributions et les besoins de chaque personne.</p>

<p><img width="100%" alt="L'outil des Rôles et responsabilités pour mieux comprendre les contributions de tous les membres de l'équipe." src="https://numerique.canada.ca/img/cds/blog-roles-fr.png"></p>

<p>Télécharger une copie de l’outil <a href="https://drive.google.com/a/cds-snc.ca/file/d/1DKI3I9_pTFAjRnVK_tlCYsGJ_jVQub0q/view?usp=sharing">Rôles et responsabilités</a> en français.</p>

<p>Nous avons utilisé cet outil en y ajoutant une petite variante. Premièrement, nous l’avons rempli en pensant strictement à nous-mêmes. Plutôt que d’arrêter l’exercice là, chacun d’entre nous s’est associé à un autre membre de l’équipe pour remplir de nouveau cette feuille, cette fois en nous concentrant sur la façon dont nous percevions le rôle de l’autre personne, sans lui en parler d’abord. Par la suite, nous avons fait une mise en commun, et à tour de rôle, chaque personne a lu ce qu’elle avait écrit pour elle-même, partagé ce qu’elle avait écrit au sujet des autres et participé à une discussion sur nos perceptions par rapport à la réalité. Ce processus nous a permis de nous mettre tous sur la même longueur d’onde quant à notre contribution à l’équipe et aux façons dont nous pouvons nous appuyer les uns sur les autres et apprendre les uns des autres.</p>

<h2 id="les-outils-que-nous-utilisons-pour-travailler-ensemble">Les outils que nous utilisons pour travailler ensemble</h2>

<p>Armés d’une orientation stratégique et d’une meilleure compréhension de la façon dont chaque membre de l’équipe travaille, nous étions mieux placés pour créer <em>ensemble</em> un flux de travail inclusif.</p>

<p>Comme notre équipe de produits travaillait de façon itérative, en effectuant beaucoup de tests avec des utilisateurs toutes les deux semaines, nous devions apporter rapidement des changements au produit sur lequel nous travaillions. Cela s’accompagnait du besoin de traduire toutes les connaissances que nous obtenions grâce à la recherche en interventions de conception qui pouvaient être mises en œuvre par nos développeurs en temps opportun avant notre prochaine série de tests. En travaillant de cette façon, nous nous sommes rendu compte que nous avions besoin de voir les tâches des autres, pour établir des liens entre les chercheurs, les concepteurs, les développeurs et tous les autres membres de l’équipe.</p>

<p><img src="https://numerique.canada.ca/img/cds/translating-FR-02.svg" alt="TRADUCTION. DE LA RECHERCHE AUX CONNAISSANCES AUX PROBLÈMES AUX INTERVENTIONS DE CONCEPTIONAUX PROBLÈMES SUR GITHUB À LA MISE EN OEUVRE DU DÉVELOPPEMENT."></p>

<p>En tant qu’équipe, nous avons utilisé <a href="https://trello.com/">Trello</a> pour gérer notre backlog de produit et pour savoir qui travaillait sur quoi pendant chaque sprint. De plus, nous avons créé un tableau de bord secondaire, appelé notre tableau de bord décisionnel, qui nous a permis de documenter les problèmes vécus par les utilisateurs lors de chaque série de tests. En tant qu’équipe, nous avons examiné ces problèmes et examiné la façon dont nous pouvions les aborder au moyen de diverses interventions de conception et de développement. Nous avons créé des cartes détaillées qui décrivaient les changements nécessaires et nous y avons joint les cartes de « problème » originales auxquelles elles se rapportaient. De cette façon, nous pouvons retracer chaque décision à une connaissance obtenue grâce à la recherche. Une fois qu’une carte est prête à être ramassée par un développeur, nous la transférons à notre colonne « en cours » et la reproduisons à notre tableau général de Trello pour l’intégrer officiellement dans un sprint.</p>

<p><img width="100%" alt="Le tableau de bord décisionnel comprend cinq listes dont les problèmes, les recommandations pour le service, les interventions de conception, le travail en cours et le travail complété." src="https://numerique.canada.ca/img/cds/blog-ircc-dashboard.png"></p>

<p>Les développeurs participent tout au long du processus de conception aux réunions, aux activités de recherche et au tableau de bord décisionnel. Afin d’aider l’ensemble de notre équipe à suivre tous les changements nécessaires, nous ouvrons aussi des problèmes directement dans GitHub en décrivant tous les détails que les développeurs doivent connaître. <a href="https://github.com/cds-snc/ircc-rescheduler">GitHub</a> nous permet de communiquer avec les développeurs d’une manière qui est familière et productive compte tenu de leur flux de travail existant. GitHub permet également aux membres du public de soulever des questions et des problèmes qu’ils vivent lorsqu’ils vérifient les itérations des services que nous créons. Cette approche a été particulièrement utile pour notre travail sur les produits d’IRCC, à mesure que nous avons approfondi nos connaissances.</p>

<p><img width="100%" alt="L'interface de GitHub montre les changements apportés avec les problèmes maintenant fermés." src="https://numerique.canada.ca/img/cds/blog-eman-screenshot.png"></p>

<p>Alors que nous nous efforçons de travailler ouvertement, il ne s’agit pas seulement de la façon dont nous fonctionnons à l’externe avec le public. C’est un cadre que nous pouvons appliquer à l’interne à toutes les équipes de produits. Grâce à ces méthodes de travail, il est plus facile pour les membres de notre équipe de produits de communiquer et de suivre ce que les autres font. À mesure que le SNC prend de l’expansion et forme des équipes plus importantes qui comprennent des membres des ministères partenaires, il est plus important que jamais de créer des processus partagés qui répondent aux besoins uniques des équipes multidisciplinaires et de leurs membres. <strong>Il n’est pas nécessaire que les grandes équipes soient synonymes de défis plus importants.</strong></p>

<p>Il s’agit d’un aperçu de notre processus. C’est encore un travail en cours, et la patience, la souplesse et l’itération continue sont des ingrédients clés. Nous continuerons de vous faire part de la façon dont nous adaptons nos flux de travail dans l’espoir que cela vous aidera à améliorer les vôtres également.</p>

<p>Si vous êtes à la recherche de conseils ou si vous avez des conseils que vous aimeriez partager, <a href="mailto:Eman.El-Fayomi@tbs-sct.gc.ca">nous aimerions avoir de vos nouvelles!</a></p>
</article>


<hr>

<footer>
  <p>
    <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
    <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
      </svg> Suivre</a> •
    <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
      </svg> Pro</a> •
    <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
      </svg> Email</a> •
    <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
      </svg> Légal</abbr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend><svg class="icon icon-brightness-contrast">
                <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
              </svg> Thème</legend>
              <label>
                  <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
              </label>
              <label>
                  <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
              </label>
              <label>
                  <input type="radio" value="light" name="chosen-color-scheme"> Clair
              </label>
          </fieldset>
      </form>
  </template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
    function loadThemeForm(templateName) {
        const themeSelectorTemplate = document.querySelector(templateName)
        const form = themeSelectorTemplate.content.firstElementChild
        themeSelectorTemplate.replaceWith(form)

        form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
        })

        const selectedTheme = localStorage.getItem('theme')
        if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
        }
    }

    const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
    window.addEventListener('load', () => {
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
            let mediaRules = []
            for (const cssRule of styleSheet.cssRules) {
                if (cssRule.type !== CSSRule.MEDIA_RULE) {
                    continue
                }
                // WARNING: Safari does not have/supports `conditionText`.
                if (cssRule.conditionText) {
                    if (cssRule.conditionText !== prefersColorSchemeDark) {
                        continue
                    }
                } else {
                    if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                        continue
                    }
                }
                mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }

            // WARNING: do not try to insert a Rule to a styleSheet you are
            // currently iterating on, otherwise the browser will be stuck
            // in a infinite loop…
            for (const mediaRule of mediaRules) {
                styleSheet.insertRule(mediaRule.cssText)
                hasDarkRules = true
            }
        }
        if (hasDarkRules) {
            loadThemeForm('#theme-selector')
        }
    })
</script>
</body>
</html>