다시 또 블.꾸
파편화된 기록 모으기
0. 왜 만들었는가.
어릴 적부터 무언가를 만들고 그 과정을 기록하는 사람들의 이야기가 좋았다. 어쩌면 이미 완결되어 흠 비집을 곳 없이 매끈한 제품보다 더 흥미진진한 고군분투와 몰입의 흔적들. 책을 읽으면 작가 후기가, 게임을 플레이하면 제작진 소개가 있어야 했고 종종 작업 기록이 올라오는 열린 공간을 발견하면 그렇게 기쁠 수가 없었다. 웹 속 블로그처럼.
그림의 세계를 알려준 햇조 아티스트의 블로그, 배움의 의미를 재고하게 만든 김보영 작가의 블로그, 프론트엔드의 근사함을 깨닫게 해준 조쉬 엔지니어의 블로그, 기록들, 기억들.
좋아하면 따라하고 싶어진다. 나도 미디엄이든, 네이버든, 티스토리든, 이곳저곳에 공간을 만들어 보았지만 여기도 저기도 마음에 들지 않는 바람에 기록은 온통 파편화되고 말았다. 애초에 내가 좋아하는 사람들은 대개 기록을 공유하는 곳을 스스로 꾸몄고, 나 역시 정형화된 규격에는 들이기 힘든 것을 간직 가능한 장소를 원했다. 주로 몇 년 전 사놓고 ‘언젠가는 꼭 써야지’ 결심만 붙여놓은 도구들 혹은 어설피 만들어낸 삼차원 모형들, 완결된 제품으로 만들기에는 파편적이고 버려두기에는 애정어린 나의 잡동사니들을.
1. 이전 버전.
v1 - 프론트엔드를 처음 공부하던 시절 만들었던 포트폴리오 사이트. 당시에는 신나게 만들고 threejs journey 커뮤니티에도 올려서 모르는 분께 샤라웃을 받기도 했는데 지금 보니 이게 뭔가 싶다.
v2 - 호주에서 워킹 홀리데이로 머무는 동안 만들었던 포트폴리오 겸 블로그 사이트. 개발보다도 디자인 때문에 골머리를 앓았던 기억이 난다. 결과물은 마음에 들었지만 처음 생각했던 블로그 기능을 추가하기에는 또 네비게이션 UX/UI를 고민하느라 시간을 소모할 것 같아 더 진척시킬 동기를 잃어버렸다. 정적 콘텐츠가 대부분일 블로그 만들기에 Next를 선택했음이 마음에 들지 않기도 했고.
2. v3는 이렇게 만들었습니다.
v2 개발 과정에서 교훈을 얻어, 불필요한 Hydration 과정 없이 정적 콘텐츠를 빌드 가능하면서도 필요한 곳에는 JS나 기타 라이브러리를 자유롭게 사용 가능한 Astro로 만들어 보기로 했다. 더해서 커스터마이제이션이 용이하면서도 디자인에 (그러니까 나의 전문은 아닌 분야에) 필요 이상의 시간이 들지 않도록 템플릿을 먼저 찾았다.
템플릿을 고를 때의 기준은 정보 가시성과 합리적 구조였는데, 어떤 디자인이어야 3D 모델을 로드해도 어색하지 않으면서 글이 잘 읽힐지 고민하다 (보통 three.js나 shader를 이용한 사이트는 정보를 효과적으로 전달하기보다 인상적인 시각 경험을 주는 데에 집중하므로) Tim Quirino 라는 디자이너의 포트폴리오를 보고 힌트를 얻었다. (실은 Voxel Character 레퍼런스를 찾다 우연히 알게 된 분인데 이력만큼이나 말끔히 정돈된 레이아웃이 대단했다.)
즐겁게 참고 가능한 곳이 생긴 후에는 결정이 쉬워서 Astro에서 제공하는 무료 템플릿 중 ryze를 택하고 직접 만든 Voxel Character에 이따금 react-bits의 효과를 쓰면서 블로그 대문을 제작했다. 이곳이라면 장기적으로 꾸려나가기 쉬울 듯하다.
3. 파비콘 이미지.
사진 찍기를 좋아해도 재능은 없는데 제주 관광지에서 산 키링의 반짝임을 포착했던 때만큼은 스스로가 자랑스럽다. 이 사진, 별 의미도 없고 아름답기만 해서 꾸준히 써먹고 있다.
