🗂️ 피그마 - 버튼 컴포넌트 (의사상태 / 프로퍼티)
5주차 강의 중 4주차 강의를 듣고있지만 여전히 적응 안되는 피그마
그치만 ?
피 할수없으면
그 만
마 저 즐겨야겠지 ..
포기하지 않고 돌아온 피그마랑 친해지기 이번 게시글은 버튼 컴포넌트와 싸워본 이야기
지금 당장 폰을 열어 어떤 앱을 들어가도 가장 친근하게 볼 수 있는 버튼인데
이게 이렇게 간단하면서도 숨바꼭질 하며 (나만) 만들어지는 거였다니 🥶
버튼 의사상태
지난 시간에 버튼까지 만들었는데 이번에는 사용자가 "클릭"했을 때 변화하는 컴포넌트를 생성했다.
이렇게 두가지를 두고 봤을 때 왼쪽이 화면을 만났을 때 보이는 [기본상태]
오른쪽이 사용자가 버튼을 클릭했을 때 또는 마우스를 올렸을 때 색이 진해지는 것
여기까지는 4배수에 맞게 사이즈 조정을 하고 플러그인을 이용해 만들어둔 색상을 사용하면돼서 괜찮았다
이렇게 한번 Large, Medium, Small 나눠 만들어봄
프로퍼티
시간을 오래 쏟아부은 곳은 여기
왜냐면 ......
마스터 컴포넌트가 있는 곳에서 찾았던걸 과제하는 동안 잊고 있었으니까
그렇게 엉뚱한 곳에서 boolean만 열심히 찾고있었다 👀
한바탕 멍청 이슈가 지나가고 ~.~
마침내 강의 때 다뤘던대로 프로퍼티를 추가할 수 있었다
이렇게 복제해서 확인하니 설정해둔 boolean 속성을 확인할 수 있었다
🗂️ Today I learned
오늘 과제를 하며 어려웠던 점은 아직 피그마의 요소들과 친해지지 못한 것 같다는 생각이 든다. 용어가 입에 안붙으니 손과 눈으로 더 자주 실행해보며 익히려고 한다. 모든 툴이라는 건 자주 부딪혀볼수록 많이 느는거니까 개인 시간 동안 내가 자주 사용하는 어플의 버튼을 한번 따라 만들어보고 기록해봐야겠다!