Gwern Branwen의 디자인 개요에서 영감을 받아, 이 페이지는 이 웹사이트뿐만 아니라 저가 진행하는 모든 프로젝트 뒤에 있는 디자인 철학을 문서화합니다.

Lagomor.ph는 표준 마크다운을 통해 Hugo로 컴파일된 정적 웹사이트로, 토론토의 클라우드 서버에 호스팅됩니다.

“사람들과 그들이 살아가는 현실에 대한 무관심은 실제로 디자인에서 유일하고도 가장 큰 죄입니다.”

디터 람스

이 웹사이트는 읽기 쉽고, 눈에 즐겁게 보이며, 탐색하기 쉽도록 설계되었습니다. 각 페이지에서 종종 유일한 이미지인 로고는 Rek Bell이 그렸습니다.

기본 원칙

1. 제공성은 명확해야 합니다

   도널드 노먼의 책 일상의 디자인은 디자인에서 제공성의 개념을 강조합니다. 제공성은 객체가 어떻게 사용될 수 있는지를 나타내는 객체의 속성을 말하며, 본질적으로 객체가 제시하는 행동의 가능성을 의미합니다. 좋은 디자인에서는 이러한 제공성이 명확해야 사용자가 한눈에 객체와 상호작용하는 방법을 이해할 수 있습니다.

   이 사이트의 맥락에서는 숨겨진 콘텐츠, 드롭다운 메뉴, 또는 “햄버거 버튼”이 없습니다. 하이퍼링크는 인라인으로 밑줄이 있고 명확하게 표시됩니다. 텍스트 대신 기호가 사용되는 경우, 아이콘이 무엇을 나타내는지 명확하며, 마우스를 올리면 텍스트로 설명되는 툴팁이 나타납니다.

2. 브루탈하게, 미니멀하게

   브루탈리즘은 건축 양식으로, 장식적 디자인보다 건축의 원재료와 구조적 요소를 드러내는 것을 특징으로 합니다. 웹 디자인에서 “브루탈리스트” 웹사이트는 가능한 한 많은 기본 웹 브라우저 기능을 활용하며, 필요한 경우에만 자바스크립트나 CSS를 보완하는 웹사이트입니다.

   미니멀리즘은 의도나 메시지를 전달하기 위해 가능한 한 적은 디자인을 사용하는 아이디어입니다. ¹

   이 웹사이트는 적당한 디자인을 사용하여 이 두 사상 사이의 미묘한 균형을 추구합니다. 적지만, 더 나은 것. 글은 종밀하게 작성되므로 가독성을 위해 세리프 글꼴을 선호합니다. 이미지는 내장된 브라우저 기능을 사용하며 자바스크립트가 필요하지 않습니다 - 자바스크립트는 선택적 기능에 사용됩니다 - 이 사이트의 텍스트를 자바스크립트 없이 읽을 수 있습니다. ²

3. 가능한 한 적은 계산을 사용하세요

   컴퓨터는 매우 강력하고 능력이 되었지만, 좋은 디자인은 가능한 한 적은 자원을 사용하려고 노력해야 합니다. 이 디자인 철학은 기능보다 사용의 속도와 효율성을 강조하지만, 이것이 새롭고 실험적인 브라우저 기능을 완전히 활용하지 않는다는 의미는 아닙니다. 이 웹페이지는 터미널 브라우저를 포함한 거의 모든 브라우저에서 열릴 수 있습니다. ³

4. 모든 것은 하나의 일만, 그리고 잘해야 합니다

   멀티태스커는 제 존재의 저주입니다. 스마트폰은 모든 것을 할 수 있지만 모든 것을 제대로 할 수는 없습니다. 모두가 사용할 수 있는 도구를 만들려고 시도할 때, 누구에게나 사용성을 희생하는 무언가를 만들게 됩니다.

   사람들은 종종 이것에 대해 저와 논쟁합니다. “주방 칼은 어때요? 주방 칼은 모든 것을 자를 수 있으며, 많은 상황에서 사용할 수 있으므로 멀티태스커입니다.” 아니요. 칼은 (해야 할) 하나의 일만 해야 합니다 - 자르는 것 - 그 이상은 아닙니다. 무엇을 자를지는 최종 사용자에게 달려 있지만, 그 목적은 명확하며 파스타를 끓이는 데 사용할 수 없습니다.

기타 원칙

• 클릭할 수 있는 모든 UI 요소는 하이퍼링크와 동일한 방식으로 스타일링되어야 합니다. ⁴
• 정보는 SEO를 희생하더라도 가능한 한 간결하게 전달되어야 합니다. ⁵
• 저자보다 정보.
• 당신이 만드는 모든 것은 해당 카테고리에서 가장 작은 기기에서 작동해야 합니다.
• 당연시되는 모든 것은 검토되어야 합니다.
• 당신이 만드는 기기에 실제로 시계 표시가 필요한지 강력하게 고려해야 합니다.

디자인 영감

• 도널드 노먼
• 마리에 콘도
• 디터 람스
• 마쓰시타 고노스케

각주