저는 런던에서 Sr.프로덕트 디자이너로 일하는 볼드입니다.
제 경력은 리서처로 시작하여 프로덕트 디자이너로 커리어 전환 후 핀테크, 클라우드 테크, 마케팅 등 다양한 분야에서 경험을 쌓고 있습니다. 국내 석사 출신으로 해외교육 없이 런던에서 바로 취업하여 다양한 실무 경험을 하고 있으며, 실무에서 아래의 내용을 진행해왔습니다.
사용자 리서치 시스템 구축, 관리
디자인 시스템 구축, 관리,
피그마 UI/프로토타이핑
디자인 역량 코칭, 멘토링
인프런을 통해 제가 알고 있는 실무 노하우를 공유하고 이를 통해 저도 많이 배우고 싶습니다.
감사합니다.
경험 및 경력
(현) 런던 데이터 솔루션 회사, Sr. 프로덕트 디자이너
(전) 런던 글로벌 리서치 회사, Sr. 프로덕트 디자이너
(전) 런던 핀테크 회사, Sr. 프로덕트 디자이너
(전) 런던 클라우드 컴퓨팅 회사, UX/UI 디자이너
연세대 인지공학랩 리서처 출신
안녕하세요. 저는 런던에서 프로덕트 디자이너 겸 리서처로 일하고 있는 볼드라고합니다. 연세대 석사 출신으로 런던에서 에이전시, 스타트업, 대기업 등과 함께 일한 실무 경험이 있습니다. UX, UI, 프로덕트, 리서치 등 실무에서 통하는 팁, 노하우를 공유해 드립니다.
멘티분들의 성장을 돕는 맞춤형 멘토링을 추구합니다.
멘토링 분야
- 신입, 주니어, 미드 이력서 & 포폴 첨삭
- 커리어 상담
- UX/UI/프로덕트 학습 방법 및 로드맵 설계
- UX/UI프로덕트 디자이너 성장 방법
- UX/UI 실무 기초, UX 리서치 실무, 실무 디자인 시스템
- 해외(영국) 디자이너 취업 전략 및 해외 생활
+ 멘토링 신청하신 분을 대상으로 디자인 역량 분석이 필요하신 분께 무료로 역량 분석을 도와드리고 있습니다.
사전준비물
사전에 받고 싶은 자세한 상담내용
멘티분께서 공개 가능한 상세 정보
이력서 또는 포트폴리오 첨삭의 경우 첨삭할 자료를 미리 보내주세요.
진행방식
- Google Meet을 활용한 온라인 1:1 화상회의 방식
- 웹캠, 마이크, 이어폰은 필수로 미리 지참해주시기 바랍니다.
- 예약이 되면 기재하신 연락처로 필요한 내용들을 제공드릴 예정입니다.
강의
수강평
- [UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
- [UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
- [인프런 X 볼드UX] 디자이너 성장 가이드와 피그마 활용 꿀팁 모음
- [UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
- [UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
게시글
질문&답변
알림/경고 메세지 만들기 강의에서의 질문
강의에서는 72로 나오는데, 다 만들고 나면 80으로 나옵니다. 반드시 강의와 만드시는 파일이 똑같을 필요는 없습니다. 특히 Hug로 쌓여져 있어서 값에 따라 달라질 수 있습니다.우선 제 강의에서는 앱솔루트 포지션은 사용하지 않았습니다. 그 이유는 만약 사용하면 Title Description의 컨텐츠가 오버랩 되어서 불편해지기 때문입니다. 저의 경우는 텍스트 라인하이트가 괜찮아서 구지 값을 넣지 않았는데, 만약 타이틀 위에 값이 필요하다고 생각하면 살짝 윗 패딩값만 주면 됩니다.아마 그것이 개발할 때도 개발자가 스타일링 하기에도 쉬울 것 같습니다. 감사합니다.
- 0
- 2
- 19
질문&답변
셀렉트-파트1 강의에서의 질문
제 생각에는 Icon 프레임 안에 있는 아이콘의 Constrint을 scale로 바꾸어주시면 될 것 같습니다. 근데 제가 파일을 살펴본 결과 잘 하신 것 같습니다."-"이것을 세번 치시면 됩니다. "---"
- 0
- 1
- 16
질문&답변
폰트 사이즈에 홀수 (13pt, 11pt, 21pt)는 잘 안쓰나요?
홀수로 사용하셔도 됩니다. 저는 주로 머티리얼 디자인 시스템을 기본 베이스로 사용하는데, 여기에서는 짝수로 사용해서 계속해서 강의에서도 사용하고 있습니다. 아시다시피 애플의 경우는 홀수도 사용합니다.
- 0
- 2
- 30
질문&답변
문의드립니다.
세번째 단락에 대한 답변을 드리면, 저의 경우에는 컬러의 경우 베리어블만 필요해서 스타일은 지웠습니다.타이포그래피의 경우에는 스타일을 바로 UI에 적용하기 때문에 스타일을 무조건 살려두었습니다. 스타일 안에 베리어블이 다 들어가 있습니다. 다른 디자인 시스템 찾아보시면, 저의 경우처럼 되어 있는 경우도 있고 아닌 경우도 있습니다. 예를 들어, 머티리얼 디자인 시스템 같은 경우는 색상 스타일이 살아있는데, 이 경우 스타일안에 두개 이상의 베리어블이 사용되기 때문입니다. 첫 섹션에 나왔듯이 스타일은 여러개 베리어블을 담을 수 있지만 베리어블 그 자체는 한가지 색상과 투명도만 다는 다고 제가 언급드렸습니다. 이게 익숙하지 않은 개념일 수도 있지만, 혹시 더 궁금하신 부분 있으며 질문 주세요!감사합니다.
- 0
- 1
- 33
질문&답변
문의드립니다.
안녕하세요! Cloe 님 질문을 정리하자면, 크게 두가지로 보입니다. 디자인 값 변경 시 전체가 바뀌는 문제디자인 값 변경 시 개발팀 공유 방법 둘 모두 정답은 없지만 저의 경험을 근거로 말씀 드리면, 첫번째 경우는 두가지 경우가 있고, 이 경우는 현재 다루시는 프로덕트마다 다를 수 있습니다. 1-1. 전체 변경:• 만약 전체적인 스타일 가이드가 바뀌어야 한다면, 디자인 시스템에서 line-height 값을 1.2로 조정하는 것이 맞겠죠. 그리고 기존 컴포넌트나 페이지에 미치는 영향을 충분히 고려해야 하며, 변경 사항을 전체 디자인 팀도 알아야 하고, 개발팀과 협의해야 합니다. 개발의 경우는 웹일 경우 스타일만 변경하면 되기 때문에 괜찮습니다. 1-2. 해당 작업물에서만 로컬로 적용:• 특정 페이지나 컴포넌트에서만 line-height를 1.2로 조정해야 한다면, 로컬 스타일로 개별적으로 설정하는 것이 더 맞습니다. 다만, 이런 방식이 반복적으로 발생한다면, 디자인 시스템의 line-height 값이 프로젝트 전체에 적합한지 재검토해야 합니다. 계속 로컬로 만들어지면 디자인 시스템의 필요성이 없어지기 때문입니다. 두번째 경우는 베리어블을 활용하면 primitive(기본 값)에서 semantic(의미적 값)으로 확장성을 유지할 수 있지만, line-height처럼 디자인과 개발이 밀접하게 연관된 값은 변경 시 추가 커뮤니케이션이 필요합니다.말씀하신대로, heading-4xl의 line-height가 56이었다가 50으로 바뀌면, 개발팀이 기존에 56으로 적용된 부분을 변경해야 하기 때문에 매번 공유하는 것이 맞습니다. • 하지만 디자인 시스템에서 일괄적으로 관리된다면, 개발팀이 특정 토큰을 참조하도록 유도하면 변경 사항을 최소한의 커뮤니케이션으로도 적용할 수 있습니다. 보통 토큰 스튜디오 플러그인을 사용하는데, 이 경우 수정된 것을 json 파일로 내보내면 개발자는 바로 그걸 쓰면되서 사실 개발자 분이 따로 연결을 할 필요가 없습니다. 도움이 되셨으면 좋겠습니다. 실무적인 내용이라 정답은 없지만 도움이 되셨으면 좋겠습니다.
- 0
- 1
- 20
질문&답변
완강 이벤트
안녕하세요, 힛미님.제 엑셀시트에는 힛미님 설문조사 정보가 아예 없습니다.혹시 저에게 이메일로 보내주시면 따로 보내드리겠습니다. 우선 완강은 이미 하신걸로 내부 시스템에서 확인했으며, 수강평도 남겨주셔서 이메일보내주시면 회신으로 링크 보내드리도록 하겠습니다. 제 이메일 주소는 boldplus.ux@gmail.com 입니다. 아니면, 설문조사를 새로 작성해 주셔도 됩니다. 제가 다음주 월요일(3월 3일) 이벤트 참여자분들 일괄 보내드릴 예정입니다. 감사합니다.볼드 드림.
- 0
- 2
- 27
질문&답변
타이포그래피 scope관련 문의드립니다.
타이포 그래피는 숫자(Number)와 문자(String) 두개 베리어블을 등록할 수 있으며, 각각 적용 가능한 곳이 다릅니다. 강의에서 자세히 언급되었듯이문자(String) Scope 내에서는 Font family는 글꼴 종류(폰트 패밀리), Font weight: 폰트 두께Number Scope 내에는기타 여러 속성들이 보일 것입니다. 그리고 두개 다 들어가는 것 중에는 Font weight, Text content가 있습니다. Font weight는 강의에서도 언급했듯이 500, Medium을 동일하게 보기 때문에 숫자, 문자 다 가능합니다. Text content는 모든 보이는 문자열에 적용할 수 있으며, 버튼 라벨, 인풋 라벨 등 모든 적용가능한 컨텐츠에 가능합니다. 일반 텍스트에 바로 입력해도 인스턴스, 컴포넌트의 텍스트 프로퍼티에 적용하셔도 됩니다. 원칙적으로 Text content는 타이포그래피가 아니라 컨텐츠입니다. 그래서 숫자 스코프에서는 타이포그래피 밖에 있는데, 문자 스코프에는 다른 타이포그래피 속성과 같이 있어 착각을 불러 일으킵니다. 질문하신 답변에 도움이 되었으면 좋겠습니다.
- 0
- 1
- 21
질문&답변
타이포그래피 토큰 개발팀에서 적용 시 문제 관련해서 질문드립니다!
안녕하세요, MATH POST님,우선, 제 강의에서는 Token Studio를 다루지 않기 때문에 자세한 답변을 드리기 어려운 점 양해 부탁드립니다. 다만, 보내주신 이미지를 확인한 결과, 피그마와 Token Studio가 잘 적용된 것으로 보입니다. 제 경험상, Token Studio에서는 “Typography”를 생성한 후 이 안에다가 Primitive를 모아두는 방식을 추천드립니다. 그래야지 fontStyle을 제대로 내보낼 수 있습니다.(이렇게 하셨으리라 생각합니다.) 한편, 개발자분들이 “안된다고 한다”는 피드백은 범위가 넓어 정확한 원인을 파악하기 어려운 점이 있습니다. Style Dictionary 공식문서와 플러터용 커스텀 스타일 딕셔너리를 참고해보시는 것을 추천드립니다.https://styledictionary.com/https://github.com/aloisdeniel/style-dictionary-figma-flutter 감사합니다! 😊
- 0
- 2
- 57
질문&답변
라이브러리 publish 에러 관련
안녕하세요, aquamiro님 먼저, 피그마 라이브러리 파일로 인해 불편을 끼쳐 드려 죄송합니다.문제의 원인을 파악한 것 같습니다. 현재 제 강의와 파일에서는 "Pretendard"라는 글꼴을 사용하고 있습니다. 이 폰트는 피그마 기본 폰트가 아니므로, 수강생 분의 컴퓨터에 반드시 설치되어 있어야 합니다. 아래 링크에서 다운로드하실 수 있습니다.https://cactus.tistory.com/306 또한, 웹에서 피그마를 사용하고 계시다면, OS에 맞는 Font Installer를 설치해두시는 것도 추천드립니다.https://www.figma.com/downloads/ 계속해서 문제가 발생한다면, 스크린샷과 함께 상세한 문제 상황을 알려주시면 감사하겠습니다. 이 내용도 파일 다운로드 안내 사항에 추가해 두겠습니다. 감사합니다.
- 0
- 2
- 63
질문&답변
텍스트 베리어블 오류 문제
질문과 답변을 모두 자세히 적어주셔서 감사합니다. 보내주신 이미지처럼 밑줄이 그어진 경우, 이는 로컬 베리어블에 저장된 텍스트 값을 찾을 수 없을 때 발생하는 오류로 보시면 됩니다. 제가 최근 경험한 사례 중에는, 보내주신 사례 처럼 베리어블 이름이 다를 경우도 있었으며, 다른 문제도 있었습니다. 예를 들어 Primitive에서 Sans에 Roboto를 사용했을 때는 문제가 없었습니다. Roboto는 일반적으로 모든 두께를 지원하기 때문입니다. 하지만 모드에서 다른 폰트로 변경했을 때, 해당 폰트가 특정 두께만 지원하면 지원되지 않는 두께가 밑줄이 그어지는 오류로 나타날 수 있습니다. 이처럼 지원되지 않는 폰트 속성이 있을 경우 밑줄이 표시되니 참고 부탁드립니다. 감사합니다! 😊
- 0
- 3
- 74