본문 바로가기

디자인

 (11)
웹 디자인 그리드 시스템(Grid System) 디자인을 할 때 고민해하는 것 중 그리드 시스템에 대해 한참을 빠져서 고민한 적이 있다. '과연 그리드 시스템은 무엇이지?', '그리드 시스템을 꼭 사용해야 하는건가?' 그것에 대한 답을 찾기 위해 많은 고민을 했고 지금은 나 스스로는 확실한 답을 내린 상태이다. 결론부터 말한다면 그리드 시스템이 없어도 최종 디자인 산출물을 만드는 결과에는 영향이 있지는 않다. 하지만 내 디자인의 퀄리티를 높이고 안정적인 디자인을 하는데는 꼭 필요한 요소라고 생각한다. 그리드 시스템은 무엇일까? 그리드 시스템(Grid System)이란 정보 구조와 배열을 체계적으로 작성하여 정보의 질서를 부여하는 시스템이다. 정보의 질서를 부여하게 되면 정보가 일관성을 갖고 정리되어 보이게 된다. 그러므로 좀 더 체계적인 정보 전달이 ..
디자이너가 쓰기 좋은 크롬(Chrome) 플러그인 웹 브라우저 시장에는 큰 변화가 있었다. 단연 IE 몰락과 크롬의 대두이다. 현재 주변 지인을 보거나 브라우저 시장 점유율만 찾아봐도 쉽게 변화를 확인할 수 있다. 첨부한 표를 보면 더욱 공감할 것이다. 특히나 크롬을 웹서핑 목적 외 디자이너와 개발자는 개발자 도구와 각종 플러그인을 이용하는 경우도 많을 것이다. 나 역시 크롬을 이용하면서 개발자 도구와 다양한 플러그인을 잘 사용하고 있다. 그래서 디자이너로 내가 사용하고 있는 플러그인은 어떤 것이 있는지 소개하고자 한다. 만약 모르고 있다면 한 번 사용해 보고 계속 사용해야 할지 판단해 보는 것도 좋을 것 같다. 우선 첫번째로 소개할 플러그인은 'CSS Peeper' 이다. CSS Peeper는 빠르게 웹사이트의 Text, Elements의 속성을 확인..
디자이너가 HTML&CSS를 배워야 하나? HTML? CSS? HTML과 CSS는 웹브라우저에 그려지는 화면을 표현해하는 가장 기본적인 언어입니다. HTML과 CSS의 뜻을 정확히 알지는 못해도 HTML, CSS에 대해서는 한 번쯤 다 들어봤을 것 입니다. ※ HTML, CSS는 무엇일까요? HTML(Hyper Text Markup Language)은 웹페이지를 만들기 위한 언어로 웹브라우저 위에서 동작하는 언어입니다. CSS(Cascading Style Sheets)는 HTML, XHTML, XML 같은 문서의 스타일을 꾸밀 때 사용하는 언어입니다. 이렇게 HTML과 CSS는 웹브라우저에서 보여지는 페이지를 디자인 한 것을 보여지게 하는 언어입니다. 그렇다면 자신이 웹페이지를 디자인하는 직업을 가진 사람이라면 이런 생각을 해보셨을 겁니다. '나..
디자인 시 알아야 할 단위(px, dp, sp, pt) PX, DP, SP, PT ? 웹/앱 디자인을 할 때 기본적으로 알아야 항목이 있습니다. 그 중 디자인 시 알아야 할 단위에 대해서 생각해 보려고 합니다. 디자이너가 UI 작업을 진행할 때 Photoshop, Sketch, Figma 등의 프로그램을 이용합니다. (당연히 그외 다양한 프로그램이 존재합니다.) 이때 사용하게되는 단위는 픽셀(Pixel) 입니다. 흔히 줄여서 px 로 사용합니다. 1. 픽셀이란? 간단하게 우리가 보는 화면이나 이미지를 이루는 최소 단위입니다. 만약 우리가 가로, 세로 100px의 사각형을 그린다고 하면 어느 디바이스나 화면에서 동일한 크기로 보여집니다. 이는 픽셀은 절대값이기 때문입니다. 하지만 dp, pt 등의 단위는 물리적 크기는 다르게 됩니다. ※ 픽셀과 함께 자주 보이..
액슈어(AXURE) 설치하고 메뉴 알아보기 액슈어 설치하기 액슈어를 사용하기로 결정했다면 우선 액슈어를 자신의 로컬 컴퓨터에 설치를 해야한다. 액슈어는 맥(Mac), 윈도우즈(Windows)를 모두 지원하기 때문에 일반적으로 많이 사용하는 운영체제에서 이용이 가능하다. 액슈어를 설치하기로 했다면 액슈어 공식 홈페이지로 이동한다. ※이 게시글은 2020년 작성되어 현재와 상이할 수 있습니다. ▶︎ 액슈어 홈페이지를 방문 Axure RP 9 - Prototypes, Specifications, and Diagrams in One Tool The most powerful way to plan, prototype and hand off to developers, all without code. Download a free trial and see why..
구글 스프린트(sprint) - 4일차 진짜처럼 보이게 만들기 오늘의 할 일은 딱 하나 입니다. 바로 프로토타입을 만드는 것 입니다. '옛 서부영화에 등장하는 술집의 외관처럼 진짜 같아 보이는 프로토타입을 만들어내는 것이다.' 프로토타입 작업에서 중요한 건 바로 고객이 테스트를 실제처럼 느끼도록 하는 사실감입니다. 그래야 테스트에 참여하는 고객의 집중도가 올라가기 때문입니다. 외관만 제작한다고 하면 왠지 찝찝하다고 느낄 수 있습니다. 하지만 임시적인 모의시험에 집중하기로 생각을 바꾸어야 합니다. 이런 사고 방식을 '프로토타입 사고방식'이라 합니다. 프로토타입 사고방식 어떤 것이든 프로토타입을 만들 수 있다. 프로토타입은 한 번 쓰고 버릴 수 있어야 한다. 테스트에서 무언가를 배울 수 있을 정도로만 구해야 한다. 프로토타입은 진짜처럼 보여야 한..
구글 스프린트(sprint) - 3일차 결정하기 오늘은 어제 작성된 솔루션을 확인하고 효과적인 결정을 하는 날입니다. 스프린트를 통해 많은 솔루션이 나왔지만, 이를 모두 반영하기란 쉽지 않습니다. 그렇기 때문에 우린 결정이라는 단계를 거쳐 실제로 구현할 솔루션을 선택하게 됩니다. 지금부터는 결정하는 단계를 알아보고자 합니다. 스프린트에서 효과적인 결정을 내리는 방법을 소개하고 있습니다. 이를 끈적끈적 결정이라고 부릅니다. 이런 결정 방법론이 나온 배경에는 각 아이디어를 논의하는데 많은 시간을 써도 뚜렷한 결론을 얻지 못하는 경우가 빈번하기 때문입니다. 그래서 끈적끈적 결정은 이런 논의를 없애고 빠른 시간 안에 의사결정을 목표로 합니다. 1) 미술관 우선 어제 작성했던 솔루션 스케치를 한 쪽 벽면에 모두 부착을 합니다. (미술관에 그림이 걸려있..
구글 스프린트(sprint) - 2일차 조합하고 발전시키기 둘째날은 가장 중요할 수 있는 아이디어 스케치를 하는 날입니다. 아침을 든든하게 챙겨먹고 오늘 하루 화이팅할 준비를 마칩니다. (오늘 하루 많은 아이디어를 생각해야 합니다...) 1) 번갯불 데모 오늘은 우선 팀원이 생각하는 우리 서비스에 대한 솔루션을 생각하는데 좋을 만한 서비스를 소개합니다. 이는 다른 팀원에게 생각을 확장할 수 있도록 하며, 다양한 파생된 아이디어를 수집하기 위함입니다. 이를 번갯불 데모(Lightning Demo)라고 합니다. 번갯불 데모는 우리가 해결해야 할 문제들을 좀 더 유연하게 사고할 수 있는 단초를 만들어주는 역할을 합니다. 막연하게 솔루션을 생각하기 보다는 각자 알고 있는 서비스나 제품에서 좋은 점을 공유해, 우리의 솔루션에 접목하여 발전시켜 나가는 ..
구글 스프린트(sprint) - 1일차 어떻게 시작해야할까? 스프린트 1일차(월요일)에 필요한 항목과 해야할 방법에 대해서 스터디를 진행했습니다. 앞서 작성한 글에서 [서비스 맵 작성 & 타겟 설정]을 해야 한다고 했는데, 어떻게 해야는지 하나 하나 짚어봐야 할 것 같습니다. 스터디를 하면서 참고한 서적이 있습니다. 인터넷 검색을 통해도 많은 정보를 얻을 수 있지만, 책을 사서 볼 수도 있습니다. 그래서 저는 검색을 통한 정보 뿐만 아니라 관련 서적을 통해 스프린트를 배워갔습니다. 월요일에는 과연 '무엇을?', '어떻게 해야할까?' 라는 막연한 물음이 생길 것입니다. 저도 해당 물음이 발생했고, 그래서 서적을 찾아보게 되었습니다. 1) 장기적인 목표 설정하기 월요일(1일차)에는 프로젝트의 장기적인 목표부터 설정을 해야 합니다. 스프린트의 첫 ..
구글 스프린트(SPRINT)란? 스프린트? 기업에서 서비스를 만드는데 여러 과정을 거치게 됩니다. 이를 효과적으로 하기 위해 다양한 시도를 하게 되고, 장/단점을 파악해 발전 시켜 나갑니다. 제가 스타트업, 중소기업 재직 시, 위에 언급한 것을 기대했지만 현실은 차이가 많이 있었습니다. 많은 기업이 더 효율적인 방법론 시도에 대해서 긍정적인 반응을 보이지만, 실상 이를 실행하는데는 망설이는 경우가 많이 있습니다. 이는 많은 시간과 노력이 필요한 부분으로 작은 기업에서 이를 감수하기란 어려운 부분이 있기 때문입니다. 그러다 최근, 많은 기업에서 다양한 시도를 하고 있습니다. 기존 Desk Research 에 의존한 방식에서 좀 더 User Side 에서 고민하려는 노력을 하고 있습니다. UX 라는 워딩으로 국내에서도 사용자 중심의 서비스..

티스토리툴바