UI 트렌드 2020: 매장에는 무엇이 있습니까?

2020년이 다가오고 있으며, 작년에 어떤 UI 트렌드가 효과가 있었고 올해에도 계속 그럴 가능성이 있는 UI 트렌드를 검토할 기회가 왔습니다. 새해의 시작은 계속해서 인기를 끌 새로운 UI 디자인 트렌드를 살펴볼 수 있는 좋은 기회입니다.

고객에게 혁신적인 아이디어를 제공할 수 있기를 원하는 UI 디자이너에게는 디자인 업계의 새로운 기능, 유용한(또는 유용하지 않은) 및 선호되지 않는 기능을 파악하는 것이 중요합니다. 추세를 검토하고 앞으로 어떻게 발전할지 살펴보는 것은 그러한 노력에 필수적입니다.

2020년 UI 트렌드에는 UI 디자인의 스토리텔링(단순히 UX 측면에서 프로젝트를 생각하는 대신), 3D 그래픽 및 애니메이션, 독특한 마이크로인터랙션, 어두운 테마, 단순성, 음성 상호 작용 등이 포함될 것입니다.

스토리텔링

스토리텔링은 종종 UX 측면에서만 생각됩니다. 그러나 UI 디자이너는 스토리텔링 프로세스에서 필수적인 역할도 할 수 있습니다.

UI 디자이너는 색상, 타이포그래피, 애니메이션 및 인터랙션 디자인을 사용하여 좋은 UX에 필요한 스토리를 구현할 수 있습니다.

Google의 Pixel Earbuds 방문 페이지는 UI 스토리텔링의 매력적인 예입니다. 사려깊은 애니메이션, 공감가는 이미지, 별난 타이포그래피를 통해 방문객에게 제품의 장점을 안내하여 긍정적인 감성적 반응을 이끌어냅니다.

3D 그래픽 및 애니메이션

3D 그래픽과 애니메이션은 UI 디자인에 있어 새로운 것이 아닙니다. 최근 몇 년 동안 여러 제품 범주에서 빈도가 증가했습니다. 특히 VR 및 AR 앱은 실제 방에서 가구를 보는 것과 같은 작업에 이러한 요소를 활용했습니다. 또 다른 일반적인 예는 전자 상거래 사이트에서 인기를 얻은 360도 제품 보기입니다.

UI 디자인이 특히 눈길을 사로잡아야 하는 경우 3D 그래픽이 이를 달성하는 훌륭한 방법입니다. 애니메이션은 시각적 매력을 더합니다. 이러한 효과는 2D 버전보다 시간이 오래 걸리고 전문 기술이 필요하지만 전체 사용자 경험에 추가되는 경우 추가 리소스의 가치가 있습니다.

독특한 마이크로인터랙션

마이크로인터랙션은 우수한 디지털 제품 디자인의 필수 요소입니다. 그러나 여전히 많은 UI 디자이너와 이해 관계자가 간과하고 있습니다.

마이크로인터랙션은 사용자에게 추가적인 통찰력과 피드백을 제공합니다. 여기에는 상호 작용 애니메이션, 다양한 상태를 표시하기 위한 색상 변경, 모바일 앱의 햅틱 피드백 등이 포함될 수 있습니다. 마이크로인터랙션은 디자인을 기능적인 것에서 뛰어난 것으로 끌어올릴 수 있습니다.

어두운 테마

어두운 테마는 몇 년 동안 사용되었지만 2019년에 시작되었습니다. Apple은 Mojave 업데이트를 출시했을 때 지원하는 앱에서 자동으로 어두운 테마로 기본 설정되는 기능을 출시하면서 이러한 추세를 도왔습니다. 그들은 또한 동일한 다크 모드 기능을 제공하는 iOS용 업데이트를 출시했습니다.

어두운 UI 테마는 2020년에도 계속 성장할 것입니다. 시각적인 매력을 넘어 가장 중요한 이점 중 하나는 일부 사람들에게 적절한 대비가 있는 어두운 테마가 눈의 피로를 덜어줄 수 있다는 것입니다.

어두운 테마 처리를 위한 최신 주요 앱 중 하나는 9월부터 옵션을 출시하기 시작한 Gmail입니다. 이제 세 가지 주요 기술 대기업(Apple, Google, 심지어 Facebook의 모바일 앱까지)이 모두 어두운 테마 밴드왜건에 뛰어들었기 때문에 가까운 장래에 이러한 추세가 사라질 것 같지는 않습니다.

간단

단순함과 미니멀리즘은 UI 디자인에서 몇 년에 한 번씩 유행하고 있습니다. 바로 지금, 그들이 있습니다.

심플한 디자인으로 기능성을 최우선으로 합니다. 단순함은 단일 트렌드라기보다 디자인 원칙의 집합체입니다. 단순한 디자인은 종종 게슈탈트 원칙, 대담한 타이포그래피, 미니멀한 색상 팔레트 및 많은 여백을 통합합니다.

디자인의 단순함은 만들기가 쉽지 않습니다. 디자이너의 자신감이 필요하며 의심스러운 디자인 선택을 숨길 수 있는 것이 없기 때문에 모든 요소가 완벽해야 합니다. 잘 하면 사람들이 즐겨 사용하는 우아하고 고급스러운 느낌을 줍니다.

음성 상호 작용

