Brief
The site was pulled in a few directions by different needs: to present my work, to serve as an example of my design ethos, and to represent me as a person (in that order). The need to present different media posed another issue.
Approach
For the sake of unity, I kept it extremely simple, with deviations to suit the type of work presented. For instance, the site’s main typeface (Neue Haas Unica) wasn't suitable for my writing, so I used a more literary, elegant face (Sabon).
Layout
I was very conscious of scale. The homepage is a full screen image of a painting, which I thought of as a giant, silent facade. The links are like tiny doorframes, which compress the viewers as they enter the site. Each main page – design, art, and writing – is wide and expansive, with links that open up into full-scale presentations. The feeling is like a museum, where each room is self-sufficient but sits clearly around a central axis.
Wordmark
I wanted no separation between the wordmark – miles.kim – and the design of the site, so the base font is the same as the identifying mark. Also, because I kept my name in the form of a web address, it forms a single, memorable impression. If you can remember my name, you can remember the address, and vice versa.
Typefaces
Neue Haas Unica is a blend of Univers and Helvetica. I found that Univers was appropriate but too steeped in early modernist connotations, and Helvetica was too brutal. I was happy to discover a progressive middle ground built for digital usage. Sabon is a modern cut based on the classic Garamond. It’s a bit sharper and has that nice blend of tradition and industrial logic that suits my voice.
Details
(animations) I use slight motion only when needed – for instance, in the “project info” button, which needs an upward movement and a rotation of the “+” to draw attention to the toggling action. By default, every element fades into view, resulting in a dreamy, still quality.
(drop shadows) Shadows are used when presenting screens. This kind of separation is totally necessary with so many other elements to parse. I used a very diffuse, light shadow, which has the effect of a surface lifted far from the main computer screen in a room with bright, ambient light.
(transparency) All of the layered elements are slightly see-through, including the overlay that you see here. The beauty of transparency is that it’s a nod to the physical world that stays true to the digital format. Overall, this is the impression I wanted: a site that is unmistakably contemporary but grounded in traditional principles and metaphors.
