안녕하세요 강의를 수료하고 취업 준비중인 학생입니다!피그마에서 포트폴리오 형식으로 파일을 만들었습니다.사진 및 gif 파일이 같이 있습니다.노트폴리오나 비헨스에 올려서 공유하려면 프레임을 PNG로 다운 받고 업로드시에 GIF 파일은 png로 인식되는 것 같습니다.. 피그마 프로토타입 재생 버튼을 누르고 그 URL을 쉐어해서 포트폴리오를 공유하나요?사진 위에 GIF를 같이 배치하고 싶은데... 궁금합니다!

예제 샘플 파일 링크는 어디서 볼수 있는건가요? ㅠㅡㅜ

 개발자와 어떻게 협업하는지 궁금합니다.

제 피그마에는 Constraints에 Fixed position when scrolling 체크박스 자체가 없는데 어떻게 하면 스크롤 시에 버튼과 상단 바를 고정시키게 만들 수 있을까요?

안녕하세요.모바일 웹 퍼블리싱 수업을 차근차근 잘 듣고 있습니다.강의 중간중간 설명해주시는 부분이 많은 도움이 되고 있습니다. ^^오늘 프리로딩 퍼블리싱 파트를 들었는데요,배경 이미지가 피그마에서 완성한 디자인과 배율이 달라보이는데 이 부분을 효과적으로 조절하려면 css background 에서 어떻게 조절하면 좋은지 궁금합니다.

-.stop().slideDown과 같이 슬라이드 다운 앞에 스탑을 쓰는 이유가 뭘까요? 강의에서는 큐?를 없애기 위해서라고 들렸는데 이해를 못하겠어요 ㅠ 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

안녕하세요. 강의 잘 들었습니다 :)저는 홈페이지 디자인을 위주로 하고 있는데포토샵, 일러스트, xd를 주로 사용하다가피그마가 대세인거 같아서 강의를 들었는데요! xd에서는 이미지 삽입 후 포토샵으로 연동되는 기능이 있어보정하면 자동으로 xd에서 반영이 되는데피그마에는 그런기능이 없는거죠? 그럴경우.. 피그마에서는 어떻게 디테일한 사진보정을하나요? 사이즈 확인 후 포토샵에서 작업 후 다시이미지 삽입을 해야되는건가요?답변부탁드립니다 감사합니다!

컴포넌트 등록 영상이 섹션 제일 마지막에 와야 하는 것 같습니다.

