-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
57 lines (53 loc) · 2.71 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Concept Roulette</title>
<link rel="stylesheet" href="https://styleguide.fdnd.nl/fdnd.latest.css" />
<script src="main.js" defer></script>
<style>
main > section > p {
font-size: 3rem;
font-weight: bold;
}
</style>
</head>
<body>
<header>
<h1>
<abbr title="Frontend Design & Development"><span>FDND</span></abbr> <span>Concept Roulette</span>
</h1>
<p>Omdat je niet telkens hetzelfde concept wilt bouwen.</p>
</header>
<nav>
<h2>Menu</h2>
<ul>
<li><a class="active" href="#">Klik en win</a></li>
</ul>
</nav>
<main>
<section class="blue-on-green rounded col-span-2">
<h2>Jouw thema:</h2>
<p></p>
<br />
</section>
<section class="col-span-2 pilled">
<h2>Neem de volgende stappen:</h2>
<ol>
<li>Maak een branch voor jouw experiment en kies daarvoor een goede naam (dus niet: branch-elliot-alderson)</li>
<li>Maak een tijdsinschatting en schiet issues in voor je taken (lees even verder)</li>
<li>Doe vooronderzoek en bepaal de elementen van jouw stijl. Gebruik screenshots of Pinterest om een verzameling te maken. Neem een collage op in de betreffende issue.</li>
<li>Schets een wireflow voor jouw concept, gebruik eventueel de morphologische kaart. Bedenk welke interacties, animaties en geluidsondersteuning je nodig hebt. Neem jouw schetsen op in de betreffende issue.</li>
<li>Maak een breakdown schets waarin je onderzoekt hoe je jouw concept met HTML, CSS en Javascript kunt implementeren. Bespreek jouw schets met teamgenoten of docenten. Neem ook jouw breakdown schets op in de betreffende issue.</li>
<li>Implementeer jouw concept in HTML/CSS/JS en Sveltekit. Beschrijf in de betreffende issue hoe je de belangrijkste dingen voor elkaar krijgt.</li>
<li>Test uitvoerig en beschrijf verschillen in performance in de betreffende issue.</li>
<li>Voer een pull-request uit waarin je de belangrijkste zaken uit bovenstaande issues opneemt. (nb. voer het PR nog niet door!)</li>
<li>Publiceer jouw project via Vercel of Netlify naast de bestaande site (je selecteert dan jouw aparte branch).</li>
<li>Laat je concept testen door de tribe bij een user-test tijdens de Design & Code review! Neem opmerkingen op in het pull-request. Voer opgedane inzichten door en voeg die als commits toe aan het pull-request.</li>
</ol>
</section>
</main>
</body>
</html>