-
Notifications
You must be signed in to change notification settings - Fork 0
/
projecten.html
87 lines (69 loc) · 4.54 KB
/
projecten.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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1" name="viewport" />
<meta name="theme-color" content="#999999" />
<title>Portfolio</title>
<link rel="stylesheet" href="style/style.css">
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Raleway:400,700,700i,800&display=swap" rel="stylesheet">
</head>
<body>
<header>
<nav>
<ul>
<li id="portfolioMenu"><a href="index.html">Portfolio</a></li>
<li><a href="index.html">Over Mij</a></li>
<li><a href="projecten.html">Projecten</a></li>
</ul>
</nav>
</header>
<main>
<section>
<h1>Frontend Development</h1>
<h2>HTML, CSS, JS</h2>
<p>Deze opdracht gaat vooral over het responsive maken van een pagina d.m.v. mobile first design. Deze gehele pagina moest zelf gecodeerd worden, en het design van Lowlands moet er op worden toegepast. Ik ben er momenteel nog mee bezig, maar <a href="frontend/index.html" target="_blank">hier</a> is de pagina te bekijken. Ik moet nog een aantal elementen van de Lowlands website toevoegen, en meer pagina's maken.</p>
<img src="img/lowlandsLap.png" alt="lowlands computer">
<div id="lowlandsTel">
<p>Op telefoon veranderd de pagina naar één kolom, en wordt het menu een verborgen. Dit wordt gedaan omdat het anders een groot deel van het scherm in zou nemen.</p>
<img src="img/lowlandsTel.jpg" alt="lowlands mobiel">
</div>
</section>
<section>
<h1>HCI</h1>
<p>Human Computer Interaction ging om het toepassen van design principes, en het ontwerpen van een site die bij de doelgroep en opdracht gever past. Bij dit ontwerp voor Ijscuypje was het belangrijk om het proces van bestellen inzichtelijk te maken voor de gebruiker en de gebruiker op de hoogte te houden waar hij zich bevindt.</p>
<img src="img/ijscuypje.png" alt="hci project">
<img src="img/ijscuypje2.png" alt="hci project2">
</section>
<section>
<h1>Internet-standaarden</h1>
<h2>HTML, CSS</h2>
<p>Internet standaarden was mijn eerste ervaring met HTML/CSS. Tijdens dit vak leerde je semantisch correct coderen. Ik vond HTML/CSS leuk om mee te werken. Ik ging ook dieper in op de stof dan nodig was, want ik wilde de site responsive maken en dit leerde je niet tijdens dit vak. Mijn eerste website is <a href="internetstaandaarden/index.html" target="_blank">hier</a> te bekijken</p>
<img src="img/internetstandaarden.png" alt="internetstandaarden site">
</section>
<section>
<h1>Programmeren</h1>
<h2>JS</h2>
<p>Programmeren ging om het leren van Javascript. Bij dit project had ik een tamagotchi gemaakt. Deze heeft constant eten nodig om te overleven. Elk eten heeft een ander effect op Snorlax. Als de health balk leeg is moet Snorlax terug in de pokéball om weer tot leven te komen. <a href="programmeren/snorlax.html" target="_blank">Deze opdracht</a> toont het niveau van mijn Javascript. Ik zou hier graag beter in willen worden.</p>
<img src="img/programmeren.png" alt="eerste js opdracht">
</section>
<h1>Posters</h1>
<h2>Illustrator</h2>
<div class="posters">
<img class="illustrator" src="img/mac.png" alt="mac miller">
<img class="illustrator" src="img/brother.png" alt="brother ali">
<img class="illustrator" src="img/snelle.png" alt="snelle">
<img class="illustrator" src="img/anderson.png" alt="anderson paak">
<img class="illustrator" src="img/biggie.png" alt="biggie">
<img class="illustrator" src="img/ganesha.png" alt="ganesha">
</div>
<h1>Vormgeving</h1>
<div class="posters">
<p>Bij deze opdracht moest ik een bestaand verhaal vormgeven <a href="https://nurksmagazine.nl/2011/03/stijloefeningen-38-moe/" target="_blank">(99 verhalen, Molovich)</a>. Dit verhaal moest vormgegeven worden op basis van je eigen beschrijving van het verhaal. Met de beschrijving van het verhaal in je hoofd moesten er foto's gemaakt worden op straat. En deze foto's gaven vervolgens de basis waarop je het verhaal ging ontwerpen.</p>
<img class="illustrator" src="img/moe2.png" alt="moe">
</div>
</main>
<footer>
</footer>
</body>