diff --git a/README.md b/README.md index fb9841f..bafe103 100644 --- a/README.md +++ b/README.md @@ -1,15 +1,3 @@ # Thinking People System A interactive website to better understand the Thinking People System. - -## Feature flow - -### The project - -- 0 defect policy, -- has no external dependancies, -- the team has a strong opinion on Jidoka: - - teams spot 100% of the defects, - - teams do not take a feature who has defects, - - the team who introduced the defect needs to rework on the feature. -- there is no limit on how many defects a feature can have. diff --git a/core.css b/core.css index d7ab07b..2fc9033 100644 --- a/core.css +++ b/core.css @@ -6,7 +6,7 @@ --color: white; } -* { +*:not(td):not(th) { border-radius: 0.5rem; } @@ -29,3 +29,17 @@ main { margin: 1rem 1rem 0; color: var(--color); } + +.meaning { + color: #9f9a9a; + font-weight: 100; + font-size: 1rem; +} + +.meaning::before { + content: '('; +} + +.meaning::after { + content: ')'; +} diff --git a/main.ts b/main.ts index a00745a..90bf228 100644 --- a/main.ts +++ b/main.ts @@ -1,28 +1,28 @@ type TPSSearchParams = { - display?: "house-only" | "full" + display?: 'house-only' | 'full' } const params = new URL(document.location.href).searchParams -const display = params.get("display") +const display = params.get('display') -if (display === "house-only") { - document.querySelector("header")?.remove() +if (display === 'house-only') { + document.querySelector('header')?.remove() } -const size = params.get("size") +const size = params.get('size') -if (size === "small") { - const body = document.querySelector("body") +if (size === 'small') { + const body = document.querySelector('body') if (body) { - body.style.fontSize = "15px" + body.style.fontSize = '15px' } } -const focusElements = params.getAll("focus") +const focusElements = params.getAll('focus') if (focusElements.length > 0) { - const focusables = document.querySelectorAll(".focusable") + const focusables = document.querySelectorAll('.focusable') focusables.forEach((focusable) => { const elementToFocus = focusElements.some((element) => @@ -30,20 +30,35 @@ if (focusElements.length > 0) { ) if (!elementToFocus) { - focusable.classList.add("no-focus") + focusable.classList.add('no-focus') } }) } -const textHide = params.get("text") +const textHide = params.get('text') -if (textHide === "hide") { - const focusables = document.querySelectorAll(".focusable") - focusables.forEach((focusable) => focusable.classList.add("text-hide")) +if (textHide === 'hide') { + const focusables = document.querySelectorAll('.focusable') + focusables.forEach((focusable) => focusable.classList.add('text-hide')) } -const scrollParam = params.get("scroll") +const scrollParam = params.get('scroll') -if (scrollParam === "end") { - window.scrollTo({ top: document.body.scrollHeight, behavior: "smooth" }) +if (scrollParam === 'end') { + window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' }) +} + +const primaryColorParam = params.get('primary') + +if (primaryColorParam) { + document.documentElement.style.setProperty( + '--primary-color', + `#${primaryColorParam}` + ) +} + +const colorParam = params.get('color') + +if (colorParam) { + document.documentElement.style.setProperty('--color', `#${colorParam}`) } diff --git a/package.json b/package.json index 7e051c2..4a9a407 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "chart.xkcd": "^1.1.13", "comlink": "^4.4.1", "pinia": "^2.1.4", + "random-js": "^2.1.0", "vue": "^3.3.4", "vue-starport": "^0.3.0" }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 97e3f3f..982589e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -17,6 +17,9 @@ dependencies: pinia: specifier: ^2.1.4 version: 2.1.4(typescript@5.1.6)(vue@3.3.4) + random-js: + specifier: ^2.1.0 + version: 2.1.0 vue: specifier: ^3.3.4 version: 3.3.4 @@ -897,6 +900,10 @@ packages: react-is: 18.2.0 dev: true + /random-js@2.1.0: + resolution: {integrity: sha512-CRUyWmnzmZBA7RZSVGq0xMqmgCyPPxbiKNLFA5ud7KenojVX2s7Gv+V7eB52beKTPGxWRnVZ7D/tCIgYJJ8vNQ==} + dev: false + /react-is@18.2.0: resolution: {integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==} dev: true diff --git a/src/icons/ProblemSolvingIcon.vue b/src/icons/ProblemSolvingIcon.vue index 1ef680a..b2bc50e 100644 --- a/src/icons/ProblemSolvingIcon.vue +++ b/src/icons/ProblemSolvingIcon.vue @@ -9,7 +9,10 @@ withDefaults(defineProps<{ color?: string }>(), { diff --git a/src/modules/article/FlowHypothesis.vue b/src/modules/article/FlowHypothesis.vue index 97acc64..cb1ee05 100644 --- a/src/modules/article/FlowHypothesis.vue +++ b/src/modules/article/FlowHypothesis.vue @@ -4,13 +4,21 @@