배경: 국가에서 운영하는 HRD-Net 사이트 (직업기술을 배울 수 있는 목록 및 정보를 제공하는 곳 - 접속 URL: https://www.hrd.go.kr/hrdp/ti/ptiao/PTIAO0300L.do?pageId=2&bgrlInstYn=undefined&kDgtlYn=undefined&_csrf=b7996afd-d091-4265-9b99-c9720b70652d ) 를 낮은 의도를 가진 사용자의 입장에서 탐색하여 보았습니다. (예를 들면 OO분야에서 흥미가 있을만한 직업 훈련이 어떤 것이 있을까?로 접근해봤습니다.) 지역 및 대분류만 설정해 검색해보았는데요. 전체적으로 어떤 교육이 제공되는지 보고 싶었는데, 목록이 예상보다 많아 탐색하기가 어려웠던 경험이 있었습니다. 나쁜 점 1: NCS 직종 및 훈련유형이라는 낯선 단어NCS 직종은 국가에서 선정한 직업종류를, 훈련 유형은 기업에서 주도하는 것인지 혹은 일반인이 들을 수 있는 등의 훈련 유형을 의미하는 것 같다고 추측했습니다. 사실 직업교육을 처음 들으려는 사용자 입장에서는 두 단어가 상당히 낯설었습니다. 훈련 유형에는 알아볼 수 없는 유형도 많아서 어떤 걸 보아야 하는거지? 무엇은 들을 수 있고 안되는거지? 잘 모르겠었어요. 내부적으로 정보 설계는 잘 되어 있겠지만 이것이 사용자에게는 도달하지 못한 것 같습니다. (기준에 따라 사용자가 행동을 결정할테니, 행동 유도와도 비슷한 맥락이라고 생각이 들었습니다.) 이를 꼭 다 보여주어야 하는건가? 사용자별로 유형을 다르게 보여줄 수는 없나 생각이 들었습니다. 굳이 다 보여주어야 한다면 작게 툴팁을 두어 설명을 붙여놓았으면 더 좋았을 것 같습니다.나쁜 점 2: 직종 선택시의 불편함 대분류, 중분류, 소분류로 나누어져 있어 직업군에 대한 명확한 기준이 있구나 싶었습니다. 하지만 높은 의도를 가지거나, 낮은 의도를 가진 사용자 입장에서 팝업 상태에서 (이미 한 뎁스 들어가서) 일일히 소분류까지 필터로 설정하는 사용자가 있을까 의문이 들었어요. 해당 팝업에서 대분류에 비해 중, 소분류에 대한 클릭수가 낮다면 대분류의 내용을 아이콘으로 설정해 상위로 (퍼스트 뎁스로) 두는 방향도 괜찮을 것 같다는 생각이 들었습니다.나쁜 점 3: default 개강일자가 1년으로 설정된 것1개월, 3개월, 1년단위로 볼 수 있는데 1년이 기본 설정되어 있습니다. 내부적으로 이유는 있었겠지만, 기간에 따라 검색 목록의 양이 더 늘어나지 않았나 싶습니다. 3개월만 해도 충분하지 않을까 싶습니다.나쁜 점 4: 결과 목록에 대한 정보 설계결과 목록을 보면 매우 많은 정보를 볼 수 있습니다. (훈련기관, 훈련명, 훈련기간, 시간, 취업률, 가격 등등)각 훈련에 높은 의도를 가진 사용자는 세부 내용을 클릭해서 볼테니, 정말 필요한 정보만 뽑은 후 재배치하면 어떨까 싶었습니다. 또한 훈련 기간이 크게 강조되어 있는 것 보다, 훈련명이 더 중요한 정보가 아닐까 생각이 들었습니다. 정보제공에 대한 우선순위도 다시 세워야 할 필요가 있어보였어요.논외로검색시 게시판 목록의 숫자가 몇백 ~ 몇십개 정도 나오는 것을 보았는데요. 해당 류의 정보 제공 서비스 같은 경우, 사용자가 원하는 정보를 찾을 때 까지 목록을 알맞게 잘 탐색할 수 있게 필터링하는 것이 핵심 UX 설계인 것 같다는 생각이 들었습니다. 느낀점: 해당 과제는 제 나름의 기준을 잡아 문제점 제기하였고, 대안 의견까지 녹이긴 했지만 실무에서 정말 하라면(?) 까마득하다고 생각이 들었습니다. 문제점을 위한 근거를 찾는 것부터 가설(대안)에 대한 근거를 찾고 설득하는 것도 같이 생각해보려 했는데, 머리가 아파오더라구요 @@ 많은 공부와 연습이 필요하구나 생각이 들었습니다.질문: 해당 과제를 하면서 사용자의 정보 탐색 프로세스 관련하여 흥미가 생겼는데 혹시 관련해서 볼만한 논문이나 아티클이 있을까요? 혹은 해당 분야 외로도, 선생님이 평소에 보시는 UX관련 아티클 혹은 논문 사이트가 있으신지 궁금합니다!  

dribble에서 캡쳐해서 따라서 제작하려 하는데요제작하려는 프레임 치수로 이미지의 사이즈를 변경해서 디자인 하면 되는건가요?? 이미지 픽셀도 많이깨지고, 레퍼런스 이미지마다 제품 테두리 디자인이 포함되있기도 해서 레퍼런스 참고 사이트들에서 캡처해서 따라하는 방법이 이방법이 맞는지 궁금합니다! 추가로 따라하려는 이미지상에 그리드를 표현하지는 못하는건가요?

뷰포인트가핸드폰 캡처본만 필요시 되는거고 그 원리들은 PC모니터, 태블릿에는 적용이 안되는건가요?PC캡쳐본은 직접 해보니 동일한것같은데태블릿 도 뷰포인트 프레임에 디자인하는게 맞나요?

안녕하세요. 강의를 보던 와중에 헷갈리는 부분이 있어서 질문드립니다.개발자에게 핸드오프 공 유시 특정 스크린만 공유하고 싶을 때는 스크린을 선택하여 링크를 보내면 된다고 하셨는데요.강의로 볼 때는 전체가 다 공유된 것 같은데 특정 스크린만 선택하여 공유하여도 다른 화면도 같이 보이게 되는 걸까요?그럼 특정 스크린과 전체 스크린을 공유할 때 개발자가 보는 화면에서 어떤 차이점이 있는지 궁금합니다.감사합니다.

안녕하세요 질문드립니다.올려주신 ios키트 에서 강의에서 사용하신 하단바는 아니지만다른 하단바를 가져와서 연습중입니다. 하단바를 제작할때 그룹을 짓거나 하지않고하단바의 아이콘과 텍스트를 각각 묶어서 프레임을 지어놓으시더라고요.이유가 무엇인가요?그룹지어서 놓는게 더 편할꺼같은데디자이너분들이 프레임으로 묶어놓는 이유가 있나요? 그리고저 분홍색 부분이 배경 컬러를 넣으신게 아니라하단바 자체를 그리드위에 만들어 놓았던데굳이 그렇게 할 이유가 있는건가요? 어떤상황에는 프레임으로 묶고, 어떤상황에는 그룹으로 묶어서 정리하는지 정확히 잘모르겠습니다.

공감하기 정의하기 부분의 설명을 보고 조금 혼동되어서 질문을 올립니다.공감하기 정의하기 부분은 Product가 나오고 나서 사용자들의 피드백을 받고 진행하는 부분인가요?아니면 시장조사를 하고 제작자들이 이미 시중에 나와있는 페이지를 봤을때 문제점을 집어서 해당 문제를 보안하는 페이지를 만드는 것을 목표하는 부분인가요?

프레임상에 그리드를 두고 디자인을하면반응형 웹디자인으로서핀터레스트 웹사이트 예시 처럼 웹사이트의 크기를 줄여나가면 컨텐츠들이그 웹사이트 조정한 크기에 맞게 변하는것 처럼.그리드 상에 디자인을 하면 화면 픽셀 단위 에 맞게 컨텐츠들이 조정된다고 이해를 하였습니다.모바일 반응형 디자인을 한다고 가정했을때모바일용 프레임 비율 한가지에다가 그리드 위에 디자인을 하면모바일 모든 디바이스에 디자인이 각 디바이스 해상도에 맞게 조정 되는것으로 이해를 했습니다.그렇다면피그마 상에서 위 사진처럼 모바일 디바이스별 프레임을 분류를 해놓는데제가 사진 위에 설명처럼 이해를 한다면,아이폰8 디바이스 프레임을 선택해서 그리드위에 디자인을 한다고 가정했을때그 디자인한 앱을아이폰11, 또는 아이폰12 등등 을 사용해도똑같은 디자인으로 결과값이 도출되는지가 궁금합니다.또한 아이폰 8 디바이스 프레임을 선택해서 그리드 위에 디자인한 앱과아이폰 11 디바이스 프레임을 선택해서 그리드 위에 디자인한 앱과똑같은 결과값이 나오는건가요?즉 그리드 를 사용해서 디자인을 한다면모바일 프레임이라면 어떤 프레임을 사용해도 상관이 없는건가요?또한그리드상 위에 디자인을하면 반응형으로서 각 디바이스 해상도에 맞게 조정이 되는것이라면왜 모바일용 해상도 프레임 or PC용 해상도 프레임 이런식으로 통일하지않고위 사진처럼 각 디바이스별로 프레임 해상도를 분류해놓는것인가요?모바일 프레임이라면 어떤 프레임을 선택해도 모든 모바일 디바이스상에 결과값이 동일한가요?질문이 많아서 불편드려 죄송합니다!위의 모든 질문은 디자인을 할시에어떤 프레임 상에 디자인을 해야되는지 궁금증에서 나왔으며어떤 프레임상에 디자인을 해도 결과값이 모두 동일한지 궁금증이 해결되지않습니다!저 많은 디바이스별 프레임중에 어떤 프레임에다가 디자인을 해야되는건가요?PC용 디자인을 하더라도 디자이너 분마다 디자인을 하게되는 프레임의 해상도 비율값이전부 다르시고 추천하시는 프레임 해상도 비율값도 전부 다르신데이 프레임의 해상도 비율값이 달라도 그리드 상에 디자인을 하면모두 동일한 디자인값이 나오는지가 궁금합니다!

실제 웹 따라할때 실제 픽셀 과 오브젝트 사이의 픽셀크기들 , 글꼴의 크기 어떻게 아는건가요??따라하려는 사이트 화면 확대축소 비율 100%로 캡처한후에피그마로 사진 가져온후 피그마 상의 확대비율 100%로 맞추면동일한 픽셀인것인가요?  추가로 만약 따라해서 제작한후에 피그마상에서 실제 사이트처럼 구현되는것을 확인할수있는 방법이 있을까요?  

디자인 시스템 contenent 설명해주시는도중에버튼의 상태인normal / hover / press / focus / disabled 상태로 나타내셨고 text Field 상태를blank / filled / activated / error 로 표현하셨는데요 normal , press, disabled 등 몇가지는 어느정도 알겠는데hover focus activated 등등 무슨 상태를 표현하는 단어인건지 사전을 찾아봐도 정확히 감이오질않습니다. normal / hover / press / focus / disabled blank / filled / activated / error이상태들이 정확히 무슨상태인지 여쭈어 봐도될까요?  

오브젝트의 라운딩값을 전체에 주는게 아닌일부만 라운딩 안줄수 있는 방법이 있을까요?

안녕하세요. 그리드 개념에 대해 배우다 궁금한 점 이 있어 여쭈어 봅니다. 각 제품마다 화면 크기가 다르니까, 그에 맞는 픽셀의 프레임으로 디자인을 해야 한다고 이해를 했습니다.  그렇다면 한 회사의 앱 또는 웹을 출시한다고 했을 때실무에서 디자이너는 현재 존재하는 모든 제품들의 화면의 픽셀에 맞는 프레임들을 따로 전부 각각 디자인을 해야하는건가요?아니면 그리드 상에 디자인을 하면 자동으로 맞추어 주는건가요? 그리고핀터레스트 웹사이트 예시 보여주시면서웹사이트의 크기를 줄여나가면 컨텐츠들이알아서 맞게 변하는것을 보고 이게 반응형 디자인이고 이를 하려면 그리드로 디자인을해야한다고 이해를 했습니다.이또한 그 화면마다 디자이너가 그화면 프레임에 맞게 각각 디자인을 한건가요?아니면 그리드상에 디자인을 하면 자동으로 맞추어 주는건가요? 그리드상에 디자인을 하면 자동으로 맞추어 주는것이 정답이라 한다면,모바일 디자인이라 가정했을때아이폰8 프레임 / 아이폰 11 프레임 등등어떤 프레임으로 디자인하는 모든제품에 대응이 되는것인지 궁금하며또 이것이 대응이된다면각 제품마다 프레임이 나누어놓는 이유가 무엇인가요?  아이폰8 사용자를 대상으로아이폰11 프레임으로 디자인 했을때대응이 되는지 / 또 대응이 된다면 차이는 없으며 왜 프레임을 제품마다 나누는지 궁금합니다. 

화면과 같은 아이콘 제작을연습하고 있습니다.화살표를 만들려 하는데아이콘 아래 방법들 처럼 진행해서 화살표를 만들 생각을 했습니다.이 화살표의 크기가 무족건 소수점이 되어서아이콘상으로 옮겼을때 keyline 프레임상에 딱 중심으로 가게할수가 없더라고요, 위치랑 크기가 소수점으로 떨어집니다.소수점 이동해서 최대한 중앙으로 맞춰도 끝부분은 약간 빗나가게 되버립니다.이방법으로 화살표 만드는게 맞는지 여쭈어 봅니다.또한 딱 중앙으로 맞추는 방법이 있을까요??