성장기록 블로그

UX/UI 디자인(2020) 올인원 패키지 Online. UIUX 인강 수강 후기 🤸🏻‍♀️ 패스트캠퍼스 수강료 0원 환급 챌린지가 끝이 났다! 오늘은 최종 후기를 들고 왔습니다. 소감 - 최소 2,000자 (공백 포함) - 이미지 최소 3장 11월 2일부터 11월 29일까지, 총 28일간 매일매일 세 클립씩 수강하고 내용을 블로그에 올리는 환급 미션! 회사를 다니면서 수강을 하는게 말처럼 쉬운 건 아니었지만 그래도 매일매일 듣다보니 지식이 쌓이는 느낌이 들어서 좋았다. 평생소장이니까 챌린지 끝나고도 계속 들으면서 정리하고 있당 (다만 블로그에 올리는 건 시간이 너무 많이, 오래 걸려서 안올리고 있음...) 2회차 때는 정리보다는 외워서 용어같은 것들을 숙지해야겠다고 생각했다. 이때까지 배운 것 정리 겸..

28회 11/29 (일) !!!! 마지막 ㅠ 챌린지날이다 03. UI 디자인 클립 32. 컴포넌트 디자인 - 06. Tabs Tab !: 앱 상단 헤드의 하위에 고정된 부분을 얘기한다. On a touchscreen, you tap where you would have pointed and clicked on a mouse-enabled display. Tap is a simple, deliberate gesture. ... These touch gestures can be more than confusing to utilize in interaction designs. They can even incite controversy within the user experience (UX) community...

27회 11/28 (토) 03. UI 디자인 클립 29. 컴포넌트 디자인 - 03. App bars - 2 tools - settings 다운받을 때 개발자와 협의해야 하고, 다운받은 것과 적용한 것은 다름 greyscale 값을 적용한 결과 어제 만들던걸 진행하는 중 ~ 다른 디자이너들이 만들어놓은 템플릿을 사용할 수도 있다!! 클립 30. 컴포넌트 디자인 - 04. App bars - 3 모든 아이콘은 2424 의 값을 가지고, 그 안에서도 각각 1의 값을 가지고 있는 것을 확대하면 볼 수 있다 줄이면 보더도 함께 변화한다. 때문에 원이라고 하는 보더 값을 아웃라인으로 변경한 후 사이즈를 맞추어야 한다! 아이콘 간의 간격도 2424로 맞추면 깔끔하게 보인다. 클립 31. 컴포넌트 디자인 - 05. A..

26회 11/27 (금) 03. UI 디자인 클립 26. 스케치를 활용한 인터페이스 디자인 - 09. 라이브러리sketch, library ios ui design 안으로 기본 심볼로 지정되어있는 것들을 활용할 수 있다.디자인을 제공해주는 것들을 왼쪽 상단에 있는 tool바에서 바로 사용할 수 있다~! File > New From Template > iOS App IconSelect the top Artboard and zoom in and center the selected Artboard (Command ⌘ + 2)Right-click on Icon Shape and select Unlock Layer so we can edit the shape color Step 2: Changing the bac..

25회 11/26 (목) 03. UI 디자인 클립 23. 스케치를 활용한 인터페이스 디자인 - 06. 심볼과 스타일 - 2 material design 에서 다양한 텍스트 사용을 적용할 수 있음. 스타일로 적용한다고 했을 때 레이아웃 스타일을 적용하고 다른 형태의 도형에 적용시킬 수 있음 (update를 통해 계속 추가할 수 있음) radius는 적용 안됨. 심볼의 기본 편집 과정 이걸 만약에 하나의 심볼로 저장하고 싶으면 symbol로 저장하면 공통된 레이어로 저장되어있음.심볼은 한번 저장해놓으면 레이아웃처럼 쓸 수 있는게 아니고 심볼들을 모아놓은 곳이 있음 해당 페이지에서 색깔을 바꾸거나 자유롭게 저장을 해주거나 아니면 원래 작업한 페이지에서 변경할 수 있음 클립 24. 스케치를 활용한 인터페이스 디..

