[10/22 부트캠프] ②팀 소개 사이트 만들기: 발표 대본 틀 작성, 5주차 강의

 

프로덕트 디자이너 부트캠프 D-2

📌To Do List

* 팀 과제: 팀 소개 사이트 만들기

* 5주차 강의

 

사전 캠프에서 미처 못들었던 5주차 강의. 들을 수 있을 만큼 들어야지.

---

01 5주차 강의

홈 화면 만들기

* 1배수 화면: 디자인 하기 위한 기준 사이즈.

- 아이폰: 375*812

- 안드로이드: 360*800

 

*히어로 섹션

- 메인 화면의 가장 상단 영역. 대체로 앱의 광고, 이벤트 자리로 많이 쓰이는 카드형식영역.

영웅처럼 가장 중요한 메시지를 전달한다고 해서 히어로 영역이라고 함. 신기한 네이밍이다.

 

 

앱 바 컴포넌트 참고:

머티리얼 디자인

우버 디자인 시스템

라인 디자인 시스템

 

*앱 바 컴포넌트

- 상단에 고정돼 현재 페이지명, 이전화면으로 돌아갈 수 있도록 함.

- 보조기능 제공 (장바구니, 알림 등이겠지?)

- 머터리얼 디자인: 앱 바 / ios: 네비게이션 바 --> 디자인시스템마다 부르는 이름이 다르다.

따라서 ui의 기능과 목적에 초점을 두어야한다.

 

2. 힌트 텍스트: 없어도 됨

 

---

[실습: 앱 바 만들기]

 

앱 바 하나 제작 후 베리언츠로 관리한다!

 

폰트 사이즈에따라 앱바 높이가 바뀔 수 있다. 오토레이아웃은 패딩값이기때문!

그럴땐 앱바 높이값을 fixed(오토레이아웃)로 설정하기!

여기서 Left and Rignt값으로 설정한다. 핸드폰/기종 별 가로 사이즈가 달라지기 때문에 좌,우,상의 비율이 유지되어야하기때문.

constraints = 크기와 위치를 프레임안에서 제어하는 기능!

기본적으로 피그마는 할 때마다 이걸 자동적으로 해야한다고 한다.

전에 작업할 땐 굳이 작업안했는데 앞으로 습관처럼 하나의 요소를 만들 때마다 적용시켜봐야겠다.

 

 

 

만드는중간에 물음표가 생겼다. Home으로 만들어진 배리언츠는 왜 없는걸까?2개의 배리언츠 컴포넌트를 만들었으면 2개 다 asset에 있어야하는게 아닌가....? 아직 이유는 모르지만 처음 property값에서 설정한 default값만 asset에 존재하는 듯하다.

 

 

그리고 하다보면 생기는 또 다른 문제점..!

 

컴포넌트의 경우
*multiple component: asset에 2개가 다 뜨고
*create component set: 처음 만들어진 컴포넌트만 존재한다. 왜... 둘은 다른것일까....?ㅋㅋㅋㅋ

대환장 파티였는데 피그마를 계속 이리저리 만지면서 값들을 비교해보다가 한가지 공통점이 생긴다는 것을 알아냈다.

 

create component set = variant 2개 만든것과 동일하다는 것이었다.

실제로 컴포넌트 - variant값 설정하고 하단 +버튼으로 variants를 추가하였더니 create component set으로 설정했을 때와 동일하다는 것! 이렇게 문제를 해결할 때마다 참 뿌듯한 마음이 드는 것 같다 :-)

---

 

목록화면 만들기

 

*리스트 컴포넌트: 동일한 형태의 정보 덩어리를 반복적인 패턴으로 보여줄 때 사용한다.

- 쇼핑앱 상품 목록, 배달앱 가게, 메뉴 목록 등

 

 

 

아 계속 난관봉착..ㅠㅠ

Frame 내에서 auto-layout 적용 시, frame명이 생기지 않지만 frame이 아닌 영역에 적용하면 생긴다.. 다양한 상황에서 이것저것 시도해본 결과 이거는 어쩔수없나보다. 좌측 레이어패널에서 수정해야지!

---

02 팀 소개 사이트 만들기

 

평소에 발표나 말을 잘 하지 못하는 편이라 연습삼아 발표를 맡게돼 팀원들을 소개할 대본을 작성했다.

