미래 UI와 디자인 샌드박스의 끝

디자인 및 기술 분야에서 일하는 사람, 그리고 아마도 현대 사회에 살고 있는 사람이라면 누구나 "월드 와이드 웹"과 같은 용어를 사용하다가 "사물 인터넷"으로 빠르게 변했다는 사실을 눈치 챘을 것입니다.

짧은 시간에 우리는 웹 페이지(브라우저를 통해 액세스되는 초고속 정보 지도의 지점)에서 미래의 UI(다양한 폼 팩터, 해상도에 걸쳐 콘텐츠와 경험을 제공하는 상호 연결된 광범위한 응용 프로그램)로 발전했습니다. , 그리고 상호작용 패턴.

오늘날 우리가 사용하는 기술과 화면은 우리 주변으로 사라지고 있습니다. 인공 지능(AI)과 음성 비서를 사용하는 "사물 인터넷"은 이미 우리를 둘러싸고 있습니다. 우리는 일상 생활 활동을 수행하는 사람들을 지원하기 위해 다양한 장치가 협력하여 작동하는 "주변 지능"(AMI) 세상의 여명에 있습니다. 개별 화면 기반 UI가 서서히 사라지고 있으며 디자이너는 디자인 구성 요소의 파편화된 시스템과 씨름해야 합니다.

디자이너는 화면이 사라진 AI 지원 주변 지능 세계를 위해 어떻게 디자인할까요? 이것은 그들의 역할을 어떻게 변화시킬 것입니까?

미래의 디자이너 역할이 바뀌고 있습니다.

디지털 디자이너의 작업 목표는 한때 복잡한 일련의 상자, 이미지, 텍스트 및 버튼을 상대적으로 안정적인 브라우저 화면(결국 모바일 앱 화면)에 배치하는 것이었습니다.

이것이 사람들에게 전달된 경험의 폭이었습니다. 그러나 이제 설계자는 제품이 다른 부품과 상호 작용하고 정보를 교환하며 때로는 다른 부품 뒤에서 사라지는 복잡한 구성 요소 시스템 내에서 별도의 엔터티로 존재한다는 점을 고려해야 합니다.

Intercom의 Paul Adams는 자신의 작품에서 우리가 알고 있는 앱의 끝은 " 다양한 화면과 장치가 있는 세상에서 콘텐츠는 화면 크기나 기술에 구애받지 않고 작동할 수 있도록 원자 단위로 분해되어야 합니다. 플랫폼. "

그리고 이것은 단순한 콘텐츠 이상입니다. 오늘날 디자이너는 사람들에게 제공되는 모든 기능이나 서비스가 여러 시스템 및 플랫폼의 다른 구성 요소 내에 존재하고 협력하는 방법을 고려해야 합니다.

사람들은 미래에 정보와 어떻게 상호작용할까요?

모바일 혁명 초기에 디자이너들은 웹사이트와 유사한 경험을 제공하는 앱을 만드는 데 중점을 두었습니다. 사람들이 콘텐츠를 소비하거나 작업을 수행하기 위해 상호 작용한 후 종료되는 잘 설계되고 제어된 박스형 환경입니다.

대부분의 상호 작용은 화면의 범위 내에서 발생했으며 디자이너는 전달을 잘 제어할 수 있었습니다.

그러나 모바일 장치의 범위는 화면 기반 미니 컴퓨터에서 손목에 맬 수 있는 메시지 센터 및 가정용 온도 조절기를 원격으로 제어하는 ​​장치에 이르기까지 폭발적으로 증가했습니다. 오늘날 사람들은 알림 및 경고를 통해 전달되는 여러 소스에서 분리된 정보 스니펫을 받습니다. 패러다임이 극적으로 바뀌었습니다.

미래의 UI는 어떤 모습일까요?

다양하고 상호 연결된 기술의 확산은 또한 단일 제품이 다른 컨텍스트에서 다르게 경험되고 상호 작용할 것임을 의미했습니다.

사람이 회의에 가는 동안 메시지에 대한 경고가 스마트워치에 나타날 수 있습니다.

메시징 앱을 찾아서 열지 않고 사용자는 알림 내에서 응답하고 탭 한 번으로 미리 작성된 빠른 답장을 보내고 나중에 다른 장치에서 더 깊이 있는 메시지에 참여할 수 있습니다.

이것이 의미하는 바는 상호 작용의 마이크로 구성 요소인 원자 단위가 커뮤니케이션 컨텍스트에 맞게 조정된 다양한 UI(및 사용자 경험)를 통해 전달되어야 한다는 것입니다.

사용자가 조깅하는 동안 긴 형식의 이메일 답장을 작성하지 않을 가능성이 있습니다. 그들은 웨어러블에서 매우 편리한 원터치 응답을 사용하기 위한 유일한 목적으로 노트북을 열지 않을 것입니다. 그들은 화면의 알림을 읽지 않을 수도 있지만 대신 음성으로 활성화되는 가상 비서의 내용을 듣습니다.

