본문 바로가기

전체 글

(16)

🗂️ 피그마 - 버튼 컴포넌트 (의사상태 / 프로퍼티) 5주차 강의 중 4주차 강의를 듣고있지만 여전히 적응 안되는 피그마그치만 ? 피 할수없으면그 만마 저 즐겨야겠지 .. 포기하지 않고 돌아온 피그마랑 친해지기 이번 게시글은 버튼 컴포넌트와 싸워본 이야기지금 당장 폰을 열어 어떤 앱을 들어가도 가장 친근하게 볼 수 있는 버튼인데 이게 이렇게 간단하면서도 숨바꼭질 하며 (나만) 만들어지는 거였다니 🥶 버튼 의사상태 지난 시간에 버튼까지 만들었는데 이번에는 사용자가 "클릭"했을 때 변화하는 컴포넌트를 생성했다. 이렇게 두가지를 두고 봤을 때 왼쪽이 화면을 만났을 때 보이는 [기본상태] 오른쪽이 사용자가 버튼을 클릭했을 때 또는 마우스를 올렸을 때 색이 진해지는 것 여기까지는 4배수에 맞게 사이즈 조정을 하고 플러그인을 이용해 만들어둔 색상을 사용하면돼서..

🗂️ 피그마 - 레이어와 프레임 프레임 피그마에서 디자인의 기본 단위 , 실제 화면으로 인식되는 개체 "컨테이너"라고도 함 프레임은 어떻게 움직일까 , "컨스트레인트" 프레임이 움직이는 규칙을 지정 프레임 vs 그룹프레임그룹코드 블록이 만들어져 실제 코드로 변환 가능개발에 필요한 속성 적용 가능편집, 조정 시 여러 개체를 한번에 조정하기 위해 사용개발에 필요한 속성 적용 불가능실무에서 거의 사용 안됨 정렬단일 개체 정렬다중 개체 정렬서로가 서로의 기준이 되어 정렬부모 레이어가 기준이 되어 정렬 오토레이아웃 :레이어를 쌓고 프레임을 유연하게 배치할 수 있도록 해주는 기능 레이아웃을 편하게 쌓아올리는 것 오토레이아웃 간 지정 규칙 , 리사이징 코드블록 (컨테이너) UI = 개체의 크기 + 패딩 패딩 Padding코드 블록 안에 있는 개..

🗂️ 피그마 - 플러그인 (컬러, 폰트) , 컴포넌트 , 인스턴스 실습 플러그인coolors와 styler를 이용해 사용자 지정 색상과 폰트를 생성해줌 generate 하며 선택한 색의 색상코드 HSL 지정 후 L의 숫자를 조정해 색상 라인업 통일성 있는 작업에 유용 컴포넌트 / 인스턴스 / 컨테이너 컴포넌트반복적인 디자인 유용하게 불러올 수 있음 컴포넌트 복제 시 '인스턴스'가 생성됨 인스턴스 컴포넌트의 복제본이라 그 속성을 그대로 받음 컴포넌트 수정 시 인스턴스에도 반영 (원본 유지 + 복사본) 컴포넌트 삭제 시 인스턴지 잔존 (단독 수정 불가, 수정 필요시 컴포넌트 복구 필요) 연결 해제 시 기본 프레임이 됨 헬퍼 텍스트와 라벨 사용할 때 정렬 확인해주기 체크박스, 라디오 생성 🗂️ Today I learned 피그마 3주차 강의를 수강해보았는데 지난 시간에 ..

🗂️ 피그마 - 레이어와 프레임 프레임 피그마에서 디자인의 기본 단위 , 실제 화면으로 인식되는 개체 "컨테이너"라고도 함 프레임은 어떻게 움직일까 , "컨스트레인트" 프레임이 움직이는 규칙을 지정 프레임 vs 그룹프레임그룹코드 블록이 만들어져 실제 코드로 변환 가능개발에 필요한 속성 적용 가능편집, 조정 시 여러 개체를 한번에 조정하기 위해 사용개발에 필요한 속성 적용 불가능실무에서 거의 사용 안됨 정렬단일 개체 정렬다중 개체 정렬서로가 서로의 기준이 되어 정렬부모 레이어가 기준이 되어 정렬오토레이아웃 :레이어를 쌓고 프레임을 유연하게 배치할 수 있도록 해주는 기능 레이아웃을 편하게 쌓아올리는 것 오토레이아웃 간 지정 규칙 , 리사이징 코드블록 (컨테이너) UI = 개체의 크기 + 패딩 패딩 Padding코드 블록 안에 있는 개체..

