davidbgk
/
larlet-fr-david
Beobachten 1
Favorisieren 0
Fork 0
Code Releases 0 Aktivität
Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.
896 Commits
1 Branch
Struktur: ffaa972798
Branches Tags
${ item.name }
Erstelle Branch ${ searchTerm }
von „ffaa972798“
${ noResults }
larlet-fr-david/david/blog/2013/scopyleft-valeurs/index.html

index.html 34KB
Originalformat Blame Verlauf

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842 
  1. <!doctype html><!-- This is a valid HTML5 document. -->

  2. <!-- Screen readers, SEO, extensions and so on. -->

  3. <html lang=fr>

  4. <!-- Has to be within the first 1024 bytes, hence before the <title>

  5.   See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->

  6. <meta charset=utf-8>

  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->

  8. <!-- The viewport meta is quite crowded and we are responsible for that.

  9.   See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->

  10. <meta name=viewport content="width=device-width,minimum-scale=1,initial-scale=1,shrink-to-fit=no">

  11. <!-- Required to make a valid HTML5 document. -->

  12. <title>Fondée sur des valeurs — David Larlet</title>

  13. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->

  14. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">

  15. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">

  16. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">

  17. <link rel="manifest" href="/manifest.json">

  18. <link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">

  19. <link rel="shortcut icon" href="/static/david/icons/favicon.ico">

  20. <meta name="apple-mobile-web-app-title" content="David Larlet">

  21. <meta name="application-name" content="David Larlet">

  22. <meta name="msapplication-TileColor" content="#da532c">

  23. <meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">

  24. <meta name="theme-color" content="#f0f0ea">

  25. <!-- That good ol' feed, subscribe :p. -->

  26. <link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">

  27. 

  28.   <!-- Canonical URL for SEO purposes -->

  29.   <link rel="canonical" href="https://larlet.fr/david/blog/2013/scopyleft-valeurs/">

  30.   <!-- SEO/Semantic metadata -->

  31.   <meta name="description" content="scopyleft est une entreprise fondée sur des valeurs pour créer de la valeur." />

  32.   <meta name="twitter:description" property="og:description" itemprop="description" content="scopyleft est une entreprise fondée sur des valeurs pour créer de la valeur." />

  33.   <meta name="twitter:title" property="og:title" itemprop="name" content="Fondée sur des valeurs" />

  34.   <meta name="twitter:card" content="summary" />

  35.   <meta name="twitter:creator" content="@davidbgk" />

  36.   <meta name="twitter:url" property="og:url" content="https://larlet.fr/david/blog/2013/scopyleft-valeurs/" />

  37.   <meta property="og:type" content="article" />

  38.   <meta property="og:site_name" content="David Larlet (@davidbgk)" />

  39. 

  40.   <meta name="twitter:image" property="og:image" itemprop="image" content="https://larlet.fr/static/david/david-larlet-avatar-thumbnail.jpg" />

  41. 

  42. 

  43. <style>

  44. /* http://meyerweb.com/eric/tools/css/reset/ */

  45. html, body, div, span,

  46. h1, h2, h3, h4, h5, h6, p, blockquote, pre,

  47. a, abbr, address, big, cite, code,

  48. del, dfn, em, img, ins,

  49. small, strike, strong, tt, var,

  50. dl, dt, dd, ol, ul, li,

  51. fieldset, form, label, legend,

  52. table, caption, tbody, tfoot, thead, tr, th, td,

  53. article, aside, canvas, details, embed,

  54. figure, figcaption, footer, header, hgroup,

  55. menu, nav, output, ruby, section, summary,

  56. time, mark, audio, video {

  57.   margin: 0;

  58.   padding: 0;

  59.   border: 0;

  60.   font-size: 100%;

  61.   font: inherit;

  62.   vertical-align: baseline;

  63. }

  64. /* HTML5 display-role reset for older browsers */

  65. article, aside, details, figcaption, figure,

  66. footer, header, hgroup, menu, nav, section { display: block; }

  67. body { line-height: 1; }

  68. blockquote, q { quotes: none; }

  69. blockquote:before, blockquote:after,

  70. q:before, q:after {

  71.   content: '';

  72.   content: none;

  73. }

  74. table {

  75.   border-collapse: collapse;

  76.   border-spacing: 0;

  77. }

  78. 

  79. /* http://practicaltypography.com/equity.html */

  80. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */

  81. /* https://www.filamentgroup.com/lab/js-web-fonts.html */

  82. @font-face {

  83.   font-family: 'EquityTextB';

  84.   src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),

  85.        url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');

  86.   font-weight: 300;

  87.   font-style: normal;

  88.   font-display: swap;

  89. }

  90. @font-face {

  91.   font-family: 'EquityTextB';

  92.   src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),

  93.        url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');

  94.   font-weight: 300;

  95.   font-style: italic;

  96.   font-display: swap;

  97. }

  98. @font-face {

  99.   font-family: 'EquityTextB';

  100.   src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),

  101.        url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');

  102.   font-weight: 700;

  103.   font-style: normal;

  104.   font-display: swap;

  105. }

  106. 

  107. @font-face {

  108.   font-family: 'ConcourseT3';

  109.   src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),

  110.        url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');

  111.   font-weight: 300;

  112.   font-style: normal;

  113.   font-display: swap;

  114. }

  115. 

  116. 

  117. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */

  118. body {

  119.   /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */

  120.   font-family: "EquityTextB", Palatino, serif;

  121.   background-color: #f0f0ea;

  122.   color: #07486c;

  123.   font-kerning: normal;

  124.   -moz-osx-font-smoothing: grayscale;

  125.   -webkit-font-smoothing: subpixel-antialiased;

  126.   text-rendering: optimizeLegibility;

  127.   font-variant-ligatures: common-ligatures contextual;

  128.   font-feature-settings: "kern", "liga", "clig", "calt";

  129. }

  130. pre, code, kbd, samp, var, tt {

  131.   font-family: 'TriplicateT4c', monospace;

  132. }

  133. em {

  134.   font-style: italic;

  135.   color: #323a45;

  136. }

  137. strong {

  138.   font-weight: bold;

  139.   color: black;

  140. }

  141. nav {

  142.   background-color: #323a45;

  143.   color: #f0f0ea;

  144.   display: flex;

  145.   justify-content: space-around;

  146.   padding: 1rem .5rem;

  147. }

  148.   nav:last-child {

  149.     border-bottom: 1vh solid #2d7474;

  150.   }

  151.   nav a {

  152.     color: #f0f0ea;

  153.   }

  154.   nav abbr {

  155.     border-bottom: 1px dotted white;

  156.   }

  157. 

  158. h1 {

  159.   border-top: 1vh solid #2d7474;

  160.   border-bottom: .2vh dotted #2d7474;

  161.   background-color: #e3e1e1;

  162.   color: #323a45;

  163.   text-align: center;

  164.   padding: 5rem 0 4rem 0;

  165.   width: 100%;

  166.   font-family: 'ConcourseT3';

  167.   display: flex;

  168.   flex-direction: column;

  169. }

  170.   h1.single {

  171.     padding-bottom: 10rem;

  172.   }

  173.   h1 span {

  174.     position: absolute;

  175.     top: 1vh;

  176.     left: 20%;

  177.     line-height: 0;

  178.   }

  179.     h1 span a {

  180.       line-height: 1.7;

  181.       padding: 1rem 1.2rem .6rem 1.2rem;

  182.       border-radius: 0 0 6% 6%;

  183.       background: #2d7474;

  184.       font-size: 1.3rem;

  185.       color: white;

  186.       text-decoration: none;

  187.     }

  188. h2 {

  189.   margin: 4rem 0 1rem;

  190.   border-top: .2vh solid #2d7474;

  191.   padding-top: 1vh;

  192. }

  193. h3 {

  194.   text-align: center;

  195.   margin: 3rem 0 .75em;

  196. }

  197. hr {

  198.   height: .4rem;

  199.   width: .4rem;

  200.   border-radius: .4rem;

  201.   background: #07486c;

  202.   margin: 2.5rem auto;

  203. }

  204. time {

  205.   display: bloc;

  206.   margin-left: 0 !important;

  207. }

  208. ul, ol {

  209.   margin: 2rem;

  210. }

  211. ul {

  212.   list-style-type: square;

  213. }

  214. a {

  215.   text-decoration-skip-ink: auto;

  216.   text-decoration-thickness: 0.05em;

  217.   text-underline-offset: 0.09em;

  218. }

  219. article {

  220.   max-width: 50rem;

  221.   display: flex;

  222.   flex-direction: column;

  223.   margin: 2rem auto;

  224. }

  225.   article.single {

  226.     border-top: .2vh dotted #2d7474;

  227.     margin: -6rem auto 1rem auto;

  228.     background: #f0f0ea;

  229.     padding: 2rem;

  230.   }

  231.   article p:last-child {

  232.     margin-bottom: 1rem;

  233.   }

  234. p {

  235.   padding: 0 .5rem;

  236.   margin-left: 3rem;

  237. }

  238.   p + p,

  239.   figure + p {

  240.     margin-top: 2rem;

  241.   }

  242. 

  243. blockquote {

  244.   background-color: #e3e1e1;

  245.   border-left: .5vw solid #2d7474;

  246.   display: flex;

  247.   flex-direction: column;

  248.   align-items: center;

  249.   padding: 1rem;

  250.   margin: 1.5rem;

  251. }

  252.   blockquote cite {

  253.     font-style: italic;

  254.   }

  255.   blockquote p {

  256.     margin-left: 0;

  257.   }

  258. 

  259. figure {

  260.   border-top: .2vh solid #2d7474;

  261.   background-color: #e3e1e1;

  262.   text-align: center;

  263.   padding: 1.5rem 0;

  264.   margin: 1rem 0 0;

  265.   font-size: 1.5rem;

  266.   width: 100%;

  267. }

  268.   figure img {

  269.     max-width: 250px;

  270.     max-height: 250px;

  271.     border: .5vw solid #323a45;

  272.     padding: 1px;

  273.   }

  274. figcaption {

  275.   padding: 1rem;

  276.   line-height: 1.4;

  277. }

  278. aside {

  279.   display: flex;

  280.   flex-direction: column;

  281.   background-color: #e3e1e1;

  282.   padding: 1rem 0;

  283.   border-bottom: .2vh solid #07486c;

  284. }

  285.   aside p {

  286.     max-width: 50rem;

  287.     margin: 0 auto;

  288.   }

  289. 

  290. /* https://fvsch.com/code/css-locks/ */

  291. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  292.   font-size: 1rem;

  293.   line-height: calc( 1.5em + 0.2 * 1rem );

  294. }

  295. h1 {

  296.   font-size: 1.9rem;

  297.   line-height: calc( 1.2em + 0.2 * 1rem );

  298. }

  299. h2 {

  300.   font-size: 1.6rem;

  301.   line-height: calc( 1.3em + 0.2 * 1rem );

  302. }

  303. h3 {

  304.   font-size: 1.35rem;

  305.   line-height: calc( 1.4em + 0.2 * 1rem );

  306. }

  307. @media (min-width: 20em) {

  308.   /* The (100vw - 20rem) / (50 - 20) part

  309.      resolves to 0-1rem, depending on the

  310.      viewport width (between 20em and 50em). */

  311.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  312.     font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );

  313.     line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );

  314.     margin-left: 0;

  315.   }

  316.   h1 {

  317.     font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  318.     line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );

  319.   }

  320.   h2 {

  321.     font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  322.     line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );

  323.   }

  324.   h3 {

  325.     font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  326.     line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );

  327.   }

  328. }

  329. @media (min-width: 50em) {

  330.   /* The right part of the addition *must* be a

  331.      rem value. In this example we *could* change

  332.      the whole declaration to font-size:2.5rem,

  333.      but if our baseline value was not expressed

  334.      in rem we would have to use calc. */

  335.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  336.     font-size: calc( 1rem + .6 * 1rem );

  337.     line-height: 1.5em;

  338.   }

  339.   p, li, pre, details {

  340.     margin-left: 3rem;

  341.   }

  342.   h1 {

  343.     font-size: calc( 1.9rem + 1.5 * 1rem );

  344.     line-height: 1.2em;

  345.   }

  346.   h2 {

  347.     font-size: calc( 1.5rem + 1.5 * 1rem );

  348.     line-height: 1.3em;

  349.   }

  350.   h3 {

  351.     font-size: calc( 1.35rem + 1.5 * 1rem );

  352.     line-height: 1.4em;

  353.   }

  354.   figure img {

  355.     max-width: 500px;

  356.     max-height: 500px;

  357.   }

  358. }

  359. 

  360. figure.unsquared {

  361.   margin-bottom: 1.5rem;

  362. }

  363.   figure.unsquared img {

  364.     height: inherit;

  365.   }

  366. 

  367. 

  368. 

  369. @media print {

  370.   body { font-size: 100%; }

  371.   a:after { content: " (" attr(href) ")"; }

  372.   a, a:link, a:visited, a:after {

  373.     text-decoration: underline;

  374.     text-shadow: none !important;

  375.     background-image: none !important;

  376.     background: white;

  377.     color: black;

  378.   }

  379.   abbr[title] { border-bottom: 0; }

  380.   abbr[title]:after { content: " (" attr(title) ")"; }

  381.   img { page-break-inside: avoid; }

  382.   @page { margin: 2cm .5cm; }

  383.   h1, h2, h3 { page-break-after: avoid; }

  384.   p3 { orphans: 3; widows: 3; }

  385.   img {

  386.     max-width: 250px !important;

  387.     max-height: 250px !important;

  388.   }

  389.   nav, aside { display: none; }

  390. }

  391. 

  392. ul.with_columns {

  393.   column-count: 1;

  394. }

  395. @media (min-width: 20em) {

  396.   ul.with_columns {

  397.     column-count: 2;

  398.   }

  399. }

  400. @media (min-width: 50em) {

  401.   ul.with_columns {

  402.     column-count: 3;

  403.   }

  404. }

  405. ul.with_two_columns {

  406.   column-count: 1;

  407. }

  408. @media (min-width: 20em) {

  409.   ul.with_two_columns {

  410.     column-count: 1;

  411.   }

  412. }

  413. @media (min-width: 50em) {

  414.   ul.with_two_columns {

  415.     column-count: 2;

  416.   }

  417. }

  418. 

  419. .gallery {

  420.   display: flex;

  421.   flex-wrap: wrap;

  422.   justify-content: space-around;

  423. }

  424.   .gallery figure img {

  425.     margin-left: 1rem;

  426.     margin-right: 1rem;

  427.   }

  428.   .gallery figure figcaption {

  429.     font-family: 'ConcourseT3'

  430.   }

  431. 

  432. footer {

  433.   font-family: 'ConcourseT3';

  434.   display: flex;

  435.   flex-direction: column;

  436.   border-top: 3px solid white;

  437.   padding: 4rem 0;

  438.   background-color: #07486c;

  439.   color: white;

  440. }

  441.   footer > * {

  442.     max-width: 50rem;

  443.     margin: 0 auto;

  444.   }

  445.   footer a {

  446.     color: #f1c40f;

  447.   }

  448.   footer .avatar {

  449.     width: 200px;

  450.     height: 200px;

  451.     border-radius: 50%;

  452.     float: left;

  453.     -webkit-shape-outside: circle();

  454.     shape-outside: circle();

  455.     margin-right: 2rem;

  456.     padding: 2px 5px 5px 2px;

  457.     background: white;

  458.     border-left: 1px solid #f1c40f;

  459.     border-top: 1px solid #f1c40f;

  460.     border-right: 5px solid #f1c40f;

  461.     border-bottom: 5px solid #f1c40f;

  462.   }

  463. </style>

  464. 

  465. <h1 class="single">

  466.   <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>

  467.   Fondée sur des valeurs

  468.   <time>Publié le 29 mars 2013</time>

  469. </h1>

  470. <article class="single">

  471.   <p>J’étais à Devoxx hier soir comme <a href="/david/blog/2013/conferences-diversite/">annoncé</a> pour présenter <a href="http://www.devoxx.com/display/FR13/BOF+Not+Only+SSII">une approche différente de la SSII</a> et je devais décrire l’expérience <a href="http://scopyleft.fr">scopyleft</a> :</p>

  472. <blockquote>

  473. <p>scopyleft est une SCOP (Société Coopérative et Participative) toute jeune — seulement 3 mois — ce qui ne permet pas d’avoir le recul nécessaire pour valider ou invalider une approche. Ni même pour juger de sa viabilité. C’est pourquoi j’ai choisi de vous parler de sa genèse : autrement dit, de <em>l’avant scopyleft</em>.</p>

  474. <p>Notre approche a été de <strong>ne pas</strong> commencer par le traditionnel <em>business plan</em> mais de nous aligner entre nous 4 sur les <strong>valeurs fondatrices</strong> que nous voulions comme cap au cours de la vie de l’entreprise. Si l’approche économique nous donnait une vision pour environ 1 an avec son lot d’incertitudes et autres pivotages, passer par des valeurs nous amenait à considérer une durée beaucoup plus longue… de l’ordre de la décennie. Ambitieux projet.</p>

  475. <p>Cela commence par mieux se connaître, discuter de valeurs permet d’aller beaucoup plus en profondeur qu’une discussion sur le retour sur investissement, les salaires ou le titre que l’on souhaite avoir dans l’entreprise. Une fois d’accord sur le fond — <strong>honnêteté intellectuelle, courage, bien-être, respect et partage</strong> —, nous sommes arrivés à formuler une phrase (à défaut d’un manifeste) résumant notre objectif commun :</p>

  476. <blockquote>

  477. <p><strong>Travailler entre humains, sur des projets éthiques et intéressants, tout en privilégiant le bien-être et le plaisir de chacun.</strong></p>

  478. </blockquote>

  479. <p><em>Ces valeurs et cette maxime nous guident dans nos choix stratégiques au quotidien pour accepter ou non un client, pour concrétiser une initiative ou pour accompagner un projet.</em></p>

  480. <p>C’est notamment ce qui nous a menés à choisir le statut de <em>SCOP</em>,  un statut basé sur une <em>gouvernance démocratique</em> (1 homme = 1 voix) et favorisant la <em>pérennité</em> des emplois et du projet d’entreprise (co-entrepreunariat et réserve importante imposés). <strong>Ce statut met l’humain au cœur de l’entreprise, ce qui diffère d’une entreprise traditionnelle qui se concentre sur son capital.</strong> C’est un changement de paradigme majeur dans une société capitaliste. Nous avons enrichi ces statuts d’une co-gérance tournante (faute de pouvoir gérer à 4) et d’une égalité salariale.</p>

  481. <p>Un autre aspect de la SCOP qui a attisé notre curiosité est la notion de <strong>solidarité inter-entreprises</strong> au sein de la confédération des SCOP. C’est notamment ce que l’on a pu constater avec les entreprises qui nous ressemblent, il existe relativement peu de SCOP (dans l’informatique) mais elles se serrent les coudes !</p>

  482. <p>Ces 3 derniers mois nous ont permis de reconsidérer notre approche économique, de mieux nous connaître, d’avoir énormément de retours (à la fois de nos clients et de nos pairs), de coder <em>ensemble</em>, d’accompagner <em>ensemble</em>, d’assister à des conférences <em>ensemble</em>, de stresser <em>ensemble</em>, de faire de l’administratif <em>ensemble</em>, autant de tâches qui sont loin d’être insurmontables et qui sont le lot quotidien du créateur d’entreprise mais qui s’avèrent être moins pénibles lorsque l’on poursuit <strong>un objectif un peu plus « élevé »</strong> (sain ?) que le simple aspect financier. Augmenté par le fait de le réaliser à plusieurs.</p>

  483. <p>Cette aventure aurait difficilement pu être envisageable sans avoir confiance dans notre <em>savoir-faire</em> acquis lors de nos expériences respectives à nos comptes. Malgré notre expérience dans le domaine, l’un de nos objectifs à terme est de nous libérer de la prestation pour <strong>co-produire des produits utiles, éthiques et open-source</strong>.</p>

  484. <p>Pour résumer, <strong>scopyleft est une entreprise fondée sur des valeurs pour créer de la valeur.</strong> En coopérant.</p>

  485. </blockquote>

  486. <p>Je n’ai pas dû dire la moitié de tout ça au final car l’approche monologue était un peu ennuyante et je préférais avoir plus de temps pour discuter. Et là je n’ai pas été déçu car les réactions ont été nombreuses, un peu décousues et agressives mais cela montrait un intérêt certain.</p>

  487. <p><em>Décousues</em> car on était nombreux à pouvoir répondre (une dizaine) et qu’il y avait beaucoup de questions qui passaient brutalement du fond à la forme selon le niveau de réflexion de chacun. Peut-être qu’un autre format (groupes de discussions par exemple) se prêtait mieux à la discussion ouverte mais la salle n’était pas adaptée.</p>

  488. <p><em>Agressives</em> principalement car le titre <em>NoSSII</em> a été interprété comme un affrontement alors que l’on avait bien mis en avant le côté <em>Not only</em>. Dommage, l’idée n’était pas du tout d’aller dans ce sens mais il est peut-être normal que certains se sentent déstabilisés lorsqu’on présente quelque chose de différent.</p>

  489. <p>Quelques questions dont je me souviens :</p>

  490. <blockquote>

  491. <p>À quoi cela sert-il de créer une SCOP vs. un GIE (Groupement d’intérêt économique) d’indépendants ?</p>

  492. </blockquote>

  493. <p>L’objectif n’est pas du tout le même, principalement car <strong>on ne se regroupe pas en SCOP pour un intérêt économique</strong> mais pour partager et échanger à un autre niveau.</p>

  494. <blockquote>

  495. <p>Qu’est-ce qui vous différencie d’une SSII classique finalement ?</p>

  496. </blockquote>

  497. <p>D’une part le fait d’avoir le contrôle sur les objectifs de la société, ils peuvent être lucratifs ou pas, ils peuvent être citoyens ou pas, ils peuvent être éthiques ou pas, ils peuvent s’émanciper de la prestation ou pas. D’autre part, le fait de <strong>mettre l’humain au cœur du cadre de travail</strong> est un changement radical, ce qui change aussi les relations avec les clients.</p>

  498. <blockquote>

  499. <p>Comment gérez-vous les problèmes d’éthiques ?</p>

  500. </blockquote>

  501. <p><strong>Nous n’avons pas de règle pré-définie,</strong> chaque cas aux limites est discuté longuement et un vote suivant <a href="http://www.oss-watch.ac.uk/resources/meritocraticGovernanceVoting#voting">les pratiques de l’Open-Source</a> (et de <a href="https://docs.djangoproject.com/en/dev/internals/contributing/bugs-and-features/#how-we-make-decisions">Django</a>) permet de trancher.</p>

  502. <blockquote>

  503. <p>Est-ce que ça peut fonctionner à plus grande échelle ?</p>

  504. </blockquote>

  505. <p>L’exemple <a href="http://www.valvesoftware.com/company/Valve_Handbook_LowRes.pdf">du handbook de Valve</a> a été mis en avant avec quelques autres. La question c’est plutôt de savoir quel est l’intérêt de passer à une autre échelle ? Dans notre cas par exemple, <strong>c’est une volonté forte de rester à taille humaine.</strong></p>

  506. <p>Ça rejoint d’ailleurs une question relative au référencement dans les services achats des grosses entreprises. C’est peut-être plus difficile en étant petit mais en fait ça nous intéresse peu de travailler avec ce type de structures donc ça limite le problème. Beaucoup de questions n’allaient pas assez loin dans le <em>pourquoi</em> et se limitaient au <em>comment</em>.</p>

  507. <blockquote>

  508. <p>Comment trouvez-vous des clients ?</p>

  509. </blockquote>

  510. <p>On ne sait pas démarcher. Partant de ce constat, ça passe plutôt par <strong>de la recommandation ou des connaissances</strong> qui nous suivent depuis longtemps et le partage de nos expériences. On a également la chance d’avoir des entreprises partageant nos valeurs qui nous transmettent des demandes.</p>

  511. <p>Les <a href="http://www.freelanceinformatique.com/2013/03/29/devoxxfr-nossii-reaction-a-chaud/">réactions à chaud</a> sont plutôt positives, j’espère que l’on aura réussi avec <a href="http://ninja-squad.com/">Ninja Squad</a> et <a href="http://www.lateral-thoughts.com/">Lateral Thoughts</a> à au moins attiser la curiosité de certains et pourquoi pas à en motiver pour monter leur propre structure !</p>

  512. <p><em>[Mise à jour]</em> : <a href="http://www.pingtimeout.fr/2013/04/retour-sur-devoxx-france-bof-nossii.html">Retour sur Devoxx France - BOF NoSSII</a></p>

  513. </article>

  514. 

  515.   <section>

  516.     <h3>Discussion suite à l’article :</h3>

  517. 

  518.       <article id="comment-1" class="comment">

  519.         <blockquote>

  520. <p>Agressives principalement car le titre NoSSII a été interprété comme un affrontement alors que l’on avait bien mis en avant le côté Not only. Dommage, l’idée n’était pas du tout d’aller dans ce sens mais il est peut-être normal que certains se sentent déstabilisés lorsqu’on présente quelque chose de différent.</p>

  521. </blockquote>

  522. <p>Je suis d’accord, quand on dit NoSQL par exemple, on s’attend tout de suite à voir des gens qui connaissent bien les SGBDR, les possibilités, les domaines d’applications, les limites, et pas une seconde à tomber sur des boutonneux dont le seul discours est « bande de nases, vous êtes tous des vieux encroûtés dans le passé, nous on est l’avenir parce qu’on fait des trucs nouveaux et on sait que c’est nouveau parce qu’on ne connaît pas le passé donc on a raison ».</p>

  523. <p>Revoyons les fameux utilisateurs du « No » signifiant « Not only » comme tout le monde est censé le savoir à la lecture du titre.</p>

  524. <p>Les punks : « Not only future », pour montrer qu’ils avaient quand même de l’espoir et que c’était un mouvement dans le fond assez optimiste.</p>

  525. <p>Occupy Wall Street : « Not Only Blank Checks For Wall Street », le mouvement exprime par là qu’il ne faut pas seulement donner des chèques en blanc aux financiers, mais aussi des paradis fiscaux, de la drogue et des prostituées.</p>

  526. <p>37signals : « Not Only Functional Specs », chez 37signals, ils insistent pour écrire des spécifications fonctionnelles complètes, mais aussi des spécifications techniques détaillées, comme par exemple comment parser du JSON avec le parser YAML afin de transformer n’importe quelle application RoR de la planète en backdoor.</p>

  527. <p>Franchement, "NoSSII" comme titre c’était clair, et comme les intitulés des conférences à Devoxx sont limités à 10 caractères vu que le programme est stocké dans un code-barre 2D imprimé sur un post-it certifié Scrum, y’avait pas moyen d’être plus explicite :-P</p>

  528.         <p><cite>Damien B, le <a href="#comment-1">2013-03-29 à 18:14</a></cite></p>

  529.       </article>

  530. 

  531.   </section>

  532. 

  533. 

  534. 

  535. 

  536. <nav id="jumpto">

  537.   <p>

  538.     <a rel=prev href="/david/blog/2013/eduquer-joie/">← Éduquer à la joie</a> | <a href="/david/blog/" title="Retour à la liste des expériences">↑</a> | <a rel=next href="/david/blog/2013/proprieterre/">Propriéterre →</a>

  539.   </p>

  540. </nav>

  541. 

  542. <footer>

  543.   <div>

  544.     <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">

  545.     <p>

  546.       Bonjour/Hi!

  547.       Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>

  548.       Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).

  549.     </p>

  550.     <p>

  551.       Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.

  552.     </p>

  553. 

  554.       <p>

  555.         Les dernières publications hebdomadaires sont :

  556.       </p>

  557.       <ul class="with_columns">

  558. 

  559.           <li>

  560.             <a href="/david/stream/2019/12/31/">Merci</a>

  561.           </li>

  562. 

  563.           <li>

  564.             <a href="/david/stream/2019/12/27/">Intemporels</a>

  565.           </li>

  566. 

  567.           <li>

  568.             <a href="/david/stream/2019/12/24/">Outils</a>

  569.           </li>

  570. 

  571.           <li>

  572.             <a href="/david/stream/2019/12/17/">Origines</a>

  573.           </li>

  574. 

  575.           <li>

  576.             <a href="/david/stream/2019/12/10/">Publier</a>

  577.           </li>

  578. 

  579.           <li>

  580.             <a href="/david/stream/2019/12/03/">En forêt</a>

  581.           </li>

  582. 

  583.           <li>

  584.             <a href="/david/stream/2019/11/26/">Ecocentric</a>

  585.           </li>

  586. 

  587.           <li>

  588.             <a href="/david/stream/2019/11/19/">Se livrer</a>

  589.           </li>

  590. 

  591.           <li>

  592.             <a href="/david/stream/2019/11/12/">Dépendances</a>

  593.           </li>

  594. 

  595.           <li>

  596.             <a href="/david/stream/2019/11/05/">Positif</a>

  597.           </li>

  598. 

  599.           <li>

  600.             <a href="/david/stream/2019/10/29/">Dettes</a>

  601.           </li>

  602. 

  603.           <li>

  604.             <a href="/david/stream/2019/10/22/">Privilèges</a>

  605.           </li>

  606. 

  607.           <li>

  608.             <a href="/david/stream/2019/10/15/">Discrétion</a>

  609.           </li>

  610. 

  611.           <li>

  612.             <a href="/david/stream/2019/10/08/">Désespérance</a>

  613.           </li>

  614. 

  615.           <li>

  616.             <a href="/david/stream/2019/10/01/">Présent</a>

  617.           </li>

  618. 

  619.           <li>

  620.             <a href="/david/stream/2019/09/24/">Manifester</a>

  621.           </li>

  622. 

  623.           <li>

  624.             <a href="/david/stream/2019/09/17/">Arpenter</a>

  625.           </li>

  626. 

  627.           <li>

  628.             <a href="/david/stream/2019/09/10/">Nostalgie</a>

  629.           </li>

  630. 

  631.           <li>

  632.             <a href="/david/stream/2019/09/03/">Déconstruire</a>

  633.           </li>

  634. 

  635.           <li>

  636.             <a href="/david/stream/2019/08/27/">Documenter</a>

  637.           </li>

  638. 

  639.           <li>

  640.             <a href="/david/stream/2019/08/20/">Frustration</a>

  641.           </li>

  642. 

  643.           <li>

  644.             <a href="/david/stream/2019/08/13/">Holisme</a>

  645.           </li>

  646. 

  647.           <li>

  648.             <a href="/david/stream/2019/08/06/">1%</a>

  649.           </li>

  650. 

  651.           <li>

  652.             <a href="/david/stream/2019/07/30/">Exemplarité</a>

  653.           </li>

  654. 

  655.           <li>

  656.             <a href="/david/stream/2019/07/23/">Timelines</a>

  657.           </li>

  658. 

  659.           <li>

  660.             <a href="/david/stream/2019/07/16/">Écoute</a>

  661.           </li>

  662. 

  663.           <li>

  664.             <a href="/david/stream/2019/07/02/">Anxiété</a>

  665.           </li>

  666. 

  667.           <li>

  668.             <a href="/david/stream/2019/06/21/">À lier</a>

  669.           </li>

  670. 

  671.           <li>

  672.             <a href="/david/stream/2019/06/14/">Pauvreté</a>

  673.           </li>

  674. 

  675.           <li>

  676.             <a href="/david/stream/2019/06/07/">Amateur</a>

  677.           </li>

  678. 

  679.           <li>

  680.             <a href="/david/stream/2019/05/31/">Pollution</a>

  681.           </li>

  682. 

  683.           <li>

  684.             <a href="/david/stream/2019/05/24/">Apaisement</a>

  685.           </li>

  686. 

  687.           <li>

  688.             <a href="/david/stream/2019/05/10/">Folie</a>

  689.           </li>

  690. 

  691.           <li>

  692.             <a href="/david/stream/2019/05/03/">Sympathie</a>

  693.           </li>

  694. 

  695.           <li>

  696.             <a href="/david/stream/2019/04/12/">Péremption</a>

  697.           </li>

  698. 

  699.           <li>

  700.             <a href="/david/stream/2019/04/05/">Définitions</a>

  701.           </li>

  702. 

  703.           <li>

  704.             <a href="/david/stream/2019/03/29/">Acceptation</a>

  705.           </li>

  706. 

  707.           <li>

  708.             <a href="/david/stream/2019/03/22/">Dissonance</a>

  709.           </li>

  710. 

  711.           <li>

  712.             <a href="/david/stream/2019/03/15/">Reconnaissance</a>

  713.           </li>

  714. 

  715.           <li>

  716.             <a href="/david/stream/2019/03/08/">Lecture</a>

  717.           </li>

  718. 

  719.           <li>

  720.             <a href="/david/stream/2019/03/01/">Journaux</a>

  721.           </li>

  722. 

  723.           <li>

  724.             <a href="/david/stream/2019/02/22/">Écriture</a>

  725.           </li>

  726. 

  727.           <li>

  728.             <a href="/david/stream/2019/02/15/">Kyriarchie</a>

  729.           </li>

  730. 

  731.           <li>

  732.             <a href="/david/stream/2019/02/08/">Mots-serrures</a>

  733.           </li>

  734. 

  735.           <li>

  736.             <a href="/david/stream/2019/02/01/">Sans voie</a>

  737.           </li>

  738. 

  739.           <li>

  740.             <a href="/david/stream/2019/01/25/">Auto-diagnostic</a>

  741.           </li>

  742. 

  743.           <li>

  744.             <a href="/david/stream/2019/01/18/">Agilité</a>

  745.           </li>

  746. 

  747.           <li>

  748.             <a href="/david/stream/2019/01/11/">Métaphores</a>

  749.           </li>

  750. 

  751.           <li>

  752.             <a href="/david/stream/2019/01/04/">Balbutiements</a>

  753.           </li>

  754. 

  755.       </ul>

  756. 

  757.     <p>

  758.       Voici quelques articles choisis :

  759.       <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,

  760.       <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,

  761.       <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,

  762.       <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,

  763.       <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,

  764.       <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,

  765.       <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,

  766.       <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,

  767.       <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,

  768.       <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,

  769.       <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,

  770.       <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,

  771.       <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,

  772.       <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,

  773.       <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,

  774.       et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>

  775.     </p>

  776.     <p>

  777.       On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.

  778.     </p>

  779.     <p>

  780.       Je ne traque pas ta navigation mais mon

  781.       <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>

  782.       conserve des logs d’accès.

  783.     </p>

  784.   </div>

  785. </footer>

  786. <script type="text/javascript">

  787.   ;(_ => {

  788.     const jumper = document.getElementById('jumper')

  789.     jumper.addEventListener('click', e => {

  790.       e.preventDefault()

  791.       const anchor = e.target.getAttribute('href')

  792.       const targetEl = document.getElementById(anchor.substring(1))

  793.       targetEl.scrollIntoView({behavior: 'smooth'})

  794.     })

  795.   })()

  796. </script>

  797. 

  798.   <script>

  799.   /* Service workers */

  800.   if (navigator.serviceWorker) {

  801.     window.addEventListener('load', function () {

  802.       var selector = 'a[href^="/david/cache/"], a[rel=prev], a[rel=next]'

  803.       function sendLinks (selector) {

  804.         var links = [].slice.call(document.querySelectorAll(selector)).map(function (link) {

  805.           return link.getAttribute('href')

  806.         })

  807.         links.push(location.pathname)  // Put the current page in cache too.

  808.         navigator.serviceWorker.controller.postMessage({ links: links })

  809.       }

  810.       navigator.serviceWorker.getRegistration()

  811.         .then(function (registration) {

  812.           if (!registration || !navigator.serviceWorker.controller) {

  813.             return navigator.serviceWorker.register('/serviceworker.js')

  814.               .then(navigator.serviceWorker.ready)

  815.               .then(function () {

  816.                 console.log('[ServiceWorker] Ready to go!')

  817.               })

  818.               .catch(console.error.bind(console))

  819.           } else {

  820.             console.log('[ServiceWorker] Send links via registration')

  821.             sendLinks(selector)

  822.           }

  823.         })

  824.       navigator.serviceWorker.addEventListener('controllerchange', function () {

  825.         console.log('[ServiceWorker] Send links via controller change')

  826.         sendLinks(selector)

  827.       })

  828.       navigator.serviceWorker.addEventListener('message', function (event) {

  829.         var link = document.querySelector('a[href="' + event.data.link + '"]')

  830.         if (event.data.status && link) {

  831.           link.style.backgroundColor = '#2d7474'

  832.           link.style.color = '#f0f0ea'

  833. 

  834.             link.setAttribute('title', 'En cache pour consultation sans connexion')

  835. 

  836.         }

  837.       })

  838.     })

  839.   } else {

  840.     console.warn('[ServiceWorker] No cache for old browsers.')

  841.   }

  842. </script>