Paul Adams는 " 알림이 그 자체로 완전한 경험인 세상에서 앱 아이콘의 화면은 점점 더 의미가 없어집니다. 목적지로서의 앱은 점점 의미가 없어집니다. TripIt과 같은 여행 애플리케이션이 한 번에 모든 정보를 표시하고 사전 탑승 수속을 완료할 수 있는 경우 일련의 공급업체 앱에서 여러 목적지 항공편 및 호텔에 대해 별도의 앱을 여는 이유는 무엇입니까? 어떤 경우에는 앱 화면에 대한 필요성이 몇 년 안에 존재하지 않을 것입니다. 이차 탐색으로 기기 UI 깊숙이 묻히는 것 외에는 말이죠. "

시스템 수준의 대화형 알림을 사용하면 사람들이 한 컨텍스트에서 다른 컨텍스트로 갑자기 끌려가는 앱을 열기 위해 알림을 게이트웨이로 사용할 필요 없이 즉시 조치를 취할 수 있습니다.

상호 작용 패러다임의 변화는 미래 UI를 변화시킵니다.

인기 있는 WeChat과 같은 앱을 사용하면 송금, 택시 호출, 도착 시간 업데이트 수신, 레스토랑 검색 및 테이블 예약, 근처 호텔 찾기 등의 모든 작업을 텍스트 기반 인터페이스를 통해 수행할 수 있습니다. 사용자가 일련의 작업을 수행하기 위해 개별 앱으로 이동해야 합니다.

UI의 미래에서? Old School Text Messages, Kyle Vanhemert는 그래픽 사용자 인터페이스의 필요성을 자주 대체하는 텍스트 기반 플랫폼의 확산에 주목합니다. 앱이 제공하는 서비스는 앱 외부에서 점점 더 많이 액세스될 것입니다.

IoT의 세계를 위한 디자인은 인터페이스에 대한 더 많은 제어를 포기하는 것을 의미합니다. 즉, 화면을 통해 전혀 액세스할 수 없는 제품과 서비스를 만드는 것입니다.

터치 기반 화면이 모바일 장치에 혁명을 일으켰을 때 디자이너는 스와이프, 핀치, 탭, 더블 탭, 롱 탭, 탭-앤-드래그와 같이 활용할 수 있는 새로운 상호 작용 모드의 보고를 갑자기 갖게 되었습니다. -앤-클릭.

이제 사람들은 표준 시각 신호로 명시적으로 안내할 수 없는 센서가 장착된 장치 앞에서 허공을 휘젓거나 꼬집거나 태그가 달린 액세서리를 흔들고 있습니다. 이제 디자이너는 무엇을 해야 할까요?

어떤 의미에서 이것은 예측 가능하고 재사용 가능한 상호 작용 패턴을 설계하는 것을 의미합니다.

이것은 제품 구현 방식을 어떻게 변경합니까?

디자인의 단위로서의 모바일 앱은 적어도 지금까지 살펴본 방식으로는 사라지고 있습니다.

독립형 애플리케이션은 사람들이 제품이 제공하는 콘텐츠와 서비스를 받는 2차 또는 3차 목적지가 되고 있습니다. 디자이너는 사람들의 요구를 가장 잘 충족시키기 위해 접근 방식을 어떻게 재정렬할 수 있습니까?

픽셀을 덜 디자인하고 약간의 콘텐츠와 상호작용의 순간을 위해 더 많이 디자인하는 것이 새로운 패러다임입니다.

사용 가능한 정보의 양이 기하급수적으로 증가하고 경쟁 서비스의 수가 기하급수적으로 증가하는 세상에서 영향력을 미치는 가장 좋은 방법은 다양한 플랫폼과 컨텍스트에서 양질의 정보를 공유하고 배포하는 것입니다.

이것이 의미하는 바는 이상적으로 사람들이 종종 여러 래퍼 내에서 정확하게 제어할 수 없는 방식으로 콘텐츠를 수신한다는 것입니다.

디자이너들은 스스로에게 완전히 새로운 질문을 던질 것입니다.

• 뷰포트 배열과 화면 최소형 장치에 맞게 콘텐츠 형식을 지정하려면 어떻게 해야 합니까?
• 다른 곳에 존재할 수 있는 서비스의 핵심 기능을 패키징하는 방법이 있습니까?
• 알림 내에서 수행할 작업으로 제공할 수 있는 가장 적절하고 유용한 상호 작용 패턴은 무엇입니까?

사람들이 모바일 앱과 같은 대상 내에서 보내는 시간이 줄어들면서 디자이너는 다른 곳에서 상호 작용하고 완성할 수 있는 경험을 어떻게 만들 수 있습니까?

다가오는 캘린더 이벤트에 대한 푸시 알림을 통해 사용자가 앱 자체를 열지 않고도 항공편 예약, 여행 제안 또는 꽃 주문을 위한 일련의 표준 컨트롤을 제공할 수 있습니까?

디자이너는 다른 앱과 함께 작동하여 사람들에게 특정 서비스를 제공하면서도 경쟁을 능가할 만큼 매력적인 앱 기능을 어떻게 만들 수 있습니까?

