semantic 컬러 베리어블 정의 할때 왜 여기선 무조건 theme 컬러를 참조하는 이유가 무엇인가요?
semantic 컬러 베리어블 정의 할때 왜 여기선 무조건 theme 컬러를 참조하는 이유가 무엇인가요? primitive를 참조하지 않는 이유는 무엇인가요?
우선 강의를 들어주셔서 감사합니다. 강의 들으시면서 궁금하신 부분을 남겨주세요.
회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다.
이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요.
마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다.
인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.
답변 2
1
안녕하세요, Son Byung Ho님
말씀하신대로 만약 브랜드가 하나인 회사에서 다크모드, 라이트 모드를 구현하시고 싶으시다면, primitive와 semantic을 바로 연결하면 됩니다.
본 강의에서는 최대한 다양한 케이스를 보여드리고 싶어서 멀티 브랜드도 구현하고 시연하는 것을 보여드리기 위해서 중간에 theme을 넣어서 만들었습니다. theme에서는 브랜드 숫자 만큼 모드를 적용해서 다양하게 표현할 수 있고 라이트 다크모드도 따로 적용하지 않더라도 베리어블이 저절로 바뀌면서 구현됩니다.
섹션 9에서 4번째 세션인 "브랜드 구조와 모드 통합 브랜드 구현하기"를 한 번 맛보기로 살펴보시기 바랍니다.
언제든지 궁금한 질문 있으시면 남겨주세요.
질문 주셔서 감사합니다.
브랜드 구조와 모드를 활용한 통합 브랜드 구현하기
브랜드 구조와 모드를 활용한 통합 브랜드 구현하기
0
빠른 답변 감사합니다.
말씀 주신대로 현재 작업중인 회사 프로덕트는
브랜드가 하나인 회사에서 다크모드, 라이트 모드를 구현하는 형태입니다. 그렇다면 primitive와 semantic을 바로 연결하려고 하는데요.
primitive - theme - semantic 3단계로 정의한 내용 중 theme의 속성 정의(brand, information, Success, warning..)가 이런식인데..
기존 primitive의 color/blue/50, color/blue/100 구조를 지우고 위에 말씀드린 theme의 속성 정의를 primitive에 적용해야 하는건가요?
0
Byung Ho님 회사프로덕트를 예로 들자면, theme은 전혀 필요없습니다.
이런 경우는 theme은 제거하시고 primitive, semantic 두개만 생각하시면 됩니다.
primitive는 말 그대로 우리가 알고 있는 원색을 이름으로 넣으시면 됩니다.
예를 들어, color/blue/50, color/blue/100을 두시면 됩니다. 그래서 언급하신대로 지우시지 마시고 theme을 버리시면 됩니다.
Semantic에서는 역할을 부여하기 때문에 강의 처럼 text, bg, icon, border를 기준으로 그 다음에 속성 정의를 넣으시면 됩니다.
정답이라는 것은 없지만 이 것이 보편적으로 시작하는 기준이고 내부 디테일한 것은 프로덕트와 팀원들과 상의 하에 정하시면 됩니다.
궁금하신 점 있으시면 언제든지 질문 주세요!
0
안녕하세요, 인프런 AI 인턴입니다. Son Byung Ho님의 질문에 대해 도움이 될 만한 정보를 찾았습니다.
질문의 핵심:
- Semantic 컬러 베리어블 정의 시, 왜 theme 컬러를 참조하는지와 관련한 질문입니다.
- 추가적으로, Primitive 컬러를 참조하지 않는 이유에 대한 설명을 요구하고 있습니다.
관련 답변 링크 및 요약:
- “color variable 등록 시 naming 및 색깔 기준 문의…”에서는 color variable(색상 베리어블)을 등록하는 과정의 기준과 의미에 대해 설명하고 있습니다. 그러나 이 내용이 Semantic 컬러와 theme 컬러의 관계에 대한 구체적인 직접적 설명은 아니지만, 색상 베리어블의 개념과 네이밍 규칙, 세멘틱의 사용처에 대한 일반적인 이해를 돕는 내용을 포함하고 있습니다.
이 정보는 Semantic 컬러 베리어블을 정의할 때 theme 컬러를 참조하는 구체적인 이유와, Primitive 컬러를 직접 참조하지 않는 이유에 대해 직접적인 답변은 제공하지 않지만, 디자인 시스템 내에서 컬러 베리어블을 관리하는 일반적인 관행에 대해 이해하는 데 도움을 줄 수 있습니다.
직접적인 설명이 부족하므로, 이 주제에 대해 더 구체적인 정보와 설명을 원하실 경우, 강의 내 다른 자료를 참조하거나 추가적인 질문을 통해 구체적인 답변을 요청하시는 것이 좋습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
배리어블 Value에 관해 질문있습니다.
0
21
0
Body>font weight 에서 semibold에 짝대기가 생기는 이유?
0
26
1
Navigation Mobile 토글 베리어블이 안됩니당
1
25
2
Typography 모드 적용시 표현된 값과 우측에 표시되는 값다름
0
26
1
디자인 시스템에 그룹명을 숨길 수도 있나요?
0
39
2
디자인 시스템 네이밍에 관한 질문드립니다.
0
49
2
next step?
1
67
1
16강 Print Variables 출력 질문
0
79
2
open in Figma 누르고 ui kit 다운?받았을 때
0
62
2
variables 이름 지을때 소문자,대문자 사용에 관해..
0
89
2
디자인 시스템 네이밍 순서에 대해 질문남깁니다!
0
111
2
이미지 캐러셀 영상
0
64
2
아이콘 사이즈 컴포넌트 구성 방식 관련
0
98
3
완강/리뷰 이벤트 후 강의자료
0
58
2
Stack 컴포넌트 관련하여 궁금한 점이 있습니다.
0
53
1
컴포넌트별 베리어블 구축
0
76
2
인풋 텍스트필드에서는 왜 'interactive/bg' 배리어블을 활용하지 않는 것인가요?
0
35
1
섹션 6 / 29.Button 강의의 아이콘 인스턴스 스왑 질문
0
49
2
UI Kit에서 배리어블 등록 안되는 문제
0
57
2
교육용 피그마 계정 문의
0
57
2
베리어블 등록했는데 스타일에 연결하려니까 안보여요..
0
81
3
폰트 웨이트 지정에서, '바디만 따로 웨이트를 시멘틱에 그룹핑 하는 이유'가 무엇인가요??
0
47
2
섹션 6 / 29.Button 강의 질문
0
63
2
67강, 70강, 75강 자료 다운로드
0
50
1