03. UI 디자인 클립 20. 스케치를 활용한 인터페이스 디자인 - 03. 아이콘 디자인 - 2 default 값 지정 -> 보더가 지정되지 않은 값으로 만들어진다. shadow 은은하게 조금 튀어나온 것처럼 만들 수 있음! (요즘 많이 사용하는 타입) 안쪽에도 퍼져나가는 것과 같은 스타일의 섀도우 사용이 가능하다. 사각형 외에도 다양한 원틀이 존재한다. =shape들의 조합 버튼 존재! combine layer에서 하위에 존재하는 것이 우선시된다. 레이어 순서를 바꾸면 진행 방향 역시 바꿀 수 있다. 클립 21. 스케치를 활용한 인터페이스 디자인 - 04. 아이콘 디자인 - 3 펜툴상에서 그린 모형들을 수정할 수 있음 각 포인트가 활성화되었을 때 펜 툴처럼 마음대로 바꿀 수 있음 !!! 왜이렇게 나왔..

03. UI 디자인 클립 17. 인터페이스 디자인 기초 - 09. 인터렉션 Interaction CLI (Command Line Interface) l GUI (Graphical User Interface) l Touch (Touch Interaction) l Voice (Voice Interaction) Gestures 여러 가지 종류 중 nativation gestures 와, nativation gesture에는 또 여러 가지 종류가 있다. (TAP) TAP - 클릭, 터치하는 것 Scroll - 상하 방식으로 내리는 것 Pan - 지도 화면에서 사용하는 것 (꾹 눌러서 다른 곳으로 이동) Drag- 끌어서 올리거나 내리는 것 Swipe- 미는 것 Pinch - 두 개의 손가락을 사용해 눌러 확대시..

03. UI 디자인 클립 14. 인터페이스 디자인 기초 - 06. 타이포그래피타이포그래피 각 서비스들은 자체 서비스 폰트를 가지고 있다. System font / Service font? Android / Ios 부터 제공하는 폰트가 다르다 !Android: Roboto / Noto (Roboto로 표현하지 못하는 글자들을 표현하는 폰트)Ios: San Francisco (Apple Developer 사이트에서 다운받을 수 있다) 각 부분에 어떤 스타일의 어떤 폰트를 사용하는 것이 좋겠다를 디자이너와 개발자가 협업하여 선택해야 한다. 클립 15. 인터페이스 디자인 기초 - 07. 아이콘 - 1IconographyㄴProduct (App) Icon 안드로이드에서 앱을 개발할 때는 굉장히 어렵다 아이콘들이 ..

21 회 11/22 빠이야~~~ 03. UI 디자인 클립 11. 인터페이스 디자인 기초 - 03. 레이아웃과 그리드 시스템 - 1 기기의 레이아웃과 그리드 시스템 모두를 확인할 수 있는 사이트 material.io 실제 픽셀로 쓸때는 x3를 해야 한다. 실제 안드로이드 dp 사이즈와 아이폰의 사이즈는 다름 ! 포토샵에서 자주 쓰는 기록 8 이하는 가능 : 8의 배수로 진행 8배수 깔아놓고 진행하게 됨 클립 12. 인터페이스 디자인 기초 - 04. 레이아웃과 그리드 시스템 - 2 밀도에 따라 dp 크기를 맞춰주어야 한다. Colume Guide, Gutter Padding and margins tend to confuse a lot of people because they seem to refer to t..

20 회 11/21 빠이야~~~ 03. UI 디자인 클립 08. 디자인 기초와 컨셉 - 05. 타이포그레피 (분류, 용어, 구조) 목적: 정보전달! *(참고 정보) Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line-spacing (leading), and letter-spacing (tracking), and adjusting the space between pairs of l..