미래의 디자인 프로세스는 어떤 모습일까요?

경험의 순간이 비선형 방식으로 장치에서 장치로 이동하고 구성 요소 가 디자인의 새로운 단위가 됨에 따라 디자이너의 실행의 새로운 대상은 어떻게 정의됩니까? UI가 아닌 경험을 디자인하는 것이 점점 더 중요해질 것입니다.

문제의 구성 요소 는 각 경우에 다르게 정의되며 모든 제품에 대해 서로 다른 의미를 갖습니다. 디자이너가 제품을 깔끔하게 포장된 대상이 아니라 시스템 구성 요소 로 생각할 때 도움이 될 수 있는 몇 가지 예를 살펴보겠습니다.

사람들은 어떤 상황에서 알림을 받게 됩니까?

간단한 패턴으로 알림부터 시작하겠습니다.

여러 장치에 걸쳐 울려 퍼지고 렌트카의 위치, 예상 도착 시간 및 지연에 대한 풍부한 푸시 알림을 통해 사람들에게 알리는 차량 호출 서비스 앱(Lyft 또는 Uber와 유사)을 위한 디자인을 상상해 보십시오. 이 시나리오에서 사용자는 iPhone, Apple Watch 및 이어폰을 귀에 꽂았습니다.

첫째, 사용자는 Apple Watch에서 음성 상호 작용을 통해 자동차를 주문합니다. 그는 손목을 들어 시계를 깨우고 Siri에게 차를 요청하고 이어폰을 통해 차가 오는 중이라는 음성 확인을 받습니다.

사람들이 앱을 열고 화면을 지속적으로 모니터링할 가능성은 거의 없습니다. 따라서 알림은 연결된 장치를 통해 운영 체제와 사용자에게 푸시되도록 패키징해야 합니다.

몇 분 후 그는 iPhone을 확인하여 지도에서 자동차의 위치와 대기 시간을 확인합니다. 차가 불과 1분 거리에 있을 때 앱은 그의 이어폰에 음성 알림을 보내고 그의 Apple Watch에 진동 알림을 보냅니다. 그는 차와 운전자의 정보를 확인하기 위해 iPhone을 힐끔힐끔 쳐다본다.

이 앱은 운영 체제 내의 구성 요소처럼 보입니다.

사람들이 우리 앱을 열지 않는다면 우리는 무엇을 디자인하고 있습니까?

구성 요소 는 운영 체제와 상호 작용할 뿐만 아니라 다른 앱으로 가져올 수도 있습니다.

예를 들어, 사용자에게 지연의 영향을 받을 수 있는 여행 일정이 있는 시나리오에서 TripIt과 같은 여행 앱은 사용자가 앱 자체를 열지 않고도 상호 작용할 수 있는 풍부한 푸시 알림을 관리할 수 있습니다.

여행 앱에 일정을 공유하는 다른 사람들이 있는 경우 지연 시 공항에서 대기 중인 친구에게 업데이트된 ETA를 보낼 수 있는 옵션을 사용자에게 제공하도록 알림을 설계할 수 있습니다.

모바일 장치의 알림 구성 요소는 여행 앱의 알림 시스템과 병합되고 사용자의 작업은 다시 연쇄적으로 연결되며 사용자가 열 필요 없이 여행 앱의 상태가 변경됩니다.

이 단계를 더 진행하여 VUI를 통해 음성 도우미를 포함하는 경우 화면 기반 상호 작용을 예상할 수 없는 경우 알림 및 작업을 어떻게 패키징하고 전달할 수 있습니까?

앱은 다른 유기체와 인터페이스하고 그에 따라 적응해야 하는 대규모 생태계에서 유기체가 되고 있습니다.

디자인의 UX 구성 요소는 미래 UI에서 재정의되었습니다.

웹 페이지 또는 샌드박스 애플리케이션과 같은 대상 대상의 디자인 단위는 서로 및 사람과 상호 작용하는 시스템 구성 요소로 재정의되고 있습니다.

많은 경우 이러한 상호 작용은 거의 눈에 띄지 않게 발생합니다. 개념으로서의 앱이 제거되지는 않지만 더 이상 주요 이벤트나 대상이 아닙니다.

디자이너는 다양한 생태계에서 번창할 수 있도록 적응하는 제품과 서비스를 만들기 위해 진화하고, 중심을 잡고, 초점을 재조정해야 합니다. 미래의 UI는 예측할 수 없는 상황과 장치에 걸쳐 확산될 것이며 확장되는 주변 인텔리전스 세계에서 디자이너가 고려해야 할 사항이 많습니다.

• • •

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

• 웹 양식의 끝
• 버튼이 없는 미래의 UI 디자인
• 세상은 우리의 인터페이스입니다 – UI 디자인의 진화
• 사물 인터넷을 위한 즐거운 경험을 디자인하는 방법
• 터치의 힘 – 버튼 디자인의 진화(인포그래픽 포함)