geumsong lee blog

[10/20 내일배움캠프] 사전캠프 6: 4주차 강의, TIL

사전캠프 D-6📌To Do List * 4주차 강의: 컴포넌트 프로퍼티 * 5주차 강의: 배운 내용 토대로 실습, 프로토타입, 스크롤 컨테이너, 오버플로우, 핸드오프 01 4주차 강의컴포넌트 프로퍼티💡의사상태란?- 버튼이 가진 가상의 상태💡컴포넌트 프로퍼티(Component Property)란?- 의사상태에서 컴포넌트는 가상의 상태를 가지는데 형태가 변하거나 컴포넌트 안의 요소가 바뀔 수 있다. *배리언츠(Variants) - 프로퍼티의 한 종류지만 별개의 속성이다. 프로퍼티 안에 있지만 배리언츠, 프로퍼티 이렇게 분류한다.- 변종이라는 뜻. 가상의 상태 만들 때 사용한다버튼 컴포넌트의 베리언츠들 이라고 부름 *프로퍼티(Property): 속성- 디자인 구조가 바뀌지 않는 선에서 변경할 수 있는 요..

[10/18 내일배움캠프] 사전캠프 5: 3주차 강의

사전캠프 D-5📌To Do List* 3주차 강의: UI디자인 스타일과 컴포넌트  01 3주차 강의: UI디자인 스타일과 컴포넌트📌파운데이션💡파운데이션(Foundation)이란?- 컴포넌트 제작 시 쓰이는 재료(요소)[파운데이션 종류]- 색상(Color)- 서체(Font, Typhography)- 간격, 여백(Spacing, Gap)- 곡률(Radius)- 그리드(Grid)- 고도(Elevation) : 레이어 층층이 쌓는 것- 아이콘(Icon)   📌컬러스타일- 핸드폰, 모니터로 봤을때 색깔 다름. 원래 빛이란 그런것! - 디스플레이 = 빛의 3원색으로 구성 [빛의 3원색 = RGB] - 좌측 이미지- Red, Green, Blue- 합쳐질수록 밝아짐 → 가산혼합 [색의 3원색 = CMY ] -..

사전캠프 D-5📌To Do List* 2주차 강의: 피그마 - 프레임과 포지션 01 2주차 강의 - 피그마: 프레임과 포지션  📌프레임과 그룹*디자인이 코드로 바뀌는 과정1) 디자인 →  코드로 변환2) 이때, 코드는 디자인을 레고처럼 쌓는다- 코드는 위에서 아래로 쌓는데, 이를 박스모델이라고 한다.3) 웹,앱이 코드를 읽고 디자인으로 바꿈 💡프레임(Frame)이란? - 코드 블록을 만드는 기능이자 실제 화면으로 인식하는 개체 (실제 구현될 화면 캔버스라고 생각하면 될듯)'컨테이너(Container)'라고도 불림 - 개발에 필요한 속성 적용O- 프레임으로 묶는 단축키: ctrl + alt + G (우측클릭해서 선택 가능) 💡그룹(Group)이란? ( 코드로 변환X  → 실무에서 잘 사용X)- 개체..

사전캠프 D-4📌To Do List*1주차 강의: 피그마01 강의 1주차 - 체계적으로 배우는 피그마 기초 완전 정복 📌Figma: 기획 → 디자인 → 개발 → 테스트 모두 단계에서 사용할 수 있는 커뮤니티 협업 툴*왜 사용하나요?1) 웹, 앱 모두 사용 가능(OS,Window)2) 디자인, 개발 업무 가능3) 풍부한 커뮤니티 자료: 플러그인, 디자인 자료4) 쉽게 학습 가능  📌디스플레이와 배수*디스플레이(Display): 디지털 화면(TV, 모바일, 전광판, 웹사이트 등)- 픽셀로 이루어짐. *해상도: 디스플레이의 선명도(픽셀 갯수) - 픽셀 갯수 계산 : 가로 * 세로 픽셀 갯수 계산. (ex. 1920*1080 = 2,073,600)1) 해상도 같은 경우, 화면 크기가 클수록 픽셀 한 칸 크..

