피그마 2

[Figma] 기초적인 Figma 정리

팀프로젝트의 첫 단계, ui 설계를 위해 피그마를 배우기로 했다. udemy의 웹디자인 강의를 결제해두었는데 이제 정말 들을 때가 되었다. 기초 기능을 다루는 방법을 정리하며 강의를 들어야겠다. 1. 프레임 (단축키 f) - 화면 크기 정하기 (아이폰, 데스크탑 등등, 또는 개인설정 가능) - 프레임 안에 2개 이상의 도형을 하나의 그룹으로 만들기 위해서는 command+g 또는 shift 누르고 클릭 - 그룹을 해제하기 위해서는 shift+command+g - 프레임 안 오브젝트에 제약조건을 추가할 경우 프레임의 변화와 관계 없이 그대로 있음 2. 기본 도형 - 직사각형(R), 라인(L), 화살표(shift+L), 원(o), 다각형, 별, 펜툴(p) - shift를 누를 경우 정사각형, 8방향의 라인,..

Programming/Project 2024.01.18

[TIL] 피그마 기초, unsplash 플러그인 설치, 프로젝트 사이트 디자인

개인 프로젝트를 시작하려고보니 클론코딩을 하지 않는 이상 디자인이 필수라고 느꼈다. 평소 디자인에는 관심이 많았는데 피그마를 이용해본 적은 없었다. 강의를 듣기보다는 일단 무작정 만져보기 시작! 피그마에 로그인하고 간단한 튜토리얼을 지나가면 이런 화면이 나온다. 인터넷을 찾다보니 unsplash 플러그인을 설치하는 걸 추천하는 글이 보였다. 이곳에 unsplash를 검색하면 무료 사진을 사용할 수 있는 플러그인이 설치된다. 원하는 이미지를 검색하면 바로 다운로드가 되어 아주 편할 것 같다. 개인 프로젝트로 쇼핑몰 만들기를 진행해볼 생각인데 중학생 때부터 좋아했던 펜을 소재로 사이트를 만들어보려고 한다. 자세한 이야기는 프로젝트 게시물로.. 좋아하는 쇼핑몰 여러곳을 참고해 메인페이지 디자인을 마쳤다. 쇼핑..

Programming/TIL 2023.11.09