컬럼 그리드 시스템 Margin 가로가 좁은 스마트폰 특성상 양쪽 여백이 10px로 좁게 들어갔습니다. 홈 탭의 마지막 카드 콘텐츠는 마진을 넘겨서 보여줌으로서 다음 콘텐츠에 대한 궁금증을 자극하여 가로로 스크롤을 유발하도록 했습니다. Column 스마트폰에 맞는 표준적인 컬럼 갯수인 4개를 사용해서 제작되었습니다. 컬럼에 맞게 버튼과 컨텐츠들이 대칭적으로 잘 정렬되어 있습니다. Gutter 버튼들 사이에 Gutter는 넓게 주어서 각 버튼을 구분하는 느낌을 주었습니다. 카드 컨텐츠 사이는 버튼보다 좁에 만들어서 각 주제별로 묶인 콘텐츠들이 독립적으로 보이지않게 했습니다. 전체적으로 스마트폰에 잘 맞는 배치를 가지고 각 아이템들이 잘 정돈되어 있다고 판단됩니다. 추가적으로 화면 크기에 변화에 유연하게 대..

UI(User Interface, 사용자 인터페이스)는 사람들이 컴퓨터와 상호 작용하는 시스템. GUI(Graphical User Interface)와 물리적 UI를 모두 포함하지만 프론트엔드 개발자로서의 UI는 대부분 GUI를 의미한다. UX(User Experience, 사용자 경험)는 사용자가 어떤 시스템, 제품, 서비스를 직•간접적으로 이용하면서 느끼고 생각하는 총체적 경험 UI와 UX의 관계 UX는 UI를 포함한다. 하지만 좋은 UI가 항상 좋은 UX를 보장하지는 않는다. UX에 영향을 주는 이 많은 요소 중에 프론트엔드 개발자에게 가장 중요한 요소는 바로 UI다. 좋은 프론트엔드 개발자라면 제품이나 서비스의 UI가 사용자로 하여금 가능하면 좋은 UX를 가질 수 있도록 해야한다. UI/UX 사용..