Back_to_Basics

{3줄 요약}

Flat Design은 그림자와 질감을 빼고 평면의 색과 형태로 UI를 짜는 방식이에요.
스큐어모피즘의 반대로, 화면을 실물 흉내가 아니라 화면 언어로 쓰자는 쪽이에요.
유행한 픽셀보다 불필요를 덜어낸다는 사고가 평평해 보이는 결과를 만들었다고 보는 게 맞아요.

2013년 Microsoft가 Windows 8과 Metro Design으로, Apple이 iOS 7로, Google이 Material Design으로 — 거의 동시에 비슷한 방향으로 인터페이스를 바꿨어요.

그 전까지는 스큐어모피즘(Skeuomorphism)이 지배적이었어요.
아이폰의 메모 앱은 노란 노트 종이처럼, 달력 앱은 가죽 다이어리처럼 보였어요.
버튼은 실제 버튼처럼 볼록했고, 선반 아이콘은 나무 질감이 있었어요.

이 스타일이 왜 갑자기 바뀌었을까요?

첫 번째 이유: 화면 해상도의 변화

Retina 디스플레이(2x 해상도)가 등장하면서 픽셀이 충분히 세밀해졌어요.
이제 화면이 "화면처럼" 보여도 아름다울 수 있었어요.
더 이상 종이를 흉내 낼 필요가 없었어요.

두 번째 이유: 사용자가 디지털에 익숙해졌어요

2007년 처음 아이폰이 나왔을 때 사람들은 디지털 인터페이스에 익숙하지 않았어요.
메모 앱이 종이처럼 보여야 "여기에 글을 쓰는 거구나"를 이해했어요.

2013년엔 달랐어요.
스마트폰을 수년간 써온 사용자들은 이미 탭, 스와이프, 핀치를 알았어요.
종이를 흉내 낼 필요가 없었어요.

세 번째 이유: 정보가 폭발적으로 늘어났어요

앱의 기능이 복잡해질수록 화면에 보여줘야 할 것도 많아졌어요.
질감과 그림자가 시각적 노이즈를 만들었어요.
단순한 색과 형태가 정보를 더 명확하게 보여줬어요.

많은 사람들이 "Flat Design이 스큐어모피즘보다 낫다"고 생각해요.
하지만 스큐어모피즘이 나쁜 것이 아니에요.
그 시대의 사용자와 기술에 맞는 해답이었어요.
Flat Design은 새로운 상황의 새로운 해답이에요.

평평한 색(Flat Color): 그라디언트, 그림자, 빛 반사 없이 단색을 써요.
색 자체가 요소를 구분하는 주요 도구예요.

단순한 아이콘: 실제 물건처럼 보이는 스큐어모픽 아이콘 대신, 단순한 선과 형태로만 만든 아이콘이에요.
확대해도 흐릿해지지 않는 벡터 아이콘이 표준이 됐어요.

명확한 타이포그래피: 배경의 시각적 노이즈가 없으니 타이포그래피가 더 중요해졌어요.
글자 크기, 굵기, 색의 대비로 위계를 만드는 기술이 더 요구됐어요.

완전한 Flat Design은 한 가지 문제를 만들었어요.
"이게 클릭할 수 있는 건가?"를 구분하기 어려워졌어요.

스큐어모피즘에서는 버튼이 볼록하게 보였어요.
클릭할 수 있다는 신호가 시각적으로 있었어요.
완전히 평평해지면 버튼처럼 생긴 텍스트와 진짜 버튼이 구분이 안 될 수 있어요.

그래서 현실에서는 "Semi-flat" 또는 "Flat 2.0"이 등장했어요.
완전히 평평하지는 않지만 스큐어모피즘보다 훨씬 단순한 중간 지점이에요.
아주 미세한 그림자, 약간의 그라디언트, 색으로 깊이를 암시하는 방식이에요.

Material Design의 Elevation 시스템이 이 접근이에요.
평평하지만, 그림자로 공간 관계를 표현해요.

현재 대부분의 인터페이스는 Flat과 Semi-flat 사이 어딘가에 있어요.
중요한 건 스타일의 레이블이 아니라 "이 요소가 무엇인지, 무엇을 할 수 있는지를 사용자가 이해하는가"예요.

스큐어모피즘의 역사와 그것이 왜 그 시대에 유효했는지는 Skeuomorphism에서, Flat Design을 적용한 Material Design의 구체적 원칙은 Material Design에서 볼 수 있어요.

Philip B. Meggs, 《Meggs' History of Graphic Design》(1983) — 스타일 변화의 역사적 맥락이에요.
Edward Tufte, 《Envisioning Information》(1990) — 정보 시각화에서 불필요한 요소를 제거하는 원칙("chartjunk 제거")이 Flat Design과 연결돼요.