사전캠프 D-3📌To Do List* 아티클 스터디(팀): 사용자 인터뷰로 숨은 니즈 발견하기, 게임 속 팝업의 버튼 UX 디자인 - 좋은 사례 VS 나쁜 사례, 목록에서 상세 정보를 얼마나 보여주는 게 좋을까? (방법) 40분 아티클 리딩 - 요약 - 인사이트 공유* 개인과제: 내가 생각하는 프로덕트 디자이너의 핵심 역량   1-1 아티클 스터디사용자 인터뷰로 숨은 니즈 발견하기💡더블 다이아몬드 모델이란?- 문제 해결과정을 두 개의 다이아몬드 형태로 시각화하여 문제발견, 정의단계에서 다양한 가능성을 탐색하고(발산)솔루션 개발과 전달 단계에서 최적의 해결책을 찾는 과정을 보여주는 디자인 사고 프로세스.(더블 다이아몬드 모델은 서비스 디자인과 디자인 씽킹 모두에서 사용되는 주로 프로세스다)* 더블 다이..

사전캠프 D-2📌To Do List* 아티클 스터디(팀): 인지 부하를 줄이는 UX 디자인의 비밀 (방법) 40분 아티클 리딩 - 요약 - 인사이트 공유* 개인과제: 비슷한 직무 JD 분석   01 아티클 스터디인지 부하를 줄이는 UX 디자인의 비밀주제인지부하를 줄이는 이유와 그 방법들내용 요약사람은 정보를 인지할 때 얻을 수 있는 양의 한계가 있다. 너무 많은 인지부하가 생기면 혼란스러우며 만족도가 낮아지는 문제가 생긴다. 우리는 다양한 방법을 사용하여 인지부하를 낮춰야한다.간결함과 명확성질서부여그루핑 활용단계별 접근일관성인사이트 -많은 사람들이 ‘일관성을 유지해야한다’라고 주장하지만 그 이유가 단지 사용자가 봤을 때 통일성 있는 앱이 보기 편할것이라고만 생각했다. 물론 이 말도 맞지만 인지부하의 개..

사전캠프 D-1📌To Do List* 아티클 스터디(팀): 삶의 질을 높여주는 10가지 UX 사례(방법) 40분 아티클 리딩 - 요약 - 인사이트 공유 * 개인과제: 프로덕트 디자이너 JD 분석 * 특강: 프로덕트 디자이너가 개발을 알아야하는 이유 더보기들어가기에 앞서, 보다 효율적으로 학습을 위해 TIL / WIL 작성법을 알아야한다.*TIL (Today I Learned) / WIL (Weekly I Learned)- 자신의 언어로 자신이 학습한 내용을 정리하는 것- 본인이 오늘 하루 배운 것 혹은 경험하고 느낀 것들을 기록하고 회고하는 것- 외국에선 개발직군이 아니더라도 그날그날 본인의 배움을 기록하는 문화가 있지만, 한국에서는 주로 개발직군이 비교적 많이 사용하는 개념으로 정착하였다고 함.(처음..

스타터 노트 캠프를 시작하기에 앞서 가장 먼저 스타터 노트를 적고프로덕트 디자이너로서의 마음가짐에 대해 생각하게 되었다.프로덕트 디자이너 혹은 UI/UX디자이너를 꿈꾸는 사람들에게도 도움되기를 바라며혹여 캠프에 참여해보지 못한 사람들은 따라해보며 감을 익히길 바란다.이 질문들에 대한 답을 스스로 진지하게 생각해보고 직접 적는 과정이 동기부여도 돼서 도움될 것이다.  Q1. 내가 프로덕트 디자이너 트랙에 참여한 계기는 무엇인가요? 디자인 비전공자에 2년동안 웹디자이너로서 일하고 퇴사를 결정했습니다.더 이상 이 회사에서 성장할 수 없다고 생각했고 UI/UX 디자이너로서 더 전문적으로 성장하고 싶은 마음에 포트폴리오를 제작하여 본격적으로 취업준비를 시작했습니다. - 내가 관심을 가질만한 분야인가?- UI/UX..