북스터디(3)
-
[북스터디] 사용자를 끌어들이는 UX/UI의 비밀(5장) - 3. 색상
이전에는 비주얼 스타일의 정의에 대해 써 보았다. 이번부터는 비주얼 스타일에 속해있는 각 요소들과, 해당 요소들의 사례들을 소개한다. > 이전 내용 보러가기 1. 비주얼 스타일이란? 2. 시각적 계층 구조와 구성 비주얼 스타일 - 색상 즉각적인 반응이 일어나는 곳으로, 사용자가 가장 먼저 인지하는 요소이다. 색상 사용 및 조합에 관해 몇가지 소개를 보자. 배경 컬러에 따른 요소를 다르게 사용하라 - 밝은 배경 전면에 어두운 요소를 사용하거나, 어두운 배경 전면에 밝은 요소를 사용해야 한다. - 대비가 충분한지 확인하려면 포토샵과 같은 이미지 툴을 열어서 디자인의 채도를 낮춰보면 좋다. (그레이 스케일로 만들어 보라) 색상 만으로 의미를 구분하지 말라 - 다른 형태나 텍스트로 의미를 강화해야 한다. 이는 ..
2023.05.01 -
[북스터디] 사용자를 끌어들이는 UX/UI의 비밀(5장) - 2. 시각적 계층 구조, 구성
이전에는 비주얼 스타일의 정의에 대해 써 보았다. 이번부터는 비주얼 스타일에 속해있는 각 요소들과, 해당 요소들의 사례들을 소개한다. > 이전 내용 보러가기 (비주얼 스타일이란?) 비주얼 스타일 - 시각적 계층 구조 시각적 계층 구조는 크게 3가지로 나뉜다. 명료성 - 제공하려는 정보를 잘 전달하는 디자인인가? 실행 가능성 - 화면에서 해야 할 일을 사용자가 알 수 있는가? 행동 유도성 - 겉모습이나 동작 방식이 실제 제품의 속성과 일치한다. 이를 잘 따르고 있는 사례들을 알아보자. 1. 심플하지만 사용자에게 우리는 이런 제품들을 팔고 있고, 연말 연시에 우리 제품으로 쇼핑을 하라고 잘 유도하고 있다. 또한 위 쪽에는 탭을 통해 다른 행동을 할 수 있게 구성해 놓았다. 2. 메인 페이지에 들어왔을 때 부..
2023.05.01 -
[북스터디] 사용자를 끌어들이는 UX/UI의 비밀(5장) - 1. 비주얼 디자인이란?
항상 책은 조용히 읽기 때문에 북스터디를 해본 적은 없었는데, 최근 프롬 디자인을 통해 북 스터디를 난생 처음 시작해 보았다. 그리고 오늘, 대망의 발표날이었다. 다행히 유익하고 이해가 잘 되었다는 반응이 많아 블로그에도 올려서 공유하면 좋겠다는 생각에 스터디 했던 것들을 하나씩 공유하려고 한다. 아름다움이 가진 힘을 절대 과소평가 하지말라! 5장에서는 비주얼 디자인이 지니는 중요성에 대해서 이야기 하고 있다. 그렇다면 비주얼 디자인이란 무엇인가? 비주얼 디자인이란, - 사용자 인터페이스에 스킨을 입히는 것 이상의 의미를 갖는다. - 완성도 높은 비주얼 디자인과 룩앤필(look and feel)은 디지털 제품을 돋보이게 한다. - 시각 언어는 브랜드의 성격과 정체성을 전달하여, 브랜드를 대표하는 역할을 ..
2023.05.01