변경 기능 관련 강의 업데이트

안녕하세요, 심심이님! 😊현재 강의는 1, 2월에 촬영된 최신 UI3가 반영된 강의입니다.혹시 이번 Config에서 변경된 오토레이아웃 그리드에 대해 문의하신 것이라면, 현재로서는 해당 부분에 대한 강의 업데이트 예정은 없습니다. 변경된 부분이 매우 작은 부분이라 전체 강의를 재촬영해야 하는데, 전체 내용이 바뀐 것이 아니라서 현실적으로 어려움이 있습니다.대신 오토레이아웃의 새로운 업데이트에 대해 제가 직접 사용해보고, 변경된 점과 활용 방법에 대한 추가 강의 영상을 조만간 준비해드리도록 하겠습니다! 기다려주시면 감사하겠습니다. ✨궁금하신 점이 있으시면 언제든지 문의해주세요!감사합니다.볼드 드림.

섹션5 아이콘 색상 변경 질문입니다.

작성자 분이 안계셔서 답변을 안드렸는데, 인프런 인턴이 자세하게 설명해주어서 그것을 따라하시면 됩니다. 궁금하신 부분 있으면 언제든지 질문 주세요!

다크모드의 색상은 반드시 primitive에 정의된 색으로만 진행해야하나요?

darkmoon90님 안녕하세요, 정말 좋은 질문 주셔서 감사합니다. 디자인에서 반드시라는 것은 없는 것 같습니다.규칙은 있지만 만약 말씀하신대로 완성도가 떨어진다면, 당연히 바꿔야 겠죠. 개발자분들과 상의하에 임의에 컬러를 바로 가져오셔도 괜찮습니다. 대신 도큐먼트와 왜 그렇게 했는지 기술을 해놓으면 됩니다. 그래야지 다른 작업자가 와서도 왜 그렇게 했는지 의도를 알 수 있기 때문입니다. 만약 다크모드 전용 색상이 따로 있고, 동일한 컬러색상 군에 완전히 다른 색이라고 한다면 개인적으로 따로 primitive에도 담아두면 관리하기 좋을 것 같습니다.예를 들어, pink_light, pink_dark 이렇게 해서 50~900 두시고 primary_text 라이트모드에서는 pink_light 쪽을 다크모드에서는 pink_dark를 선택하는 방법이 될 것 같습니다. 그리고 반드시 primitive의 컬러 스케일도 숫자형태로 하실 필요는 없으시고 darker, lighter 이런식으로 그레이딩을 하셔도 됩니다. 더 궁금하신 부분 있으면 말씀해주세요. 감사합니다!

병합된 셀 표현은 어떻게 표현하는게 좋을까요?

안녕하세요, darkmoon90님우선 정말 좋은 질문 주셔서 감사합니다.강의에서 제공된 테이블 컴포넌트의 경우는 컬럼별로 짜져 있어서 이 경우에는 만약 수평으로 병합된 셀을 표현하고 싶으시면 이 컬럼 컴포넌트를 활용하는 것은 다소 어려울 것 같습니다. 이 경우에는 셀을 컴포넌트 기본 컴포넌트 베이스로 해서 복합 컴포넌트로 만드시지 마시고 그냥 레이어 상태에서 만드는 것이 나중에 수정하실 때 편하실 것 같습니다. 가끔은 모든 것을 컴포넌트로 만들다보면 수정할 때 머리가 아프기 때문에 가장 기본이 되는 것만 컴포넌트로 만드시고 복잡도가 올라가는 경우(기본 테이블이 아닌)에는 레이어로 두시는 것도 나쁘지 않을 것 같습니다. 이 부분에 대해서 관련자료나 팁을 발견하게 되면 여기에 나중에 공유해 드리겠습니다.감사합니다. 볼드 드림.

라벨이나 chip에 열 개 정도 컬러가 들어갈 때

안녕하세요, Wony님 우선 제가 어떤 현재 일하시는 서비스에 대해 구체적으로 몰라서 감히 조언드리기는 어려울 것 같지만, 우선은 한 곳에다가 다 모아둘 것 같습니다. 하지만 갯수가 늘어난다면 찾기가 굉장히 어렵겠죠. 이 경우는 MECE 방법대로 잘게 의미론적으로 잘라볼 수 있을 것 같습니다. 예를 들어,🛒 이커머스에서의 MECE 기반 칩 컬러 분류이커머스 플랫폼에서는 제품의 다양한 속성을 칩 형태로 표시하는 경우가 많습니다. 이러한 칩들을 MECE 원칙에 따라 분류할 수 있습니다. (MECE는 구글에 더 검색해서 찾아보실 수 있습니다. )1. 제품 카테고리별 분류• 예: 의류, 전자제품, 가구 등• 각 카테고리에 고유한 칩 컬러를 지정하여 시각적으로 구분합니다.2. 가격대별 분류• 예: 저가형, 중가형, 고가형3. 브랜드별 분류• 예: 브랜드 A, 브랜드 B, 브랜드 C 이러한 분류는 상호 배타적이며(중복되지 않음), 전체 포괄적(모든 제품을 포함)인 MECE 원칙을 따릅니다. 그래서 베리언츠 프로퍼티에 색 자체로 구분해서 한 곳에 모아두는 방법도 있을 것 위의 예시 처럼 색의 활용방안에 따라 분리해볼 수도 있을 것 같습니다. 한 번 몇가지를 만들어보고 팀원들과 상의하에 결정하시면 좋을 것 같습니다. 도움이 되셨으면 감사합니다.