음성 상호 작용은 한때 공상 과학의 영역을 위해 예약되었습니다. 스마트폰과 모바일 앱은 이를 바꿔 음성 상호 작용을 가능하게 할 뿐만 아니라 주류로 만들었습니다. 사람들이 음성 명령을 통해 응용 프로그램과 상호 작용할 수 있도록 하면 제품과 상호 작용할 수 있는 가능성의 세계가 열립니다. 소비자가 음성 명령을 내릴 수 있으면 운전을 하거나 레시피나 튜토리얼을 따를 때와 같이 터치 인터페이스가 안전하지 않거나 실용적이지 않은 상황에서 앱을 사용할 수 있습니다.

음성 상호 작용은 새로운 것은 아니지만 초기 반복 작업은 투박했고 잘 작동하지 않는 경우가 많았습니다. 지난 몇 년 동안 음성 상호 작용은 앱과의 실용적인 커뮤니케이션 방법으로 발전했습니다(일반적으로 AI 지원). 음성 제어가 더욱 향상됨에 따라 사라지지 않을 추세입니다. Google은 I/O 2019에서 Google 어시스턴트 기능에 대한 상당한 업그레이드를 발표했으며 일부에서는 터치 상호 작용을 거의 완전히 대체하는 음성 상호 작용의 시작일 수 있다고 추측합니다.

UI 디자이너는 음성 상호 작용이 작동하는 방식과 음성 상호 작용을 제품, 특히 모바일 앱에 가장 잘 통합할 수 있는 방법을 익히면 도움이 됩니다. 결국 음성 상호 작용은 웹을 포함하여 다른 유형의 상호 작용을 능가할 수 있습니다.

타이포그래피 UI 디자인 트렌드

매년 새로운 타이포그래피 트렌드가 등장하며 작년도 다르지 않았습니다. 2020년에도 계속될 것 같은 더 두드러진 UI 트렌드에는 세리프체로의 복귀, 그다지 크지 않은 영웅 텍스트, 다른 요소와의 레이어링 유형이 있습니다.

그래픽 사용자 인터페이스 디자인이 처음 등장하기 시작했을 때 세리프체는 일반적으로 화면에서 읽기 어렵다는 인상을 받았습니다. 화면 해상도가 낮다는 것은 글자 형태의 더 미세한 세부 사항(일반적으로 작은 시각적 세부 사항)이 손실되어 전통적으로 인쇄물에서 잘 작동하던 많은 서체를 컴퓨터 화면에서 보기 흉하게 만드는 것을 의미했습니다.

화면 해상도가 높아짐에 따라 세리프체는 화면에서 읽기 어렵다는 생각이 어떻게든 지속되었습니다. 이는 최근 몇 년 동안 변경되었으며 헤더 및 영웅 텍스트를 포함하여 일반적으로 산세리프 및 디스플레이 글꼴보다 덜 일반적이었던 세리프가 모든 곳에서 나타납니다.

영웅 텍스트는 매년 웹 사이트의 "스크롤 없이 볼 수 있는 부분" 전체 공간을 차지하는 것처럼 점점 더 커지고 있습니다. 2019년에는 영웅 및 헤더 이미지 위에 더 작은(여전히 눈에 띄는) 텍스트가 사용되면서 변경되었습니다. 공백을 영웅 디자인의 중요한 부분으로 다시 도입한 것은 환영할 만한 변화입니다.

이미지 아래나 위에(또는 때로는 둘 다) 그래픽 요소가 있는 레이어링 유형은 또 다른 성장 추세입니다. 때로는 텍스트가 상자 이미지나 색상으로 오버레이되거나 언더레이되는 반면 다른 시각적 요소와 완전히 통합됩니다.

2020년 UI 트렌드 전망

최고의 UI 트렌드는 시각적으로 매력적이며 디지털 제품의 전반적인 경험과 유용성을 향상시킵니다. 위에서 다룬 트렌드는 계속 진화할 것이며 2020년에는 새로운 트렌드가 나타날 것입니다.

더 큰 브랜드가 트렌드를 채택하고 보편화됨에 따라 표준으로 진화하고 디지털 환경의 일부가 됩니다. 이러한 진화는 이미 어두운 테마와 같은 트렌드에서 일어나고 있습니다.

다른 경우에는 추세가 몇 년 동안 유지되다가 더 나은 아이디어와 방법이 등장하면서 곁길로 빠져듭니다. 이에 대한 한 가지 예는 시차 스크롤링 UI입니다. 이 UI는 몇 년 전에 엄청나게 인기가 있었지만 2020년에는 거의 눈에 띄지 않습니다.

새로운 트렌드는 2020년에 나타날 것이며 여기에 포함된 일부 트렌드는 연말까지 사라질 수 있습니다. 전문 UI 디자이너는 항상 콘텐츠를 제공하는 더 나은 방법을 찾고 있습니다. 즉, 2020년 일부 UI 트렌드는 2021년까지 디지털 시대정신에서 사실상 사라질 것입니다.

• • •

Toptal Design 블로그에 대한 추가 정보:

• 미래를 바라보다 – 2020년의 디자인 트렌드
• Toptal 디자인 블로그 2020 올해의 색상
• 2019년 UX 디자인 트렌드 회고전
• 모든 트렌드가 가치가 있습니까? 웹 디자이너가 저지르는 가장 흔한 5가지 UX 실수
• 다음 트렌드: 오마주 대 디자인 표절