-
Notifications
You must be signed in to change notification settings - Fork 0
/
reads.html
215 lines (189 loc) · 10.9 KB
/
reads.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
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="I've read over 100 design books in the past couple of years. Check out my reviews or recommend me a book!">
<meta name="author" content="Josh Kim">
<meta property="og:title" content="Josh Kim's design reading list" />
<meta property="og:url" content="joshkimux.com/reads" />
<meta name="keywords" content="Josh Kim, a11y, accessibility, design, research, inclusive, product, service, ux, user experience, reads, books, reading list, library">
<title>My Reads | Josh Kim is a humanity centered accessibility strategist, educator, and design researcher</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/3-col-portfolio.css" rel="stylesheet">
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Gothic+A1:wght@400;600&family=PT+Serif:wght@700&family=Space+Mono&display=swap" rel="stylesheet">
<!-- Favicon -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
<a class="skip-main" href="#main">Skip to main content</a>
<!--Navigation -->
<header class="nav-border">
<div class="container">
<!--Desktop nav-->
<div class="row flex-nowrap justify-content-between align-items-center">
<div class="nav-logo">
<a href="index.html"><img src="img/logo/logo_human_2.svg" alt="Logo of Josh Kim UX"></a>
</div>
<nav aria-label="main">
<ul role="list" class="d-flex justify-content-end align-items-center">
<li class="cust-nav-item"><a class="subnav" href="index.html">Home</a></li>
<li class="cust-nav-item"><a class="subnav" href="portfolio.html">Portfolio</a></li>
<li aria-current="page" class="cust-nav-item"><a class="subnav subnav-selected" href="reads.html">My Reads</a></li>
<li class="cust-nav-item"><a class="subnav" href="about.html">About Me</a></li>
<li class="talk"><a class="subnav" href="contact.html">Let's Talk</a></li>
</ul>
</nav>
</div>
<!--End of desktop nav-->
<!--Mobile nav-->
<nav class="nav-scroller" aria-label="main">
<div class="nav d-flex">
<a class="subnav" href="index.html">Home</a>
<a class="subnav" href="portfolio.html">Portfolio</a>
<a aria-current="page" class="subnav subnav-selected" href="reads.html">My Reads</a>
<a class="subnav" href="about.html">About Me</a>
</div>
</nav>
<!--End of mobile nav -->
</div>
<!--end of container -->
</header>
<!--end of navigation -->
<!-- Page Content -->
<main role="main" id="main">
<div class="l-padding reads-bg">
<div class="container">
<div class="row">
<div class="col-lg-6">
<h1 class="heading-title">I've read 110 books on design and counting</h1>
<p class="heading-text">I didn't get a degree in UX or HCI. Despite the setback, I designed a curriculum with my mentors and began to grind it out.</p>
<p><a class="btn btn-margin btn-primary" href="https://www.surveymonkey.com/r/XRKBNC2">Recommend Me a Book</a></p>
</div>
<div class="col-lg-6">
<figure>
<img src="img/thumb/books-2.png" class="books" alt="Some of my favorite books including the UX Book, Qualitative Research Methods, and Designing for the Digital Age."/>
</figure>
</div>
</div>
</div>
</div>
<article>
<div class="l-padding">
<div class="container">
<div class="row">
<div class="col-lg-6 card-mobile-margin stickybox-padding">
<header>
<a href="reads/2020books.html"><h2>2020 Bookmark <span role="presentation" aria-hidden="true" class="unicode">→</span></h2></a></header>
<p>In 2020 I want to learn more about inclusive design, design education, and design ethics.</p><p>I'll also be investing more time into developing my UI and accessibility skillsets.</p>
</div>
<div class="col-lg-6">
<figure class="polaroid" >
<video controls width="100%" height="auto" muted autoplay loop role="img" aria-label="A room full of designers reading small pamphlets of chapter 10 Lazy Rectangles from Golden Krishnas book The Best Interface is No Interface.">
<source src="img/thumb/bookclub.mp4" type="video/mp4">
</video>
<figcaption><time datetime="2020-03">[03.2020]</time> I would organize design book clubs from my ever-expanding library before COVID-19. RIP.</figcaption>
</figure>
</div>
</div>
</div>
</div>
</article>
<hr aria-hidden="true"/>
<article>
<div class="l-padding">
<div class="container">
<div class="row">
<div class="col-lg-6 card-mobile-margin stickybox-padding">
<header>
<a href="reads/2019books.html"><h2>2019 Bookmark <span role="presentation" aria-hidden="true" class="unicode">→</span></h2></a></header>
<p>I hustled to complete 41 books based on recommendations from mentors and peers on top of my work and volunteer commitments.</p><p>I completed my year end goal-- but at the cost of my health.</p>
</div>
<figure class="col-lg-6">
<div class="polaroid">
<img src="img/thumb/2019-books.jpg" style="width:100%;" alt="Three of my friends sitting in front of two bookshelves full of design books. There is a board game spread out on the rug we are sitting on."/>
<figcaption><time datetime="2019-05">[05.2019]</time> We used my Living Library as a space to talk about anything!</figcaption>
</div>
</figure>
</div>
</div>
</div>
</article>
<hr aria-hidden="true"/>
<article>
<div class="l-padding">
<div class="container">
<div class="row">
<div class="col-lg-6 card-mobile-margin stickybox-padding">
<header>
<a href="reads/2018books.html"><h2>2018 Bookmark <span role="presentation" aria-hidden="true" class="unicode">→</span></h2></a></header>
<p>Learning about design became a calling to me- not just a responsibility or a new years resolution.</p>
<p>I read a total of 23 design books (not including re-reads). I annotated 11 of them, including 4 digital chapter by chapter trello notes.</p>
</div>
<figure class="col-lg-6">
<div class="polaroid">
<img src="img/thumb/2018-books.jpg" style="width:100%;" alt="Around ten books lined up against a small chalkboard pillar. Review before you read is written on the chalkboard along with four pamphlets including: Other fun books, design thinking and HCD, UX HCI Design textbooks, and Psychology in design."/>
<figcaption><time datetime="2018-11">[11.2018]</time> Humble beginnings for my new project at work. I'll call it the Living Library.</figcaption>
</div>
</figure>
</div>
</div>
</div>
</article>
</main>
<!-- Footer -->
<footer class="footing bg-nav">
<div class="container">
<div class="row l-margin card-mobile-margin">
<div class="col-md-6">
<p>This isn't a generic squarespace portfolio. It's a living work-in-progress that I redesign annually to better represent my growing values and skills as a designer. That being said, it still needs alot of work.</p>
</div>
<div class="col-md-6">
<p><a href="portfolio/include.html">Read more about my commitment to improve accessibility</a> or <a href="https://trello.com/b/03Yn4vXM">see what changes I'm making to my portfolio right now on trello</a>.</p>
<div class="signature">
<p class="heading-subtext">- Josh <span lang="ko">김영순</span> <time datetime="2020-08-15">[08.15.2020]</time></p>
</div>
</div>
</div>
<hr aria-hidden="true"/>
<nav class="row" aria-label="footer">
<div class="col-lg-12">
<ul role="list">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About Me</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li aria-current="page"><a href="reads.html">My Reads</a></li>
<li><a href="mailto:[email protected]">Email</a></li>
<li><a href="https://calendly.com/joshkimux/mentoring">Calendly</a></li>
<li><a href="https://www.linkedin.com/in/joshkimux/">LinkedIn</a></li>
<li><a href="https://medium.com/@joshkimux">Medium</a></li>
<li><a href="resume.html">Resume</a></li>
</ul>
</div>
</nav>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="js/jk.js"></script>
<script>
var motionQuery = matchMedia('(prefers-reduced-motion)');
var v = document.querySelector('video');
function reducedMotionCheck() {
if (motionQuery.matches) {
v.pause();
} else {
v.play();
}
}
reducedMotionCheck();
motionQuery.addListener(reducedMotionCheck);
</script>
</body>
<!-- js -->
<script src="js/jk.js"></script>
</html>