묻고 답해요
158만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
아이콘 사이즈 변경
안녕하세요! 강의 잘 들으며 실습해보고 있습니다.버튼을 컴포넌트 세트로 만드는 연습을 하고 있는데요.사이즈별 버튼 생성시, 기존 24*24 사이즈의 아이콘에서 버튼의 사이즈에 맞게 아이콘 사이즈도 키워지면 좋을 것 같은데, 아이콘 프로퍼티 변경시 24*24 사이즈로 복귀됩니다. 아이콘 파운데이션을 크기별로 생성하는 것 말고 혹시 어떤 방법을 사용할 수 있는지 여쭙습니다.혹 제가 해당 개념을 강의 중 놓쳤거나 했다면 알려주시면 감사하겠습니다!
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
컬러 베리어블에서 semantic 관련
컬러 베리어블에서 semantic 관련semantic - text 정의 interactive를 따로 구분한 이유는 무엇인가요? 예를들어 웹 사이트의 GNB 텍스트 메뉴(버튼)의 primary, hover, pressed를 설정하기 위함 인가요?그럼 버튼 컴포넌트의 텍스트는 모두 컬러 설정 할때 semantic - text 정의 interactive로 정의 하면 되나요?아래 볼드님 피그마 파일로 스터디 중인데요. 위에 언급햇듯이 GNB의 텍스트 메뉴(버튼) 기본이 블랙컬러, 호버하면 블루 컬러로 변경되는 형태일 경우 컬러 베리어블 정의된 값을 어떻게 적용해야 하나요? 아래 첨부파일 이미지 보면 text>primary는 블랙, text>interactive>primary는 블루로 정의하셨는데...이런 부분은 뭔가 부딪치는 느낌입니다..text>interactive>primary가 필요한가요? interactive에서는 호버, 프레스, 디세이블, 셀렉티드 같은 상태값(states)만 정의 되야 하는거 아닐까 싶은데..의견 부탁드립니다. ? 회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다. 이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요. 마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다. 인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.
-
해결됨구글 애드센스 수익형 워드프레스 블로그 만들기
SSL설정하는 부분이 안보입니다.
Security 부분에 SSL 설정하는 부분이 안보이는데 바뀐건가요? 설정한적에 없는데 설정이 되어있기는 합니다.
-
미해결피그마(Figma)를 활용한 UI디자인 입문부터 실전까지 A to Z
Auto layout 글자가 늘어나도 버튼이 같이 안 늘어나요
이게 될 때도 있고 다른 데에서 해보면 또 안돼서 감을 못 잡겠습니다
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
semantic 컬러 베리어블 정의 할때 왜 여기선 무조건 theme 컬러를 참조하는 이유가 무엇인가요?
semantic 컬러 베리어블 정의 할때 왜 여기선 무조건 theme 컬러를 참조하는 이유가 무엇인가요? primitive를 참조하지 않는 이유는 무엇인가요? 우선 강의를 들어주셔서 감사합니다. 강의 들으시면서 궁금하신 부분을 남겨주세요. 회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다. 이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요. 마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다. 인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.
-
미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
접근성의 원리의 잘 적용된 사례/아닌 사례
좋은 강의 감사합니다.디자인 원리 중, 접근성의 원리를 잡아 사례를 조사했습니다.잘 적용된 사례 - ZetaZeta는 ai를 활용하여 캐릭터를 생성하거나 생성된 ai 캐릭터와 채팅으로 대화할 수 있는 어플입니다.각 캐릭터들의 설명과 썸네일이 카드형 UI구조로 일관성 있게 구성되어 보기 편합니다. 항목 별로 모아두고, 항목마다 여백이 충분히 있어 구분감이 있습니다.잘 적용되지 않은 사례 - ZAPPY위의 zeta의 서비스와 유사한 ai 캐릭터와 채팅하는 ZAPPY입니다. 우선 채팅을 생성하는 버튼(FAB버튼)이 상단 위, 그것도 맨 오른쪽에 있고 크기도 작아 눈에 띄지 않습니다. 사용자가 이 어플을 사용하는 이유인 'ai캐릭터 생성' 이니 만큼 크기를 키우고, 오른쪽 하단 혹은 중앙에 배치해야 한다고 생각합니다. 또한 채팅 리스트의 컴포넌트 크기가 작아 서로 붙어있는 것처럼 보입니다. 이것을 보고 카카오톡이 떠올랐습니다. 카카오톡 채팅 리스트처럼 너비 여백을 크게 주면, 각 채팅에 구분감이 생겨 혼란을 주지 않을 것 같다는 생각을 하게 되었습니다.
-
미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
좋은 UX와 안좋은 UX 사례
좋은 강의 감사드립니다.- 좋은 UX의 사례: MockupWorld를 꼽았습니다.Mockup World는 유/무료 목업 자료를 제공하는 사이트입니다.전체적인 디자인이 일관되게 통일되어있어 보는데 편했습니다. 대응의 원리를 잘 적용하여 사용자가 자주 사용하는 search bar를 상단 네비게이션과 같이 두는 것이 아니라 따로 하단에 크게 배치하여 사이트에 들어가자마자 사용자가 바로 검색할 수 있게 유도했다 생각합니다.search bar 하단에는 카테고리 분류를 칩 버튼으로 두어 무료 목업이 필요한 의도가 높은 사용자들이 검색 없이도 원하는 아이템을 찾을 수 있게 해두었습니다. (바로 아래에 광고가 있는 것이 아쉽지만) 이는 의도가 낮은 사용자라 할지라도 둘러볼 가능성을 높일 것이라 생각 됩니다.- 나쁜 UX의 사례: 미리캔버스를 꼽았습니다.미리캔버스는 미리 캔버스는 저작권 없이 디자인 분야를 잘 모르는 사람들도 다양한 템플릿을 제작할 수 있는 사이트입니다. 1. 카테고리를 썸네일을 사용해 공간 차지를 많이 하다 보니 어떤 템플릿이 있는지 한 눈에 보기 힘듭니다. 위의 Mockup world처럼 이미지 없이 칩 버튼을 사용해 사용자가 원하는 템플릿을 한번에 찾을 수 있게 도와주면 좋을 것 같다는 생각을 하게 되었습니다.2. 템플릿 사이즈에 일관성이 없습니다. 이미지도 화려해 눈이 피로하다 느꼈습니다. 템플릿에 대한 타이틀과 어떤 템플릿인지의 대한 설명도 없어 사용자는 직접 눌러보며 알아봐야 합니다. 카드형 UI로 만들어 템플릿에 대한 기본정보를 넣으면 어떨까 하는 생각이 들었습니다.3. 화면에서는 안 나와있지만 '이번 주 인기 카드 뉴스', '이번 주 인기 포스터' 가 하단에 있습니다. 주 단위로 바뀌고, 사용자가 자주 찾는 인기 있는 목록이라면 추천 목록처럼 상단에 있어야 더 적합하다고 생각합니다.강의를 듣기 전에는 막연하게 잘 사용하면 그게 좋은 UX가 아닌가? 라는 생각을 했지만, 강의를 들은 후 UX 디자인의 원리를 통해 어떤 것이 더 사용자에게 사랑 받는 디자인인지 과제를 통해 감을 잡을 수 있었습니다. 좋은 강의 감사드리며 남은 강의도 열심히 수강 하겠습니다. 감사합니다.
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
Part/MenuItems 컴포넌트 세트 만들때 badge 문제
다양한 형태의 사이드 네비게이션(Side Navigation) - 파트2Part/MenuItems 컴포넌트 세트 만들때 badge값을 하나만 변경해도 Full, Icon only, Icon & label 모두 변경됩니다. Full만 Number로 왜 안될까요??? 그리고 강의 너무 감사합니다. 한국어로 된 디자인 시스템 강의도 잘 없지만, 반복해서 연습해볼 수 있게 강의를 구성해주셔서 쉽게 잘 따라갈 수 있어요. 케이스별 실무 팁도 자연스럽게 배울 수 있고요. 수강생들에겐 참 알찬 강의인데, 강의 제작하시는 과정이 쉽지 않으셨을 것 같고.. 여러모로 정말 많이 배웁니다, 볼드님 :)
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
기술적 준수사항 중 탭키 이동 건
별도로 지정하지않은 상호작용이 필요한 모든 콘텐츠는 임시링크를 적용하고 탭키로 이동 선택할수 있어야 한다라는 기술적 준수사항에, 푸터의 패밀리사이트 항목들도 해당되나요?
-
미해결피그마(Figma)를 활용한 UI디자인 입문부터 실전까지 A to Z
핸드오프 링크와 그냥 공유 링크와 차이점을 모르겠어요
Share공유를 눌러서 개발자에게 보낸다고 했는데 그 전에 있던 강의 중에서 공유하는 방법이 똑같은데 그냥 핸드오브링크는 그냥 공유하는 방법과 똑같다고 보면 될까요?
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
Value 값을 대문자로 꼭해야하나요?
Value 값을 대문자로 꼭 표시하지 않아도 괜찮을까요? 개발자와 네이밍에 관련해 카멜표기를 하자고 했었는데 컴포넌트 또한 카멜표기로 해야하는지 궁금합니다
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
수험자 제공 텍스트 , 끊어도 되나요?
혹시 수험자 제공텍스트를 끊어써도 될까요?제공된 수업영상에는 줄바꿈으로만 하셨는데한 슬라이드에 제공되는 한 줄의 텍스트를 타입툴 여러개로 끊어써서 이동시켜도 되나하구요.한 단어만 회전시키거나 다른 글씨체로 해도 되는지 궁금합니다!
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
피그마 UI 에 대해 여쭙니다.
강의를 열심히 듣고 있습니다.근데 한가지 해결이 안되는 문제가 있어서 질문드립니다.이번에 피그마가 UI3 로 업그레이드를 했다고 하는데, 저는 일단 강사님 버전에 맞게 거기에 맞춰서 하고자 하는데, 테스트로 여러개를 만들어봤는데, 어떤건 UI3 로 화면이 새롭게 바뀌어서 나오고 어떤건 이전 UI 로 나오더라구요,근데 UI3로 나와도 피그마 안에 들어가서 오른쪽 하단에 ?이이콘을 클릭하면 Go back to previous UI를 클릭하면 원래버전으로 돌아간다고 주변에서 알려줬는데, 그 메뉴가 아예 없어서 UI3 이전 인터페이스를 사용하려면 어지 해야 하는건지 해서요 ㅜㅜUI3는 아직 베타버전이라고 하니 아직은 이전 화면으로 사용하고 싶은데, 방법이 있을까요?
-
미해결피그마(Figma)를 활용한 UI디자인 입문부터 실전까지 A to Z
섹션 12는 따로 파일이 없나요?
섹션12에 나오는 강의는 따로 수업 노트에 예제 파일이 안보여서 그러는데 공유가 안 되는 자료인가요?
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
D유형 최종본제작 - D1 갤러리 이미지
D유형 최종본제작 - D1갤러리 이미지 3개 사용하라고 나와있는데 저렇게 많이 나열하는게 맞나요? 그리고 완성본 화면줄이면 이미지 전부 갤러리 탭보더 밖으로 나와서 배열되는데.. css제대로 된게 맞을까요
-
해결됨[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기
색상베리어블 등록하기
색상베리어블 등록하기에서 질문드립니다.플로그인을 사용해서 색상을 등록하는 내용에서 ...아래와 같이 강사님의 화면과 다르게 나와서요이 플러그인을 오른쪽처럼 화면이 뜨는데....강의화면에서는 실행하면 색상들이 뜨던데...혹시 제가 중간과정을 빼놓은걸까요?
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
header_logo 질문#2
E유형 로고 작성하는 부분에 "심벌과 로고명이 포함된 완전한 형태로 디자인한다." 라고 되어있는데 심벌은 따로 이미지가 주어지는지 혹은 심벌로 따로 만들어야 하는지, 만약에 footer_logo 부분에도 심벌을 포함해서 만들어야 하는지 궁금합니다.
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
제이쿼리로 슬라이드 작성 시, .css({left : 0}) 이게 왜 들어가는지 이해가 되지 않습니다.
.css({left : 0 })를 주석 처리해도 정상적으로 동작하는데굳이 넣으신 이유를 알 수 있나요?아니면 저 부분을 빼면 이상이 생긴다는 것을 보려면 코드를 어떻게 작성하면 좋을까요?
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
header_logo 부분 질문
header_logo 부분에 "로고의 크기 변경 시, 가로세로 비율(종횡비, aspect ratio)을 유지하여야 한다." 부분이 있습니다. 그냥 포토샵 할 때는 200 x 40 비율로해서 그대로 작성하는지 궁금합니다.
-
미해결피그마(Figma)를 활용한 UI디자인 입문부터 실전까지 A to Z
플러그인 제거 방법이 궁금합니다
선생님 플러그인을 잘못 다운 받았는데 제거하는 법 좀 물어봐도 될까요?