Notice
Recent Posts
Recent Comments
Link
«   2024/11   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
Archives
Today
Total
관리 메뉴

UI/UX 공부기록

[사전캠프 2주차] 목요일 TIL 본문

사전캠프

[사전캠프 2주차] 목요일 TIL

hyunjiii 2024. 10. 10. 17:29
10/10 일일 목표📝

2주차 5~7강 강의듣기

특강 듣기

아티클 스터디

 


 

 

📖 오늘 배운 내용!

 

오늘은 박가현 튜터님께서 하시는 [현업에서 디자이너가 개발지식을 가지면 좋은점] 에 대하여 특강을 들었다.

디자이너는 UI/UX를 설계하고, 사용자 경험 중심의 디자인을 하지만 프론트엔드 개발자는 디자이너가 만든 프로덕트가 실제로 작동하도록 코드로 구현하는 일을 한다.

 

디자이너 프론트엔드 개발자
UI.UX 설계, 사용자 경험 중심의 디자인
- UIUX 디자인
- 사용자 경험 중심의 디자인
- 디자인 시스템 관리
프로덕트가 실제로 동작하도록 코드로 구현
- 디자인 구현
- 상호작용 개발
- API 연동

 

개발자와 디자이너가 소통이 어려운 이유

  • 전문 용어의 차이
  • 기술적 제약
  • 작업 흐름의 차이

 

서로 담당하는 일이 다르지만 협업을 통해 하나의 웹사이트/앱을 만들게 되니까 디자이너들도 코딩을 조금 알게되면 좋다는 점을 설명해주셨다. 그러므로 리액트를 배우면 개발자와의 소통이 쉬워질 것 같았다. 

 

 

2주차 강의에서 중요하게 배운 점은 프레임과 컨스트레인트이다.

오토레이웃을 좀 더 잘 이해하고 사용하기 위해서는 컨스트레인트가 중요하다.

 

컨스트레인트란?

  • 제약(조건), 제한 이라는 뜻
  • 오토레이아웃에 안에 있는 개체들이 움직이는 방식을 제한

 

리사이징이란?

프레임은 기본적으로 가로와 세로의 길이 고정되는데 이 프레임을 오토레이아웃으로 감싸는 순간, 다른 사이즈가 생기는 것을 피그마에서는 리사이징 이라고 한다. 한마디로 , 사이즈가 변경된다는 뜻.

 

 

 

 

 


 

👩‍🏫 오늘 진행하며 어려웠던 부분

 

처음 듣는 개념인 오토레이아웃도 물론이고 프레임, 리사이징 개념이 너무어려웠다.

강사님의 진도에 맞춰 Child container 과 Parent Container 를 만들어 피그마에서 연습했지만

아직 Fixed , Hug , Fill 의 유형을 위의 표로는 알겠지만 실습에서는 어떻게 움직이는 조금 더 연습해봐야 할 것같다.

 

 


 

👀 어려웠던 부분을 어떻게 해결했을까?

 

피그마에서 조금더 혼자 연습을 많이 해봐야할 것 같고, 이해하면 uiux 디자인을 하는데 정말 편리한 기능이라고 생각한다.