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

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

---

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

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

 

 

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

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

 

 오늘은 디자인시스템 파운데이션 개념을 배우고 직접 만들어봤습니다. 먼저 피그마로 작업하시다보며 버튼에 수많은 컬러를 지정해야될 일이 있잖아요. 그 이후에 수정을 해야되는 상황이 분명 나오는데 컬러값들을 다시 다 변경을 따로따로 하려면 너무 시간소모가크고 어렵다보니 공통된 규칙을 만들어 적용을 하자고해서 만드러진거라 합니다. 예시가 정말 이해가 딱 되는데 카페에서 아메리카노를 시켜먹을 때 "샷 2잔에 물은 500ml로 주세요!"라고 안하고 아이스 아메리카노 주세요! 라고 하는 걸로 생각하시면됩니다. 규칙이 정해진거죠. 아이스아메리카노 2천원짜리는 500ml에 샷 2잔들어가게로 정해진거라고 생각하시면 됩니다. 그래서 디자인 시스템 컬러를 만들 때 헥스코드값을 넣는게 아니고 토큰을 넣는겁니다.

 

추가적으로 이 토큰은 아메리카노에 들어가는 실제 재료라고 생각하시면 됩니다. 즉 아메리카노를 레시피대로 만들어놨는데 만약 레시피가 바뀌면 수정이 필요하니 이 재료만 바꾸면 되는거니 편하겠죠. 그 이후 추가적으로 토큰을 만들고 베리어블에서 원시(Primitive)컬러 부분을 만들었습니다. 그리고 실제로 프로젝트를 하시다보면 UI디자인할때 색상이 한가지만 있는게 아니라 명도값별로 50~900이런 식으로 많이 사용하셨을 겁니다. 이 토큰값을 넣는 작업을 했지만 확실히 AI가 도래하면서 이걸 일일이 넣지않고 AI를 활용하여 넣거나 plugin으로 쉽게 베리어블안에 다 넣어주더라고요. 정말 2024년때 처음 접했지만 그때는 하나하나 토큰값을 지정하여서 넣었었고 다크모드도 기존에 있던 컬러를 다크모드에 맞게 변형시키는 것도 어려웠었습니다. 시대의 흐름이 정말 빠르게 바뀌어가고 있는게 다시 한번 체감되네요. 

이후, plugin을 활용하여 디자인시스템 primitive color 변수값을 넣어줬는데요. supa palette를 활용하여 각각의 컬러 변수들을 만들어주었는데 경고성, 에러, 정보성, 성공 등 각각의 쓰임새가 있어 메인컬러 외에도 다양한 컬러를 variable값에 넣었습니다. 이번 강의를 통해 확실히 AI가 정말 반복적인 작업들을 대체해주는 날이 얼마 남지 않았다는게 느껴지고 더욱더 디자인을 보는 눈을 길러 판단할 수 있게 열심히 공부해야겠다는 다짐을 하게되었습니다. AI를 활용하여 생산성을 올려야되는건 이제 필수가 된 것 같습니다.

---

 

https://fastcampus.info/4oKQD6b

📮올해 마지막 100% 페이백 이벤트 (~12/19) | 패스트캠퍼스