반 장난으로 시작한 프로덕트에도 시행착오가 존재했던, 월급 루팡 생성기 for UX/UI 디자이너

안녕하세요. UX/UI 디자이너 김세정입니다.

최근에 ”월급 루팡 생성기 for UX/UI 디자이너“ 라는 프로덕트를 업로드했는데, 많은 분들께서 프로덕트에 예상치 못하게 많은 관심을 주신 덕분에 메일로 권도언 님께 메이커로그 작성을 제안받았습니다.

현직 메이커들의 고퀄리티 콘텐츠가 넘쳐나는 디스콰이엇에 어떤 주제로 첫 글을 써볼까 생각하다가, 반 장난으로 만들었지만 그럼에도 불구하고 있었던 시행착오를 중심으로 첫 메이커로그를 작성해 보았습니다.

공개한 지 사흘 만에 실시간 트렌딩 프로덕트 1위...!

반 장난으로 만들었는데 생각보다 많이 받은 관심에 당황했지만

많은 관심 가져주셔서 감사합니다🥹

시작은 박준혁 님의 월급 루팡 생성기로부터

때는 어느 날, 디스콰이엇을 기웃거리고 있었습니다.

그러다 트렌딩 프로덕트에 올라온 박준혁 님의 월급 루팡 생성기를 발견했어요.

프로덕트를 구경하면서 제일 먼저 들었던 생각은,

아니 하루에 최소 8시간은 넘게 볼 업무 툴로도 웃길 수가 있넼ㅋㅋㅋ

문득, 이런 생각이 들더라고요.

이걸 UX/UI 디자이너 버전으로 만들었을 때도 빵 터지는 디자이너들이 있을까?

얼마 지나지 않아, 월급 루팡 생성기의 메이커이신 박준혁 님께 메일을 보냈습니다.

감사하게도 리메이크를 흔쾌히 허락해 주셔서, 디자이너 버전의 월급 루팡 생성기를 만들었습니다.

한동안 즐거울 일 없었던 일상에 빵 터지는 프로덕트 만들어 주셔서 다시 한 번 감사합니다🙏

그렇게 ”피그마로 일하는 척 좋아하는 소설 보기“로 시작된 월급 루팡 생성기는

반 장난으로 시작했던 것도 잠시... 생각보다 넘어야 할 장애물이 많다는 사실을 곧 깨닫게 됩니다.

시행착오의 결과로, 어쩌다 영문 프로덕트가 되었다

월급 루팡 생성기를 피그마에서 열어보면 (살면서 해외에, 그것도 여행으로 딱 한번밖에 나가본 적 없는) 한국인이 만들었음에도 불구하고 전부 영문으로 되어 있는데요, 딱히 글로벌을 노리진 않았지만 어쩌다 보니 그렇게 되었습니다.

시행착오 1. 저작권법을 피해 샘플로 쓸 소설을 찾아 헤메는 중

네, 방심했다 헤메는 중 맞습니다.

처음에 영문 어린왕자의 챕터 2를 샘플로 사용한 건 크게 두 가지 이유가 있었습니다. 첫 번째는 박준혁 님의 월급 루팡 생성기의 오마주이고, 두 번째는 국문 콘텐츠 혹은 번역판을 무단으로 사용했을 때 저작권법 위반이 두려워서... 였는데, 관련 내용을 좀 더 찾아보니 샘플로 사용헀던 어린왕자의 미국 번역판의 저작권은 2039년에 만료된다고 합니다. 퍼블릭 도메인 소설의 내용으로 샘플을 바꿔서 곧 업데이트 해야겠네요. (만일의 상황에 대비해서 피그마 커뮤니티에서 잠깐 동안 내릴 수도...😵)

어린왕자 영문 위키피디아의 어린왕자 저작권 관련 정보

무료라고 방심하지 말고 출처는 믿을 만한지, 라이센스도 꼭 꼼꼼하게 살펴봅시다.