🗂️ SQL - 유저 세그먼트 / 서브쿼리 세그먼트 / 서브쿼리 마케팅, 데이터 분석, 비즈니스 전략에서 아주 핵심적인 개념공통된 특성이나 행동을 기준으로 고객을 그룹화한 것select restaurant_name, sido, ## 배달 시간 조건 별로 구분하는 delivery_time_segment 컬럼 생성 ## case when avg_delivery_time 20 and avg_delivery_time 30 then "30분보다 크다." end delivery_time_segmentfrom (## 식당별, 시도별 평균 배달 시간 조회 테이블 ## select restaurant_name, substr(addr, 1,2) sido, avg(delivery_time) avg_delivery_timefrom food_orders ## 사..

🗂️ 피그마 배워보기 (1) - 프레임 프레임과 그룹 프레임 단위 작업 프레임 vs 그룹프레임 : 두 프레임을 프레임 단위로 묶어줌 전체 프레임의 크기 조정 시 내부 프레임은 변하지 않고 전체 틀(프레임)의 사이즈만 변동묶어준 프레임도 하나의 부모 프레임이 되어 배경 지정 가능정렬 시 상위 프레임 기준 정렬 , 내부 프레임들끼리는 서로가 서로의 기준 그룹 :그룹화 된 내부 프레임 모두 크기 변동

🗂️ 프로덕트 매니지먼트 개론 (3) - 프로덕트 개발 / PM의 업무 / 애자일 PM의 좋은 전략도 혼자서는 이뤄낼 수 없다 "협업 빈도의 차이, 다양한 이해관계자와 함께 한다" # 개발자 - 프론트 개발자 - 백엔드 개발자- 앱개발자 💭 PM은 눈에 보이는 것에 포커스 맞추고, 개발자는 보이지 않는 곳의 작업 # QA 엔지니어 상품의 품질 점검, 기능 테스트 PM의 아이디어 공유 -> QA 작업 후 -> 개발자에게 전달 # UX/UI 디자이너 기획 의도에 맞춰 디자인 PM이 하던 업무의 고도화를 위해 업무가 세분화 되고있음 # UX 리서치 # UX 라이터 # 데이터 분석가프로덕트 목표 잘 반영한 핵심 지표 (KPI) 설정하고 데이터 분석가에게 데이터 요청데이터 분석가 : 인사이트와 함께 데이터 전달 PM : 분석 결과 바탕 업무 및 목적 전달 데이터 분석가 : A/B..

🗂️ 프로덕트 매니지먼트 개론 (2) - PM 성장 꿀팁 프로젝트를 해보는 것이 가장 좋지만, 그 전에 현실적으로 해볼 수 있는 것은 없을까 1. 기술 블로그 & 컨퍼런스 #기술 블로그- IT 회사 현업자들이 문제 해결 경험, 실무 경험을 공유해주는 글 많이 접하기 - 이론적인 책보다 트렌드한 동향 파악 가능 - 오픈 소스 문화 활성화 (개발자) -> 최근에는 분야 상관없이 읽고 있음 - 개발에 대해 deep 하게 이해할 필요는 없음 추천 🌟토스 , 기술 블로그 우아한 형제들, 기술 블로그 (유일하게 PM 파트가 있음)(생성형 AI를 참고해 쉽게 이해할 수 있음) 직접적인 PM이 아니어도 "협업", "마케팅" 유관 콘텐츠 접해보면 좋음 #개발 컨퍼런스, 디자인 컨퍼런스 유튜브에 기업명과 컨퍼런스 서치해서 지난 컨퍼런스 영상 참고 가능 2. IT 콘텐..

이전 1 2 다음

티스토리툴바