Here our hypothesis:

    -
  1. it takes the same amount of time for each team to complete a task
    2. +
  2. + it takes the same amount of time for each team to complete a task + same task time +
    3. +
  3. teams have no other external dependencies
  4. teams know exactly what they need to produce their part, they will tag any defects they found when verifying the feature is good.
    5. -
  5. the team where the defect appears must rework the feature.
    6. +
  6. + 0 defect policy: the team where the defect appears must rework the + feature. +
  7. release team never fails
    8. +
  8. there is no limit on how many defects a feature can have.
diff --git a/src/modules/article/FlowSetup.vue b/src/modules/article/FlowSetup.vue index f2067a1..e66eeec 100644 --- a/src/modules/article/FlowSetup.vue +++ b/src/modules/article/FlowSetup.vue @@ -4,13 +4,14 @@ import PullSystemIcon from '@/icons/PullSystemIcon.vue' import PushSystemIcon from '@/icons/PushSystemIcon.vue' import FeatureItem from '@/modules/feature/FeatureItem.vue' import FlowControls from '@/modules/feature/FlowControls.vue' +import QualityIssue from '@/modules/feature/QualityIssue.vue' import { Feature } from '@/modules/feature/feature' const feature: Feature = { name: 'As a user, in the homepage, I can login', complexity: 3, leadTime: 2, - qualityIssue: 2, + qualityIssue: 4, status: 'doing', step: 2 } @@ -36,8 +37,8 @@ const feature: Feature = { number and deliver as fast as possible.

- {{ feature.qualityIssue }} are the number of - defects the feature had during the flow. + + are the number of defects the feature had during the flow.

You have 20 features to deliver, and each day you can choose between 3 @@ -85,15 +86,22 @@ const feature: Feature = { understand and limit rework. The more the team investigate, the more the team learn and start to be extremely good at problem solving.

-

Blue bin: the security stocks

+

Blue bin: the security stock

Blue bins are your security stock, to make sure teams can work without any blockers. It's to make sure the next team will always have material to transform. But it comes with a cost: overburden, stagnation (increase lead - time) and duplicated mistakes (not simulated here). The less you have, the + time) and duplicated mistakes + not simulated here. The less you have, the less your team has mental charge. The more you have, the more secure you are to make teams work. One solution: simplify your flow and lower the number of operation the teams have to do to deliver a feature.

+ + diff --git a/src/modules/feature/FeatureItem.vue b/src/modules/feature/FeatureItem.vue index fd3c269..95595d4 100644 --- a/src/modules/feature/FeatureItem.vue +++ b/src/modules/feature/FeatureItem.vue @@ -1,4 +1,5 @@ + + + + diff --git a/src/modules/feature/feature-board.ts b/src/modules/feature/feature-board.ts index 5554241..c5f57b7 100644 --- a/src/modules/feature/feature-board.ts +++ b/src/modules/feature/feature-board.ts @@ -7,6 +7,7 @@ import { getMean, pickRandomElement, popNElement, + randomFloat, shuffleArray, sumElements } from '@/utils' @@ -28,7 +29,7 @@ const hasQualityIssue = ({ ) const multiplicator = getOverburdenMultiplicator(tasksInParallel) - const quality = Math.random() + const quality = randomFloat(0, 1) return quality > qualityProbability / multiplicator } @@ -230,7 +231,7 @@ export const nextDay = ( state.meta.teamWorkExperience += 0.01 if (strategy === 'problem-solving') { - const hasTeamLearned = Math.random() > 0.25 + const hasTeamLearned = randomFloat(0, 1) > 0.25 if (hasTeamLearned) { state.meta.teamWorkExperience += 1.2 } diff --git a/src/modules/feature/feature.fixture.ts b/src/modules/feature/feature.fixture.ts index 051c2f5..fa07fbf 100644 --- a/src/modules/feature/feature.fixture.ts +++ b/src/modules/feature/feature.fixture.ts @@ -1,9 +1,10 @@ import { birds } from '@/data/bird' import { Feature } from '@/modules/feature/feature' +import { randomInteger } from '@/utils' export const features: Feature[] = birds.map((name) => ({ name, - complexity: Math.floor(Math.random() * 5) + 1, + complexity: randomInteger(1, 5), leadTime: 0, status: 'doing', step: Infinity, diff --git a/src/utils.ts b/src/utils.ts index a830c65..b6a43e8 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,3 +1,15 @@ +import { Random } from 'random-js' + +const random = new Random() + +export const randomInteger = (min: number, max: number) => { + return random.integer(min, max) +} + +export const randomFloat = (min: number, max: number) => { + return random.real(min, max) +} + export const getMean = (data: number[]) => Math.round(100 * (sumElements(data) / data.length)) / 100 @@ -11,7 +23,7 @@ export const shuffleArray = (array: T[]) => { randomIndex while (currentIndex !== 0) { - randomIndex = Math.floor(Math.random() * currentIndex) + randomIndex = randomInteger(0, currentIndex - 1) currentIndex-- ;[array[currentIndex], array[randomIndex]] = [ array[randomIndex], @@ -37,7 +49,7 @@ export const popNElement = (array: T[], numberOfElements: number) => { } export const pickRandomIndex = (array: T[]) => - Math.floor(Math.random() * array.length) + randomInteger(0, array.length - 1) export const pickRandomElement = (array: T[]) => array[pickRandomIndex(array)]