본문 바로가기

Study/Adobe XD

(4)
Adobe XD 공부기록 3. 디자인 요소 세팅하기, 그리드 설정, 디자인 스타일 템플릿 공유, 만들기 tip. 디자인 탭에서 색상요소 설정하기 사각형을 만든 후 선택한 상태에서 좌측 색상탭의 + 버튼을 누르면 선택한 컬러가 색상요소로 세팅이 된다. 디자인 탭에서 문자 스타일 요소 설정하기 마찬가지로 텍스트도 필요한 설정을 한 후 선택한 상태에서 문자스타일 탭에서 + 버튼을 누르면 스타일이 저장이 되고 디자인을 진행할 때 클릭을 통해 일관되고 편리하게 텍스트 요소를 설정할 수 있다. 스타일 템플릿을 별도로 만들어서 UI디자인에 활용하기 헤드라인, 서브헤드라인, 본문, 컬러, 버튼 스타일 등등을 미리 별도의 파일로 만들어 둔다. 템플릿 처럼 활용해서 디자인을 일관적이고 편리하게 진행할 수있따. 아트보드 추가 a를 눌러서 아트보드를 선택한 상태로 비어있는 바닥 클릭 좌측 툴바에 아트보드 버튼이 파랗게 선택되어있는지 확..
Adobe XD 공부기록 2. 둥근 사각형 만들기, 클릭하면 위로 올라오는 팝업창 만들기 모서리가 둥근 사각형 만들기 사각형을 만들고 우측 메뉴에서 각 모서리 별 라운드 값을 지정해 줄수 있다. 아래에서 위로 올라오는 팝업창 애니메이트 올라오는 요소를 구성요소 cmd k로 만들어두고 전체 투명도를 0으로 하여 안보이게 만든다 아트보드를 복사하고 위에서 올라올 요소를 올라갈 위치까지 위치이동을 시킨 후 투명도를 100으로 하여 보여지게 만든다 프로토타입 탭으로 이동해서 버튼 하나와 올라올 창을 연결한다. 우측 메뉴에서 자동애니메이트 - 서서히 시작 -끝내기를 선택한뒤 미리보기 창을 눌러서 확인한다.
ui/ux design 이란 무엇인가요? User interface란 Interaction design 이란? Product designer가 하는 일 Customer experience 란? Design thinking 및 ui/ux 디자인의 순서 각 단계별로 디자인을 하여 프로덕트를 완성하는 일도 있겠지만 문제가 발생시 뒤돌아가기도 하고 다시 정의를 하면서 이 순서를 계속 왔다 갔다 하는 것 같습니다.
Adobe XD 공부기록 1 구성요소, 이미지넣기, 횡스크롤, 패딩옵션 구성요소 (component) 객체를 모두 선택하고 ctrl+k cmd를 눌러 그룹의 구성요소를 개별로 선택할 수 있다. 구성요소를 아트보드로 드래그하면 복사할 수 있다. 패딩(padding)을 통해 텍스트 길이에 따라 늘어나는 사각형 만들기 텍스트와 사각형을 cmd+g로 그룹을 만든 후 우측 메뉴의 패딩을 클릭해준다. 객체 잠그기 cmd+l 혹은 마우스 우클릭하면 각종 기본 어레인지 메뉴가 있다. (앞으로 보내가 뒤로보내기....자르기,,복사,,) 이미지 넣기와 수정 구성요소(component)된 상태에서 대지로 드래그해도 구성요소가 복사된다. 이미지를 이미지 박스 (사각형으로 만들면 됨)에 드래그 하면 같은 구성요소를 복사한 이유로 동일하게 이미지가 복사된다. 다른 이미지를 선택해서 드래그 하면 수정..