Guido van Dijk
180361eda4
Eight step-by-step guides, appendices (design patterns, design card with eight filled-in examples, AI tools in education), facilitator guide and presentation. LeX Consultancy edition; screenshots from the Dutch build of the same apps. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
15 lines
3.1 KiB
HTML
Generated
15 lines
3.1 KiB
HTML
Generated
<section id="designcard" data-transition="push" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
|
|
<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Design · 10 minutes · in pairs</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Your app in five boxes</h2>
|
|
<div style="display:flex; gap:24px">
|
|
<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">1 · Who for</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">One person, not an audience. What do they know, what do they have no time for?</p></div>
|
|
<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">2 · What goes in</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Text, file, choice? Which questions do you always ask first?</p></div>
|
|
<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">3 · What comes out</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Write one example out by hand.</p></div>
|
|
<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">4 · Rules</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">House style, what must never be invented, which document holds the rules.</p></div>
|
|
<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">5 · Does it work?</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Three tests: two ordinary, one where it must refuse.</p></div>
|
|
</div>
|
|
<p style="font-size:30px; color:#3D4756; line-height:1.4">Pen and paper. Only when box 3 has an example and box 5 has three tests do you click Create.</p>
|
|
|
|
<p style="position:absolute; left:128px; bottom:64px; font-size:24px; color:#8A8F98">Workshop AI Agents with Dify · LeX Consultancy · CC BY-SA 4.0</p><img src="../images/logo-lex.png" alt="LeX Consultancy" style="position:absolute; right:128px; bottom:52px; width:90px; height:52px; object-fit:contain">
|
|
<aside>Hand out the design card (A4). Walk round and ask every pair: who is that one person?</aside>
|
|
</section>
|