제법 귀엽게 나온 우리 별빛친구들ㅎㅋㅋ

 

담당하는게 마지막 막표부분이라 최대한 뭘하면 좋을 지 생각하다가 팀원들의 와이어프레임과 디자인을 보며 수정할 부분이 있을 때 추가적으로 의견을 마구 냈다.

 

꽤 말이 많은 나...ㅋㅋㅋㅋ 팀원들이 피곤해하지않을까 걱정됐다...

그렇게 만들어진 스플래시 화면이다. 그림을 잘 그리시는 ㅅㅇ님이 귀엽게 잘 그려주셨다

QUIZ! 제 별 캐릭터는 과연 누구일까요~?

마지막 한발 남았다....

 

짠~! 목업을 만들어서 직접 보여주셨당 디자인은 대애애충 이런 이미지랍니다!!

 

그리고 아이콘으로 쓰일 행성 하나 더!

전체적으로 손그림 일러스트 컨셉을 잡고 디자인을 진행했다.

 

작업을 하는 도중 튜터님께서 들어오셨다.

말씀 중간에 1조라고 하셨지만(저흰 3조) 그냥 잘못말하신거겠지 하고 넘어갔는데

그러다가 갑자기 3조죠? 이러면서 1조 가셨어야 한다면서 ㅋㅋㅋ

멋쩍은 웃음을 지으시고.... 떠나가셨다.....

그리고 방문예정시간에 다시 방문하셔서 질문하라고 하셨다.

간단하게 질문하라고 하셨지만 그런거 몰라요. 제가 궁금한게 많아요 ㅠㅠㅠㅠㅠ

우다다다 질문하고 다른 팀원도 우다다다ㅏ 질문했다. 한 2-30분 있다가 가신 것 같다.

팀원들이 활발하다며,, ㅋㅋㅋ

팀원들과 질문한 내용을 적어봤다.

 

---

Q&A

Q. 비전공자인데 디자인을 잘 못하는 것 같아요. 프로덕트 디자인을 하려면 그래픽 디자인 스킬이 중요할까요?

- 디자인은 기본이다. 표현 가능한 스킬은 가지고 있어야하며 아이콘을 직접 그려야하는 회사도 적지 않게 존재한다. 하루에 하나씩 아이콘을 그려보는 것을 추천한다! 똑같은 기능의 아이콘이더라도 모양은 다 다르다. 그것을 연습해라.

(디자인은 무조건 직접 해봐야 느는 것 같다 ㅠㅠ)

 

Q. 포폴에서 디자인 스킬을 많이 볼까요? 메인에 Portfolio라고 써져있는건 별로인가요?

- 너무 꾸미지 말아라. 심플하고 깔끔해야하며, 진행했던 프로젝트가 더 돋보일 수 있어야한다. 나는 메인화면이 중요하다고 생각하지는 않지만 Portfolio를 쓰더라도 레이아웃을 어떻게 배치했느냐가 중요할 것 같다.

 

Q. 포트폴리오가 43장이면 어때요?

- 면접관들은 굉장히 바쁘다. 43장까지 그 스토리를 잘 이끌어갈 자신이 있다면 해도 좋다. 하지만 한 프로젝트당 5-10장만 만드는 것을 권장한다.

 

Q. 면접 전, 회사를 알아보고 분석해서 어떤 솔루션이 있는게 좋겠다~ 식의 생각을 하는 건 어때요?

- 긍정/부정의 측면이 존재한다.

긍정: 회사에 관심이 많아보이고 그것에 대해 고민했다는 것.

부정: 심도있게 사용하고 고민했다면 긍정적이게되겠지만... 왜 문제인지 근거있고 명확한 솔루션을 만들어야한다. (이 때 명확하게 라는 말을 강조하셨던 것 같다. 확실하게 조사를 해야할 것 같다.)

 

Q. 프로덕트 디자이너 VS UX/UI디자이너 차이점?

