[06주_2024_11_27] UX 프로젝트 3일차

2024년 11월 27일 (  Wednesday  )
───────────⚪──────
◄◄⠀▐▐⠀►► 𝟸:𝟷𝟾 / 𝟹:𝟻𝟼⠀───○ 🔊

[개인]
🩶 디자인 카타 진행
🩶 피그마 강의 듣기
🩶 UX 프로젝트 진행
🩶 TIL 작성 및 제출하기
[팀플]
🩶 저녁 팀 스크럼(회고)

---

🤤오늘 진행한 부분!

디자인 카타를 진행하면서 터치제스처를 발표하였다.

그런 다음 팀원들과 데일리 회고를 한 다음 사용성 테스트 정리를 어떻게 해야하는지 자료를 찾은 다음 피그마 강의를 들었다.

컴포넌트의 기능들을 아직 잘 이해하지 못했다고 생각해서 아쉬웠는데 너무 유익한 강의였다.

 

피그마 강의

• 컬러
  • 컬러 스타일을 만들 때 화이트, 블랙도 사용하면 같이 넣어주기
• 아이콘
  • 아이콘 이름 머트리 아이콘이라고 불리는데 이유가 생김새로 가지고 이름을 정하기 때문
  • 기본 24*24로 만들어주는데 쉐입만 남기고 레이어 버리기
  • 아이콘 스케일 설정 되어있는지 아닌지 확인하기
  • 요소들을 다 합쳐서 스톡해주기
  • outline stroke 설정해주기
  • 가이드 라인 사용해주기
• 컴포넌트
  • 작은 단위는 거의 컴포넌트로 만든다고 보면 됨
  • 패딩만 있는 오토레이아웃은 빼기➡️불필요한 레이아웃
  • 글자 수 제한을 두는 영역이 있음 / 기능 정의를 할 때 글자 수 어디까지 할 지 정하고 컴포넌트를 만듦
  • 부모가 프레임이면 컨스레이츠를 봐야 함
  • 컴포넌트 단위로 옵션이 필요할 때 베리언츠! / 부분적으로 조건이 붙어야 할 때 프로퍼티!
• 이름 짓기
  • item : 최소 단위, UI에서 혼자 쓸 수 없는 단위
    • 레벨 + UI타입 + 방향 + 사이즈 + ?(필요한 요소) 식으로 하는 것이 좋음
    • ex.
      • module_movie_row_L
      • module_song_column_M
      • module_playlist_column_S
  • OS에서 제공하고 있으며, 통용되는 이름인 경우
    • ex.
      • Top Nav Bar
      • Tab Bar 또는 Bottom Nav Bar
      • Button
      • Progress Indicator
      • Chips
      • Checkbox
      • Radiobutton
      • Toggle Switch 등

 

오후에는 사용성 테스트를 한 것을 문서화하여 정리하였다.

생각보다 정리 오래걸려서 놀랐다. 녹화된거 정리하는 거라 오래 안걸릴 줄 알았는데 정리만 하루 다 보낸거 같다.

---

😆새로 알게 된 사실!

• 모바일이에서 이제 터치제스처 뿐만아니라 바디 제스처, 핸드 제스처도 중요하게 봐야함
• 우리가 제스처가 뭔지 알고 고민해서 사용자가 생각할 수 없게 해야함
• 스켈레톤 로딩은 너무 많이 사용하면 사용자가 느리다고 생각하기 때문에 많이 사용하는 건 지양해야됨
• 스켈레톤 대신에 나온게 애니메이션 로딩임
• 애니메이션 로딩은 오래 기다리면서 중요한 페이지에 넣기
• 앱이 처음 실행 될 때가 가장 무거움

(개발자 모드 키기)

• 윈도우 - F12
• 맥 - cmd + option + i
• 폰: 아이폰은 없음, 안드로이드 모드는 있음