공구마켓 - 로고제작, favicon(파비콘) 제작 (02.07 - 02.11)

백엔드쪽 기술문제로 프로젝트로 개발이 지연되고 있다.. 또륵

...

...

...

그래서 놓고 있던 공구마켓 로고를 열심히 제작해보았다.

 

 

2022. 02. 07 (월) - 로고확정

열심히 종이에 끄적끄적..거렸던 작업물을 일러스트와 피그마를 이용해 제작하였다.

뭔가.. 정해진 이름이 없어서 힘들었다.

'공구 + 마을 리 = 공구리'라고 할까 약간 고민했지만 내가 혼자 정할 수도 없는 거기에..

'공구마켓'으로 심플하게 제작했다.

어려운 slack

두 가지의 시안을 제작했다. (사실 더 많지만 가장 괜찮은 두 가지 추려서)

1안

펜툴로 찍어서 만들은 타이포 위주의 로고이다.

공구의 의미를 넣기 위해 '공동구매 > 구매 > 카트'가 연상되어 '공구'를 카트모양으로 만들었다.

그리고 잘 보이지 않는 것 같아 색상을 그레이, 손잡이 레드를 넣어 더 알아보기 쉽게 해주었다.

그리고 '공동구매 = 구매자가 늘어날수록 가격이 줄어든다' 의미를 더해 '공구'의 아래 내려가는 화살표 모양을 더해주었다.

2안

위와 비슷한 내용이지만, 공구마켓 커뮤니티 웹 서비스에 맞게 말풍선을 넣어주었다.

'공구' 옆에 마켓을 1안에서 가져와 쓰려했지만 둥글둥글한 말풍선과 1안의 딱딱한 타이포는 어울리지 않았다..

그래서 cookierun 서체를 이용해 영어로 적어서 넣어주었다.

---

---

회원가입, 로그인페이지 모두 input, button 등 border-radius를 넣어 둥글둥글한 디자인을 해놓아서 1안과는 이질감이 느껴졌다.

파비콘을 생각했을 때도 아이콘이 더 뚜렷한 2안이 나을 것 같다고 생각되었다.

 

팀원분들이 1안을 고를까 두려웠지만 ㅎ

다행히 모두 2안을 골라주셔서 최종리고로 확정되었다! 하하

그리고 피그마에도 수정된 시안으로 적용하였다.

---

2022. 02. 11 (금) - favicon(파비콘) 제작

 

 

프론티엔드 개발자님께서 파비콘을 요청하셨었다.

로고가 확정되지 않았던 때여서 잠시 미뤄뒀었는데 이제 제작할 수 있다.!

 

어떻게 보내드려야 하나 인터넷을 조사했다.

구글링을 해보니 투명배경인 로고 16x16 png파일을 변환기에 업로드하여 ico파일로 변경하면 되는 간단한 작업이었다.

개발자도 아닌 내가 처음 들어보는 ico파일로 만들어 드려도 되는 건가 싶어 여쭤보았더니

브라우저는 ico파일만 파비콘으로 인식한다며 ico파일로 요청하셨다.

(이렇게 하나 배운다)

그리고 링크를 하나 보내주셨다!

영어로 된.. 긴 글이었다 ㅎ

열심히 한 번 해석해서 읽었지만 이해가 안 가는 부분이 많아서..(또륵)

파파고친구를 이용하여 해석하여 따로 글로 정리하였다!

▼▼▼정리한 글 ▼▼▼

favicon(파비콘) 만들기 전 주의사항

favicon(파비콘) 만들기 전 주의사항

파비콘 ico 변환방법에 알려주는 글을 보내신 줄 알았는데 파비콘 디자인, 규칙에 관한 글 위주였다.

이렇게 또 .. 성장한다 룰루

 

 

그리고 최종! 로고를 16x16 png로 추출하여

https://www.favicon-generator.org/

위의 링크에서 변환하였고! 개발자님께 보낼 수 있었다.

 

그리고 나의 티스토리 블로그 파비콘도 넣어주었다!

블로그 꾸밀 때 'ico가 뭐야..', '파비콘이 뭐여,,' 하면서 넘어갔었는데 이렇게 응용하게 되다니!

오히려 좋아