- 명확하게 이거다! 라고 말할 수 없다. 회사마다 필요한 역할이 다르기 때문이다. 프로덕트 디자이너는 매출을 끌어와야 하는 역할을 한다. 그렇기에 UX와는 방향성이 다를 수 있다. 사용자에게 필요한 서비스만 한다면 그것은 좋은 서비스가 아니다. 매출로 가져와야하기때문! (어.. 이부분에서 되게 띠용했던 것 같다. 회사는 이익을 추구하는 집단이기에 매출을 우선시해야하는 게 맞으니 사용자에게 너무 좋은 서비스 보다는 조율을 해야겠다는 생각이 들었다. 그런 점에서 프로덕트 디자이너가 더 매력적으로 느껴졌다. 내가 그런걸 너무 몰라서 빨리!!!!!!!!!!!!!!!!!!!!!!!!!!!! 알고싶다 ㅠㅠㅠㅠ 언제 배우나 그 과정!!! ㅠㅠㅠ)

 

Q. 처음 시작을 프로덕트 디자이너로 시작하셨나요?

- 아니다. 웹디자이너로 시작했다가 프로덕트 디자이너가 됐다. (이 말이 희망적인 말로 다가왔다.)

 

Q. 팀장인데 잘 하고 있는지 잘 모르겠어요..

- 팀장이라서 다 짊어지는것보다 팀원의 강점에 맞춰 역할분담을 해야한다. 그래서 팀원들의 수준을 파악해야하고, 팀원이 잘할수있는 겻에 따라 일을 배분할 줄 알아야한다. 실수를 하더라도 개선하면 되는 것이며 문제가 생겼을 때 어떤 방향으로 개선하면 좋을지 논의를 하는 게 좋다.

 

Q. 웹디자인 2년차이고, UX/UI직무로 가면 어찌됐든 신입인데 연봉인상할 수 있나요?

- 1년차여도 2-3년차의 몫이면 얼마든 가능하다고 생각한다. 학벌, 경력 그런거 다~ 필요없다. 오로지 실력으로 검증해야한다. (엄청 부담스러운 부분이 있으면서도 가능하지않을까..?하는 희망도 동시에 들었다. 실력으로 비비는 디자이너가 되자)

 

Q. 공백기가 길면 어떨까요?

- 최대 6개월을 넘기지 않을 것을 추천한다. (여기서 나 포함 한명의 팀원이 '헉'했다 ㅋㅋㅋ)

그것보다 더 길다면 그것을 커버할 수 있는 것은 실력이다. 포트폴리오를 잘 만들어아햔다.

 

Q. UX/UI 디자인 포트폴리오에 콘텐츠 디자인 작업물을 담아도 될까요?

- 관련된 JD 직무를 꼼꼼하게 잘 찾아보길 바란다. 그것을 토대로 포트폴리오를 만들어야한다. 콘텐츠 디자인은 면접 시 말씀드리면 좋게 생각할거다.

---

이밖에도 질문들이 몇 가지 더 있었는데 미처 적지 못했다. ㅠㅠㅠ

적은 걸 쭈루룩 보니까 생각보다 질문을 아주...많이 했다.ㅋㅋㅋ

튜터님도 시간이 후딱 지나갔다고 하심.

 

현실적으로 조언해주셔서 너무 감사했고..

이러면 안되지만 팀 프로젝트를 좀 더 빡세게 하고싶다는 마음이....들었다...

하지만... 팀원들이 힘들어할 것 같은데....ㅋㅋㅋㅋ ㅠㅠㅠ

 

나는 사실 9-9이라고 하지만 별로 힘들지가 않다.

9시가 지나도 더 하고싶다. 시간이 되면 오늘 수고하셨어요~하지만 뭔가를 더 하고싶은ㅋㅋㅋ

그래서 이렇게 늦은 시간이 돼도 TIL을 놓지 못하는 나...

뒤늦게 쓰니까 기억을 더듬어야 한다. 중간중간에 쓰는 습관을 잘 들여야겠다.

 

9시. 모두가 퇴근한 시각.

팀원들과 얘기를 더 나눴다. 그러다가 서로의 포폴 구경도 하면서 놀다가

그렇게 나와 나머지 한 팀원분이 남아서 11시까지 2시간동안 더 얘기했다...ㅋㅋㅋ 집념의 사나이들...(여자임)

내가 했던 고민을 똑같이 하고계셨고 내가 겪은 일을 팀원분도 겪었다며 공감해주셨다.

나도 빡세게 자기계발 했다고 생각했는데 이사람은 더 심했다 ㅋㅋㅋㅋㅋㅋㅋ

 

앞으로 내가 할 역할과 목표는 다른 사람을 도와주는 것이라고 생각한다.

오늘도 한 발 나아갔다.