본문 바로가기

전체 글

 (80)
[TIL] 24.11.04(월) 피그마 개인 과제 1일차오늘부터 목요일 오후 6시까지 개인 과제를 진행한다.우선 유제품이라는 카테고리가 메인 화면에 바로 나오려면 어떤 콘셉트의 커머스 앱을 구상해야 할지부터..컬러, 폰트, 아이콘, 각종 컴포넌트 등 UI 키트 작업만 하다가 하루가 끝났다.내일은 키트 작업 마무리하고 디자인 작업 들어가야겠다.기본 과제 + 심화 과제까지 마무리할 수 있기를...!! (+ 프로토타이핑 응용하는게 상당히 어렵다ㅠㅠ더 다양한 케이스를 찾아보고 실습해봐야겠다!)
[WIL] 5주차 / 24.10.28(월) ~ 24.11.01(금) [WIL]FACTS(사실, 객관)프로덕트 디자인 8기의 본 캠프 2주차가 오늘로 마무리 되었다. FEELINGS(느낌, 주관)새로운 조원들과 함께한 첫 주가 마무리되었다. 이번 주는 오전 9시부터 10시까지 튜터님과 함께 디자인 카타를 진행하고, 그 후에는 피그마 강의를 수강하며 복습하는 과정을 반복했다. 디자인 카타를 처음 경험했는데, 조원들이 가져온 다양한 레퍼런스를 공유하고 튜터님의 피드백을 받는 것이 매우 유익했다. 나는 국내 사이트를 중심으로 레퍼런스를 찾아봤지만, 다른 사람들은 해외의 다양한 레퍼런스를 찾아오는 것을 보고 내 시각이 지나치게 좁지 않았나 반성하게 되었다. 앞으로는 나도 국내뿐만 아니라 해외의 다양한 레퍼런스를 탐색하고 디자인에 대한 시각을 넓혀야겠다고 생각했다. 사실 처음에는 ..
[TIL] 24.10.31(목) 디자인 카타_[웹사이트, 웹페이지] 웹사이트특정 기업, 개인 또는 조직이 인터넷을 통해 제공하는 정보의 모음으로, 사용자가 웹 브라우저를 통해 접근할 수 있는 여러 웹페이지로 구성된 플랫폼을 의미함웹사이트의 기본 목적은 사용자에게 정보를 제공하거나, 특정 제품과 서비스를 알리는 것웹사이트 내에는 다양한 하위 페이지가 포함될 수 있음 웹사이트와 웹페이지의 차이점웹사이트: 여러 개의 웹페이지가 모여서 구성된 전체. 웹사이트는 특정 주제나 목적에 따라 여러 페이지로 구성되어 있으며, 사용자가 네비게이션을 통해 다양한 정보를 접근할 수 있도록 함. 예를 들어, 뉴스 웹사이트, 기업 웹사이트, 쇼핑 웹사이트 등이 있음 웹페이지: 웹사이트 내의 개별적인 문서. HTML, CSS, JavaScript 등의 기술로 만..
[TIL] 24.10.30(수) 피그마 활용법(2) / 1, 2, 3주차 강의 내용 정리 및 숙제 모달합성 컴포넌트: 대부분 버튼 컴포넌트에 파운데이션 또는 컴포넌트가 여러개 합쳐진 형태(=컨테이너 컴포넌트)ex. 바텀시트, 다이얼로그, 리스트, 카드 등 복잡한 구조의 컴포넌트들이 있음 팝업: 문자 그대로 팝하고 튀어나온다는 뜻으로, 화면 위에 새로운 화면을 띄우는 걸 디자인에서 일반적으로 팝업이라고 부름- 윈도우 팝업: 새로운 윈도우(브라우저 창)을 띄워주는 방식으로, 일반적으로 팝업이라고 부르는 건 이 방식을 뜻함(사용하지 않는 추세)- 레이어 팝업: 현재 화면에서 코드로 만든 컴포넌트를 보여주는 방식으로 대부분의 서비스는 이 방식으로 팝업을 보여주고 있음 모달: 사용자가 행동을 취하기 전까지 뒤에 가려진 화면을 조작할 수 없는 것..
[TIL] 24.10.29(화) 피그마 활용법(1) / 3, 4주차 강의 내용 정리 및 숙제 디스플레이와 픽셀, 배수면적 당 픽셀 갯수가 더 많다면, 더 세밀한 묘사가 가능함1배수 디자인: 디자인을 할 때 기준이 되는 사이즈를 하나 정하게 되는데, 1배수의 뜻은 1배(100%), 즉 원본 사이즈라는 뜻일반적인 1배수 디자인 사이즈는 사람들이 가장 많이 쓰는 사이즈로 하는 것이 일반적이지만, 내가 만들 앱을 쓸 사람들을 고려해야함권장하는 1배수 사이즈: 아이폰(375*812), 안드로이드(360*800) 분기점과 그리드분기점(Breakpoint): 디스플레이의 해상도에 따라 각각 다른 화면을 보여주기 위한 기준점(사전적인 뜻: 나뉘어 갈라지다, 경우의 수가 나누어진다) 사용자의 디바이스 화면 크기를 고려해서 디자인을 나눌 수 있어야 함(..
[TIL] 24.10.28(월) 피그마 활용법(1) / 1, 2주차 강의 내용 정리 및 숙제  피그마 커뮤니티 (주의사항)서비스 제공자가 아닌 사람들이 자체적으로 만드는 것=서드파티(3rd-party, Third-party;제 3자)1. 가격을 꼭 확인할 것2. 저작권을 꼭 확인할 것3. 문제가 생겼을 경우, 제작자에게 직접 문의할 것 피그잼피그마 디자인 파일이 UI 설계에 특화되어 있다면, 피그잼은 린 캔버스, 더블 다이아몬드, 사용자 여정 지도 등 UX 기획 및 아이데이션에 특화되어 있음 Shift+H / Shift + V (단축키)Shift + H: Flip Horizontal Shift + V: Flip Vertical  피그마 도형 이미지 리사이징 종류Fill: 정해진 도형 크기 안에 비율을 유지한 채 이미지를 꽉 채워줌(이미..
[WIL/KPT] 4주차 / 24.10.21(월) ~ 24.10.25(금) [WIL]FACTS(사실, 객관)프로덕트 디자인 8기의 본 캠프 1주차가 오늘로 마무리 되었다. FEELINGS(느낌, 주관)이번 주는 본 캠프 첫 주로, 강의와 팀 페이지 제작이라는 두 가지 큰 목표가 있었다. 결론부터 말하자면 정말 가슴 떨리는 한 주였다. 기다리던 본 캠프의 첫 주였고, 첫 팀 프로젝트(미니 프로젝트긴 하지만!)를 진행해야 했기에 더 긴장되었던것 같다. 강의 수강에 대해 이야기해보면, 사전 캠프 때 강의를 꼼꼼히 수강했다고 생각했지만, 블로그에 정리해놓은 내용을 되짚어보니 기억이 잘 나지 않는 부분들이 많았다. 알고 있는 내용이라 가볍게 여길 뻔했던 내 오만한 모습에 실망감이 들기도 했다. 팀 프로젝트에서 스마트 애니메이션이라는 프로토타이핑 기능을 사용할 때도 강의 내용을 다시 들으..
[TIL] 24.10.24(목) 프로덕트 디자인 8기 본 캠프 4일차오늘은 팀 페이지 만들기 과제의 최종 마무리 작업을 진행했다.어제 거의 마무리된 팀 페이지에서 뭔가 부족함이 느껴져서, 강의에서 배운 프로토타이핑 기능 중 스마트 애니메이션을 적용해봤다. 솔직히 말하면 색상이나 움직임이 조금 유치하고 부자연스러운 것 같아서 100% 마음에 들지는 않았지만, 팀장님이 좋다고 해주셔서 한시름 놓였다..ㅠㅠ오후에는 팀장님과 함께 스크립트를 읽으며 줌에서 발표 연습도 했다. (TMI지만, 줌에서 무료로 제공하는 개인 회의 시간이 끝나면 회의가 자동 종료된다는 걸 새삼 알았다.. 줌도 결제해서 사용해야 한다니ㄷㄷ)팀장님과 나 둘 다 MBTI가 I라서 서로 쑥스러워하며 발표 연습을 했다. 발표를 해보는 게 정말 몇 년 만인지 어색하기도 하고, 연..

티스토리툴바