-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathwork.html
155 lines (142 loc) · 6.45 KB
/
work.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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!DOCTYPE html>
<html lang="en-ca">
<head>
<meta charset="utf-8">
<title>Em Squared Design</title>
<meta name="description" content="portfolio website: artwork">
<meta name="author" content="Makeda McLean">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="handheldfriendly" content="true">
<meta name="mobileoptimized" content="240">
<meta name="application-name" content="Em Squared Design"/>
<meta name="keywords" content="global, portfolio, website">
<link href="https://fonts.googleapis.com/css?family=Oxygen" rel="stylesheet">
<link href="css/modules.css" rel="stylesheet">
<link href="css/grid.css" rel="stylesheet">
<link href="css/type.css" rel="stylesheet">
<link href="css/main.css" rel="stylesheet">
<link rel="apple-touch-icon" sizes="180x180" href="/imgapple-touch-icon.png">
<link rel="icon" type="img/png" sizes="32x32" href="img/favicon-32x32.png">
<link rel="icon" type="img/png" sizes="16x16" href="img/favicon-16x16.png">
<link rel="manifest" href="img/site.webmanifest">
<link rel="mask-icon" href="img/safari-pinned-tab.svg" color="#b8112f">
<meta name="msapplication-TileColor" content="#b91d47">
<meta name="theme-color" content="#ffffff">
</head>
<body>
<header>
<div>
<a href="index.html"><img class="logo" src="img/logo.svg" alt="logo"></a>
</div>
<nav id="nav" class="nav nav-top">
<ul class="list-group">
<li class="island"><a href="index.html">About</a></li>
<li class="island selected"><a href="work.html">Work</a></li>
<li class="island"><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main>
<section>
<div>
<h1>Work</h1>
<div class="grid">
<div class="unit xs-1 s-1 m-1 l-1">
<h2>UI Design</h2>
<div class="grid">
<div class="unit xs-1 s-1 m-1-2 l-1-2">
<figure>
<img class="img-flex gutter" src="img/2.png" alt="giftd poster">
<figcaption>
<h3>Giftd User Interface Design</h3>
<h4>Criteria</h4>
<p>To create an interesting friendly and inviting interface using simple design based off of the clients decisions.<br>
<a class="readMore" href="giftd.html">Read more...</a>
</figcaption>
</figure>
</div>
<div class="unit xs-1 s-1 m-1-2 l-1-2">
<figure>
<img class="img-flex gutter" src="img/5.png" alt="origamist poster">
<figcaption>
<h3>Origamist User Interface Design</h3>
<h4>Criteria</h4>
<p>To create an interesting, but simple design best suited for website of your choice.</p>
<a class="readMore" href="origamist.html">Read more...</a>
</figcaption>
</figure>
</div>
</div>
</div>
<div class="unit xs-1 s-1 m-1-2 l-1-2">
<h2>Illustration</h2>
<div>
<figure>
<img class="img-flex gutter" src="img/1.png" alt="gestalt poster">
<figcaption>
<h3>Gestalt Illustration</h3>
<h4>Criteria</h4>
<p>To create an interesting design based off of the combination of parallel lines and patterns.</p>
<a class="readMore" href="gestalt.html">Read more...</a>
</figcaption>
</figure>
</div>
</div>
<div class="unit xs-1 s-1 m-1-2 l-1-2">
<h2>Brand Identity</h2>
<figure>
<img class="img-flex gutter" src="img/4.png" alt="identity poster">
<figcaption>
<h3>Emsquared</h3>
<h4>Criteria</h4>
<p>To create an interesting design based off of facts about yourself with the use of few colours.</p>
<a class="readMore" href="emsquared.html">Read more...</a>
</figcaption>
</figure>
</div>
<div class="grid">
<div class="unit xs-1 s-1 m-1 l-1">
<h2>Print</h2>
<div class="grid">
<div class="unit xs-1 s-1 m-1-2 l-1-2">
<figure>
<img class="img-flex gutter" src="img/3.png" alt="music poster">
<figcaption>
<h3>Iconic Music Poster | Maneater by: Nelly Furtado</h3>
<h4>Criteria</h4>
<p>To create an creative interesting, but simple design best suited for the song chosen in class. That must be predominently black with the option of using spot pantone colour.</p>
<a class="readMore" href="iconic.html">Read more...</a>
</figcaption>
</figure>
</div>
<div class="unit xs-1 s-1 m-1-2 l-1-2">
<figure>
<img class="img-flex gutter" src="img/6.png" alt="type poster">
<figcaption>
<h3>Type Poster | Myriad Pro</h3>
<h4>Criteria</h4>
<p>To create a poster based on an Open Type font of choice without the use of illustrations.</p>
<a class="readMore" href="myriad.html">Read more...</a>
</figcaption>
</figure>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer id=footer class="pad-t">
<p> © Makeda McLean | Emsquared Design | All Rights Reserved | 2020.</p>
<ol class="list-group-inline">
<li class="gutter"><a href="https://www.instagram.com/em_squared_design/"><img class="icon i-32" src="img/instagram.svg" alt="instagram"></a></li>
<li class="gutter"><a href="https://www.behance.net/emsquared"><img class="icon i-32" src="img/behance.svg" alt="behance"></a></li>
<li class="gutter"><a href="https://www.linkedin.com/in/makeda-mclean-3788945b?trk=nav_responsive_tab_profile_pic"><img class="icon i-32" src="img/linkedin.svg" alt="linkedin"></a></li>
<li class="gutter"><a href="https://www.github.com/emnemdesign"><img class="icon i-32" src="img/github.svg" alt="github"></a></li>
<li class="gutter"><a href="https://www.vimeo.com/emsquared"><img class="icon i-32" src="img/vimeo.svg" alt="vimeo"></a></li>
</ol>
<a class="b2t" href="#nav"><p>scroll back to top</p></a>
</footer>
</body>
</html>