패스트캠퍼스 환급챌린지 46일차 : AI 시대, UX/UI부터 프로덕트 디자인까지 한 번에 끝내는 초격차 패키지 강의 후기

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.

---

1. 학습 인증샷 4장 이상 포함

1. 오늘자 날짜 + 공부 시작 시각이 보이는 사진 1장
2. 오늘자 날짜 + 공부 종료 시각이 보이는 사진 1장
3. 1개 클립 수강 인증 사진 1장 (강의 화면 내용은 보이지 않도록 / 목록 캡처 추천)
4. 학습 인증샷 1장 이상 (예: 필기, 작업물, Before/After 등)

 

2.학습 후기 700자 이상 (공백 제외)

오늘 배운 핵심 내용을 정리하고, 흥미로웠던 부분과 이를 내 업무에 어떻게 적용할 수 있을지 함께 기록해 주세요.

 

 오늘은 컴포넌트에서 텍스트필드, 툴바에 대해서 배웠습니다. 제가 첫 컴포넌트 강의에서 텍스트필드부터 들은 이유가있는데요. 텍스트 필드는 거의 모든 앱과 웹에서 활용이되고 기존에는 기존값에 대한 텍스트필드 한개의 상태만 만들었었는데 여러 상태값들까지 다 만들어줘야된다는 걸 인턴경험을 하며 알았습니다. 텍스트필드 컴포넌트 하나만 개발자에게 넘기면 된다고 생각햇었는데 모든 상태값들을 구성해야 전달해야된다는 사실도 알게되었습니다. 텍스트 필드에 대한 개념은 google material design을 보고 말해주셨는데 요즘 트렌드는 ios와 안드로이드를 따로따로 디자인 하는 경우가 없다고 합니다. 안드로이드 스타일이있고 ios 스타일이있었는데 같은 디자인을 활용한다고 하네요. 그리고 직접 제작을 하면서 느꼈는데 확실히 아이콘을 컴포넌트화 시켜두고 처음 만들때 잘 만들어두면 추후 수정할때나 다른 컴포넌트를 만들때도 정말 편리한거 같습니다. 또한 Shift + A를 누르면 오토레이아웃이 되는데 이 기능은 정말 많이 활용하니 그냥 외우는게 정답인 것 같습니다.

텍스트 필드를 만들면서 패딩, 마진도 기존에 등록했던 스타일을 적용하고 최종적으로 다 만든뒤에도 배열 해놓았을 때 가독성이 좋은지도 확인하는 작업을 했습니다. 그리고 하나의 컴포넌트를 만든 뒤에 복사 후 detach하고 다시 컴포넌트로해서 일일이 상태값 별로 만들었습니다. 요즘엔 워낙 많이 디자인시스템을 무료배포한 곳도 많고 ai도 많이 나와 생산성 측면에서 많이 증가한거 같습니다. 직접 ai로 디자인시스템을 만들어보진 않았지만 현재 ai의 발전속도를 보면 추후에 일일이 만들지않고 한번에 디자인 시스템과 컴포넌트까지 다 만들어줄거 같아 무섭네요. 현재 저는 ui kit를 활용하여 복사한 뒤에 본인의 프로젝트에 특성에 맞게 변경하여 활용하고 있는데 직접 만들어보니 여러 상태값별로 어떤 식으로 디자인해야되는지 알 수 있어서 귀중한 시간이었습니다. 마지막으로 툴바도 만들어보았는데요. 이 툴바에서 헷갈리는 부분이 플로팅 툴바였습니다. 저는 독형태의 툴바만 있는 줄 알았고 플로팅 되어있는거는 툴바가 아닌 다른 이름으로 불리는 건 줄 알았습니다. 바텀 네비게이션이라고 많이 불렀던 것 같습니다. 이 툴바에서 spec부분은 48이었고 제가 이 툴바를 만들면서 처음 알게 된 개념은 각각 의 컴포넌트를 nested를 하면 컴포넌트로 만들어 둔 것들끼리 바꿔낄 수 있다는 걸 알게 되었습니다. 또한, 레이어가 많아 새로 이름을 적을 때 소문자 n을 넣어야 내림차순이되고 N이면 오름차순이 된다는 것도 알게 되었습니다. 기초부터 차근차근 다시 해보니 기존에 알고있던 지식에서 더 플러스되고 정리도 할 수 있는 시간이라 유용했습니다. 상태값별로 컴포넌트를 다 만들어야된다는 것을 잊지않겟습니다. 

---

 

https://fastcampus.info/4oKQD6b