123 lines
4.0 KiB
HTML
123 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Interactive Thinking People System</title>
|
|
<meta
|
|
name="description"
|
|
content="Author: Julien Calixte,
|
|
My understanding of the Thinking People System and
|
|
how it helps people and organization to improve"
|
|
/>
|
|
<link rel="stylesheet" href="core.css" />
|
|
<link rel="stylesheet" href="index.css" />
|
|
<link rel="icon" href="people-improvement.svg" />
|
|
<link rel="mask-icon" href="people-improvement.svg" color="#ffffff" />
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1 class="thinking-people-system">Thinking People System</h1>
|
|
</header>
|
|
<main>
|
|
<section class="customer-satisfaction-roof focusable">
|
|
<h2 class="customer-satisfaction">Customer Satisfaction</h2>
|
|
<p class="value-analysis-value-engineering">
|
|
Value analysis / Value engineering
|
|
</p>
|
|
</section>
|
|
<section class="levers">
|
|
<ul>
|
|
<li class="security focusable">Security</li>
|
|
<li class="quality focusable">Quality</li>
|
|
<li class="lead-time focusable">Lead time</li>
|
|
<li class="cost focusable">Cost</li>
|
|
<li class="morale focusable">Morale</li>
|
|
<li class="environment focusable">Environment</li>
|
|
</ul>
|
|
</section>
|
|
<section class="pilars">
|
|
<section class="just-in-time-pilar">
|
|
<h3 class="just-in-time focusable">Just-in-time</h3>
|
|
<ul>
|
|
<li class="takt focusable">Takt</li>
|
|
<li class="one-piece-flow focusable">One piece flow</li>
|
|
<li class="pull-system focusable">Pull system</li>
|
|
</ul>
|
|
</section>
|
|
<section class="people-improvement">
|
|
<svg
|
|
viewBox="0 0 1393 1288"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<rect width="1393" height="1288" />
|
|
<circle
|
|
cx="696.5"
|
|
cy="295.5"
|
|
r="88.5"
|
|
fill="var(--background-color)"
|
|
/>
|
|
<rect
|
|
x="537"
|
|
y="384"
|
|
width="319"
|
|
height="408"
|
|
rx="106"
|
|
fill="var(--background-color)"
|
|
/>
|
|
<rect
|
|
x="593"
|
|
y="672"
|
|
width="207"
|
|
height="408"
|
|
rx="103.5"
|
|
fill="var(--background-color)"
|
|
/>
|
|
<path
|
|
d="M657 1177L732 1220.3L732 1133.7L657 1177Z"
|
|
fill="var(--background-color)"
|
|
/>
|
|
<path
|
|
d="M746 107L671 63.6987V150.301L746 107Z"
|
|
fill="var(--background-color)"
|
|
/>
|
|
<circle
|
|
cx="696.5"
|
|
cy="643.5"
|
|
r="535"
|
|
stroke="var(--background-color)"
|
|
stroke-width="23"
|
|
/>
|
|
</svg>
|
|
</section>
|
|
<section class="jidoka-pilar">
|
|
<h3 class="jidoka focusable">Jidoka</h3>
|
|
<ul>
|
|
<li class="andon focusable">Andon</li>
|
|
<li class="poka-yoke focusable">Poka yoke</li>
|
|
<li class="human-machine focusable">Human / machine</li>
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
<section class="ground">
|
|
<section class="improvement">
|
|
<ul class="improvement-list focusable">
|
|
<li class="heijunka focusable">Heijunka</li>
|
|
<li class="standards focusable">Standards</li>
|
|
<li class="kaizen focusable">Kaizen</li>
|
|
</ul>
|
|
</section>
|
|
<section class="stability">
|
|
<ul class="stability-list focusable">
|
|
<li class="s5s focusable">5S</li>
|
|
<li class="problem-solving focusable">Problem solving</li>
|
|
<li class="tpm focusable">TPM</li>
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
</main>
|
|
<script type="module" src="main.ts"></script>
|
|
</body>
|
|
</html>
|