Design Kits관련 질문.

안녕하세요, 강의에서도 언급했는데 디자인 킷대로 가셔도 됩니다.여러 프로덕트와 상황에 따라 달라질 수 있는데, 우선 단일 프로덕트와 적은 팀원이 일한다면 디자인킷으로 한 파일 안에 스타일 파운데이션과 컴포넌트를 같이 넣어두고 관리하는게 관리 측면에서 더 편할 수 있습니다. 감사합니다.

아이콘

잘하셨습니다. 원래 Union을 하면 그 아래에 Union을 한 모든 레이어가 있습니다. 이 경우는 아래 레이어(원본)을 움직여서 수정할 수 있는 장점이 있습니다.만약 이것을 없애버리고 싶으시면 Flatten Selection(Option + Shift + F)하시면 됩니다.

피그마 라이브러리 연결 문의건

안녕하세요,답변이 늦어져서 죄송합니다. 컴포넌트가 연결되지 않아 많이 당황하셨을 것 같습니다.저도 강의를 제작하면서 계정을 옮기는 과정에서 비슷한 경험을 한 적이 있어서, 그 불편함에 충분히 공감합니다. 현재 상황은 컴포넌트의 라이브러리 연결이 완전히 끊어진 상태이기 때문에, 말씀하신 스왑(Swap) 기능도 작동하지 않는 것으로 보입니다. 또한 말씀해주신 환경을 최대한 시뮬레이션해서 테스트를 진행해보았지만, 현재로서는 라이브러리 연결을 복원하거나 자동으로 연결해주는 직접적인 방법은 없는 것으로 확인되었습니다. 제가 알고 있는 범위 내에서는,• 이름이 동일한 컴포넌트를 자동으로 라이브러리와 연결해주는 플러그인도 현재까지는 존재하지 않습니다.• 다만, 라이브러리에서 끊긴 인스턴스를 추적할 수 있는 플러그인은 일부 존재하지만, 이 역시 수동 연결을 대체할 수는 없습니다. 결론적으로는, 연결이 끊긴 인스턴스들을 하나하나 직접 찾아서 다시 연결해주는 수밖에 없는 상황입니다.매우 번거롭고 반복적인 작업이긴 하지만, 현재로서는 가장 현실적인 방법입니다. 연결이 끊긴 인스턴스를 찾는 플러그인은Design LintFind missing component이 두 개 중 아무거나 사용하시며 됩니다. 감사합니다. 볼드 드림.

피그마 라이브러리 연결 문의건

안녕하세요,답변이 늦어져서 죄송합니다. 컴포넌트가 연결되지 않아 많이 당황하셨을 것 같습니다.저도 강의를 제작하면서 계정을 옮기는 과정에서 비슷한 경험을 한 적이 있어서, 그 불편함에 충분히 공감합니다. 현재 상황은 컴포넌트의 라이브러리 연결이 완전히 끊어진 상태이기 때문에, 말씀하신 스왑(Swap) 기능도 작동하지 않는 것으로 보입니다. 또한 말씀해주신 환경을 최대한 시뮬레이션해서 테스트를 진행해보았지만, 현재로서는 라이브러리 연결을 복원하거나 자동으로 연결해주는 직접적인 방법은 없는 것으로 확인되었습니다. 제가 알고 있는 범위 내에서는,• 이름이 동일한 컴포넌트를 자동으로 라이브러리와 연결해주는 플러그인도 현재까지는 존재하지 않습니다.• 다만, 라이브러리에서 끊긴 인스턴스를 추적할 수 있는 플러그인은 일부 존재하지만, 이 역시 수동 연결을 대체할 수는 없습니다. 결론적으로는, 연결이 끊긴 인스턴스들을 하나하나 직접 찾아서 다시 연결해주는 수밖에 없는 상황입니다.매우 번거롭고 반복적인 작업이긴 하지만, 현재로서는 가장 현실적인 방법입니다. 연결이 끊긴 인스턴스를 찾는 플러그인은Design LintFind missing component이 두 개 중 아무거나 사용하시며 됩니다. 감사합니다. 볼드 드림.

플러그인 lock aspect ratio

안녕하세요, 나냥파수타님. 플러그인이 없어졌습니다. 제가 2월에 촬영을 했는데, 그 이후에 피그마 자체 기능이 나오면서 아예 플러그인을 없애버린 것 같습니다. 피그마의 자체 기능을 사용하셔도 동일한 기능을 하니 그것을 사용하셔도 됩니다. 이 부분에 대해서는 강의를 업데이트하거나 공지로 안내해드리도록 하겠습니다. 제가 한대로 별대로 레이어를 생성하지 않으시고 바로 프레임에다가 이미지를 넣으시면 더 간편하게 만드실 수 있습니다. 대신 Lock aspect ratio하시기 전에 3:4를 하시고 싶으시면 300:400으로 만든 후 설정하시면 됩니다. 질문 있으시면 언제나 답변주세요. 감사합니다.