시행착오 2. 영문 프로덕트에 Noto Sans 쓸 뻔했던 사연

샘플 소설인 어린왕자가 영미판이었기 때문에 영문 폰트가 필요했습니다. 문득, 영미권에서도 UI 디자인을 할 때 Noto Sans를 사용할까? 라는 궁금증이 들더라고요.

국문 프로덕트라면 망설임 없이 Noto Sans KR이나 프리텐다드를 사용했겠지만, 그냥 지나치기엔 마음에 걸렸습니다. 실제로 피그마 커뮤니티에 올라가면 전 세계에 노출되니까요.

약간의 구글 검색만으로, 영미권에서는 UI 디자인을 할 때 기본 폰트로 Noto Sans를 사용하지 않는다는 결론에 쉽게 도달할 수 있었습니다.

“Best font for UI Design" 등의 검색어로 다시 검색해봤습니다. 검색 결과를 살펴보던 중 ”Inter“ 폰트가 관련 콘텐츠에 언급되고 있었어요. 무엇보다 Inter가 피그마의 기본 폰트라서 어떤 환경에서 파일을 열어도 폰트가 깨질 일이 없을 것 같아 Inter를 사용하기로 결정했습니다.

시행착오 3. 프로덕트를 대표하는 썸네일 이미지를 첨부해주세요.

디스콰이엇의 프로덕트 공유하기 페이지에는 썸네일 이미지를 첨부하는 인풋(Input)이 있습니다.

썸네일 이미지 첨부. 필수.

어...

여러분들이라면 여기에 어떤 이미지를 넣으시겠어요?

저는 머릿속에 딱 하나밖에 생각나지 않더라고요. 로고요...

정확히는 프로덕트를 나타낼 수 있는 로고, 스크린샷, 프로덕트 이름, 대표님의 증명사진, 마스코트 등등... 수많은 썸네일 이미지 후보 중에서 프로덕트를 가장 잘 표현할 수 있는 수단으로 로고를 선택했다는 의미입니다.

결국 저는 디스콰이엇에 프로덕트를 공개해 보겠다고 팔자에도 없는 로고를 만들기 시작했습니다.

그래픽 디자인이 UX/UI 디자인에 속할 수“도” 있지만 그래픽 디자인은 아니라고 외쳐봅니다...

눈치 보는 Quiet Quitter

월급 루팡 생성기 for UX/UI 디자이너의 로고는 월급루팡에 대응되는 영어 표현인 “Quiet Quitter”와 상사의 눈치를 보느라 눈을 굴리는 두 눈동자의 조합으로 만들어졌어요. 자발적이거나 혹은 비자발적으로(!) 월급루팡을 하고 있다고 생각할 때 느끼는 감정을 두꺼운 윤곽선으로 위트하게 표현해보고자 했습니다.

로고 스케치 중 일부

반 장난으로 시작했어도 배울 점은 있었다. 시행착오가 있어서.

이렇게 글로 적어보고 나니 반 장난으로 시작했던 "월급 루팡 생성기 for UX/UI 디자이너"를 만들면서 시행착오를 겪었고, 어떤 실수를 했으며 그 과정에서 어떤 점을 배웠는지 정리하는 기회가 된 것 같습니다.

영문 프로덕트 디자인할 때 쓸 폰트 종류도 Poppins 외에 최소 4개 이상은 알게 되었고 (그렇지만 헬베티카 폰트 패키지는 꼭 사야겠다), 해외 리소스의 저작권 확인하는 방법이라든지... 언젠가 배운 점을 써먹을 일이 또 있겠죠?

월급루팡 생성기 for UX/UI 디자이너에 대한 이야기는 다른 주제로도 언젠가 풀어보겠습니다.

제 짧은 경험이 커뮤니티의 다른 누군가에게 도움이 될 수 있기를 바라며, 이만 글을 마칩니다.