저희는 프로덕트 디자이너의 성장을 돕는 볼드유엑스랩 메인 튜터인 볼드, 제 경력은 리서처로 시작하여 프로덕트 디자이너로 커리어 전환 후 핀테크, 클라우드 테크, 마케팅 등 다양한 분야에서 경험을 쌓고 있습니다. 국내 석사 출신으로 해외교육 없이 해외에서 취업하여 다양한 실무 경험을 하고 있으며, 실무에서 아래의 내용을 진행해왔습니다.
사용자 리서치 시스템 구축, 관리
디자인 시스템 구축, 관리,
피그마 UI/프로토타이핑
디자인 역량 코칭, 멘토링
인프런을 통해 제가 알고 있는 실무 노하우를 공유하고 이를 통해 저도 많이 배우고 싶습니다.
감사합니다.
경험 및 경력
(현) 데이터 솔루션 회사 · 시니어 프로덕트 디자이너
(전) 글로벌 리서치, 핀테크, 클라우드 컴퓨팅 등 다양한 분야에서 프로덕트 디자이너로 활동
연세대 인지공학랩 리서처
講義
受講レビュー
- [UI3アップデート] Figma変数を利用したデザインシステムを構築する
- 基礎から実務まできちんと学ぶFigma UIデザインクラス
- [Inflearn X BoldUX] デザイナー成長ガイドとFigma活用のコツまとめ
- [Inflearn X BoldUX] デザイナー成長ガイドとFigma活用のコツまとめ
- [UI3アップデート] Figma変数を利用したデザインシステムを構築する
投稿
Q&A
7강 도형+펜툴 중 막혔습니다ㅠㅠㅠ
인프런 인턴이 도움이 되었나보네요. 문제가 빠르게 해결되어 다행입니다!
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 28
Q&A
안녕하세요! 작업 속도를 높여주는 단축키와 플러그인 강의는 없는걸까요?!
안녕하세요, 아래에서 인프런 인턴이 잘 설명해 주셨는데, 추가로 말씀드리면 제가 처음에는 이 내용을 한 번에 다 넣었는데 시작 부분이 너무 부담스러워서, 강의 섹션 1에 해당하는 10개 챕터 전반에 나누어 배치했습니다. 강의를 들으시면서 각 부분마다 필요한 단축키와 플러그인을 확인하실 수 있습니다.혼동이 있으실 거 같아서 노션 커리큘럼 파트는 업데이트 해놓았습니다. 질문 주셔서 정말 감사합니다.
- いいね数
- 0
- コメント数
- 3
- 閲覧数
- 26
Q&A
안녕하세요! 작업 속도를 높여주는 단축키와 플러그인 강의는 없는걸까요?!
안녕하세요, 아래에서 인프런 인턴이 잘 설명해 주셨는데, 추가로 말씀드리면 제가 처음에는 이 내용을 한 번에 다 넣었는데 시작 부분이 너무 부담스러워서, 강의 섹션 1에 해당하는 10개 챕터 전반에 나누어 배치했습니다. 강의를 들으시면서 각 부분마다 필요한 단축키와 플러그인을 확인하실 수 있습니다.혼동이 있으실 거 같아서 노션 커리큘럼 파트는 업데이트 해놓았습니다. 질문 주셔서 정말 감사합니다.
- いいね数
- 0
- コメント数
- 3
- 閲覧数
- 26
Q&A
선생님 섹션 2의 색상 설명 자료는
안녕하세요, 전체 피피티 파일은 제공 드리지 않고 있습니다. 이메일로 필요하신 부분 보내주시면 도움 드리도록 하겠습니다. 또한 완강 하시면 요약본을 드리긴 한데 미리 필요하시면 알려주세요! boldplus.ux@gmail.com
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 36
Q&A
반응형 웹 디자인
안녕하세요, Semin Hur님,모바일 First?저는 현재 회사에서 프로덕트가 두 개인데, 그 중 하나는 모바일 사용자가 90% 이상이라 모바일을 먼저 작업한 후 데스크탑으로 확장합니다. 디자인 복잡도도 높지 않아 모바일 퍼스트가 자연스러운 선택이었습니다.일반적으로 모바일 퍼스트를 권장하지만, Semin Hur님도 아래 두 가지 기준으로 시작점을 결정해 보시길 추천드립니다.사용자 비율 — 어떤 디바이스 사용자가 더 많은가?디자인 복잡도 — 레이아웃이 얼마나 복잡한가?예를 들어, 대시보드가 포함된 SaaS 프로덕트에서 사용자의 99%가 데스크탑 유저라면 굳이 모바일부터 시작할 필요가 없습니다. 모바일은 후순위에 두거나, 개발 리소스 상황에 따라 아예 제외하는 판단도 충분히 합리적입니다. 피그마 베리어블 모드, 어디까지 활용 방안베리어블 모드로 모든 반응형 스펙을 통제하는 것은 현실적으로 쉽지 않습니다. 개인적으로는 이렇게 접근하시길 권장드립니다.타이포그래피 → 베리어블 모드 적극 활용 (일관성 확보에 효과적)간격→ 큰 단위부터 먼저 잡고, 세부 간격은 별도로 관리모든 반응형 스펙을 베리어블 패널 안에 넣으려 하면, 오히려 디자인의 창의적 자유도가 제약될 수 있습니다. 반응형 디자인의 목적은 모드를 바꿔서 반응형을 자동으로 완성하는 것이 아니라, 기기 마다 얼마나 유연하게 바뀌는지가 중요하기 때문입니다. 그래서 이를 위한 그만큼의 스펙이 미리 정의되어 있어야 합니다. 그래서 저는 강의에서 제안하는 큰 구조를 먼저 잡고, 디테일은 유연하게 가져가시는 것을 추천드립니다. 볼드 드림.
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 58
Q&A
액션 아이콘 컴포넌트 질문
안녕하세요, 좋은 질문 주셔서 감사합니다.사실 말씀해주신 선택은 팀원간의 합의하에 또는, 프로덕트의 복잡도, 작업자의 성향에 따라 다를 수 있을 것 같습니다. 저는 개인적으로 게시판 마다 따로 만드는 편이고, 선택된 경우도 베리언츠로 따로 분리해놓습니다. 이렇게 하면 구분하기도 편하기 때문입니다. 정리하자면, 저라면 3게시판이 있으면 각 게시판 마다 만들고, 선택된 것은 베리언츠(Boolean 형태)로 선택된 것/안된 것 따로 만들어서 말씀하신 아이콘이 바뀌는 것을 방지 하도록 할 것 같습니다.감사합니다. 볼드 드릠.
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 47
Q&A
셀렉트(Select & Dropdown menu) - 파트 1 / selected 토글 버튼
타이포가 문제가 있어서 그런 것 같습니다. 불린에 해당하는 True, False라고 하시면됩니다. Ture -> True또는 true, false 이렇게 소문자로 하셔도 되고, on, off 또는 ON, OFF 이렇게 하셔도 무방합니다. 시도해보시고, 안되시면 알려주세요. 감사합니다.
- いいね数
- 0
- コメント数
- 3
- 閲覧数
- 49
Q&A
스피너 아이콘 크기 질문
혹시 파일을 공유 해주실 수 있을까요?제 생각에는 아이콘 비율이 줄어들면서 생기는 문제인 것 같습니다. 16px * 16/24를 하면 10.66666이 나오기 때문입니다. 혹시 스피너 아이콘 레이어를 선택한 뒤 오른쪽 패널에서 W/H 옆 자물쇠 아이콘을16 × 16으로 직접 입력해서 고정하거나, 컴포넌트 내부에서 Constraints를 Fixed로 설정해보실 수 있을까요? 그렇게하면 비율대로 바뀌는 것이 아니라 고정될 것 같습니다. 파일은 boldplus.ux@gmail.com으로 보내주시면 확인하고 더 자세히 답변드리도록 하겠습니다.
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 51
Q&A
미리보기 빈칸생기는 현상
안녕하세요, 한별님 질문 주셔서 감사합니다.질문 주신 부분은 미리보기(Preview)할 경우 보통 랜더링이 깔끔하게 되지 않아서 생기는 문제입니다. 우선 배포할 경우는 크게 문제가 없고, 프로토타입 상태(Present)에서는 깔끔하게 보일 것이기 때문에 크게 걱정하지 않으셔도 될 것 같습니다. 조금 짚짚하시면 선 굵기에 1정도 주거나 오토레이아웃의 간격을 -1로 할 수는 있는데, 이 경우 핸드오프시 착오가 있을 것 같아서 추천드리지는 않습니다.감사합니다.볼드 드림.
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 41
Q&A
아이콘 빌런 부분
강의 촬영 시에는 문제가 많았는데, 이제 잘 되나 보네요. 다행입니다.많은 이유가 있겠지만, 제 강의에서 사용되는 아이콘의 주요 목적을 말씀드리자면, 라인의 경우 크기가 커져도 선 굵기가 함께 따라오지 않는 반면, 면으로 처리하면 크기가 함께 따라옵니다.이뿐만 아니라 용량과 Path를 줄여 최적화하는 데 도움이 되나, 사실 체감상 크게 차이가 나지는 않습니다.따라서 강의에서처럼 Union, Flatten으로 처리하는 편입니다. Flatten의 경우에는 강의에서 언급했듯이 SVG 코드 내 문제도 있기 때문이기도 하고요.만약 회사에서 두 가지 색이 사용되거나 한 가지 크기로만 사용되는 경우에는 강의에서 제안하는 방식이 맞지 않을 수 있습니다. 따라서 회사에서 구성원들과 상의하여 아이콘 작업을 하시는 것을 추천드립니다.
- いいね数
- 0
- コメント数
- 2
- 閲覧数
- 47





![Thumbnail image of the [UI3アップデート] Figma変数を利用したデザインシステムを構築する](https://cdn.inflearn.com/public/courses/332289/cover/5b65a944-ebb3-44a7-96b2-60ca5b0cd0ea/332289-eng.png?w=148)
![Thumbnail image of the [Inflearn X BoldUX] デザイナー成長ガイドとFigma活用のコツまとめ](https://cdn.inflearn.com/public/courses/332808/cover/93dc551a-e14e-46e2-befe-9a0d0927f520/332808.png?w=148)