Big Dreamer_Developer/UI_UX(2)
-
Figma_그리드 시스템 Grid System
Goal : Figma의 그리드 시스템을 이해하자 우선 왼쪽 상단의 메뉴를 눌러 검색 기능에서 layout을 쳐준다, 그리고 show layout grid를 체크해주자. show layout grid를 체크하면 위 이미지의 모습에서처럼, 시안에 적용된 그리드 시스템을 볼 수 있다. 앞으로 그리드를 껐다 켰다하는 것은 정말 많이 쓰이기 때문에, 단축키 ctrl+shift+4를 기억해서 자주 이용하도록 하자. 자 그래서 그리드 시스템이 무엇이냐, 디자이너가 디자인 작업을 할 때 화면에 아무것도 없이 완전 빈 화면에다가 레이아웃을 배치하고자하면 되게 힘들 것이다. 어디다가 레이아웃을 배치해야할지도 모를 것이고 배치를 한다 하더라도 일관성을 지키기가 어려울 것이다. 그리드 시스템이 하는 역할은 마치 우리가 노트..
2021.07.02 -
CSS 초기 세팅, reset.css VS. normalize.css
프로젝트를 진행하기 전에는, 보통 CSS를 초기설정을 해놓고 시작한다. 보통 normalize.css 혹은 reset.css를 이용해서 css 정상화(초기화)를 설정해놓는다. 이는 왜냐하면 브라우저는 아무런 설정이 없을 때, 미리 소정의 css를 자동적으로 제공하고 있는데, 이러한 초기의 브라우저의 제공은 오히려 육안으로 봤을 때 형편이 없게 느껴지기 마련이기 때문이다. 따라서 이에 따라 Eric A. Meyer 교수는 2007년 reset.css를 내놓았고, 그 후에는 Nicolas 또한 normalize.css를 내놓았다. normalize.css와 reset.css 둘은 css를 초기 설정하기 위한 코드뭉치들이다. 둘의 큰 차이는 없다만.. Eric A. Meyer의 reset.css는 정말 필요한..
2021.06.29