2020 년을 형성 할 UI 트렌드

공상 과학과 비슷한 소리를 낼 수있는 질문을하겠습니다. 아마도 지구가 조금 늦게 움직였을 것입니다. 그러나 아직 눈치 채지 못했습니까? 어제 우리가 2018 년으로 이사 할 때 예상했던 것을 검토 한 것 같습니다. 그러나 이상하게도, 이미 거의 2019 년입니다!

그러나 2018 년은 UI 디자인에있어 XNUMX 년이 지났습니다. 최근에 경험했던 기하 급수적 성장 설계 도구 덕분에 이제는 이전과 비교해 훨씬 간단 해졌습니다. 더 이상 코딩 전문가가 아니어도 몇 분 안에 뛰어난 UI를 갖춘 전문적인 사이트를 만들 수 있습니다.

그리고 그것은 거의 기초를 덮지 않습니다. 사용자 환경 설정의 변경 사항은 2018 년 인터페이스 디자인 방식에 광범위하게 영향을 미쳤습니다.

원근법으로 인터넷 사용자의 94의 % 디자인이 좋지 않은 사이트에 대한 신뢰를 중단했습니다. 따라서 더 이상 타협 할 여지가 없습니다.

그런 다음 스크롤이 널리 채택되었으므로 사이트는 더 이상 가장 좋은 항목을 맨 위에 배치하지 않습니다. 인터페이스 내에서 비례 적으로 퍼질 수 있습니다. 그러나 다시, 우리는 고려할 때 방문객의 40 % 전체 레이아웃이 초라한 것으로 판명되면 떠나십시오.

그리고 그것이 그들이 싫어하는 전부는 아닙니다. 사용자는 또한 콘텐츠 슬라이더에 질리게되었습니다. 1 % 클릭 그들에. 흥미롭게도 콘텐츠를 제거함으로써 잘못된 행동이 될 수 있다는 점을 완화하는 것이 사이트 방문자의 86 % 홈페이지에 도착하자마자 중요한 제품 및 서비스 정보를보고 싶습니다.

매혹적인, 맞죠?

UI 디자인은 이처럼 흥미 진진한 적이 없습니다. 사용자는 변화하고 있으며 장치 기술은 천문학적으로 발전하고 있으며 인터넷 속도는 이제 포뮬러 1 수준이며 웹의 광범위한 디자인 도구가 뒷받침됩니다. 이 모든 것을 현대적인 UI 디자이너 스킬 셋과 결합하면 2019가 훨씬 더 영향력이 있다는 데 동의 할 것입니다.

그렇다면 어떤 트렌드를 기대하고 있습니까?

모바일 최초

모바일 최적화는 곧 폐기되지 않는 유행어입니다. 트렌드는 지금까지 몇 년 동안 지속되어 왔습니다. 2019 년에는 모바일 기반 UI 디자인의 채택이 증가 할 것으로 예상됩니다.

또한 해당 기술과는 별도로이 공간에서 적어도 12 개월 정도는 새로운 것이 없을 것이라고 가정 할 수도 있습니다. 충분히 공평하지만 이것을 얻으십시오…

당신은 지금 꽤 오랫동안, 우리는 모바일로 전환하기 전에 먼저 PC를 위해 같은 오래된 접근 방식을 사용하고 있습니다. 대부분의 트래픽은 PC 사용자들로부터 나왔기 때문에 후 향적으로 데스크탑 UI가 주요 초점이었습니다.

그런 다음 2016 년 말에 흥미로운 일이 발생했습니다. 모바일 트래픽은 궁극적으로 PC 트래픽을 능가했습니다. 그해 말까지 휴대 전화는 시장 점유율의 50.31 %태블릿은 4.9 %까지 추가되었습니다.

모바일 시장 점유율

그러나 그럼에도 불구하고 PC 사용자는 온라인으로 소비되는 누적 시간의 양을 앞서게 되었기 때문에 여전히 데스크톱 인터페이스에 우선 순위를 두었습니다. 예를 들어 북미에서는 2017 년 휴대 전화 서핑이 여전히 뒤쳐져 서 서핑 시간의 33 %.

서핑 시간

글쎄요, 우리 모두는 모바일이 궁극적으로 PC를 따라 잡기까지의 시간이라는 것을 알고있었습니다. 그리고 2018 년에는 모바일이 차지하면서 테이블이 완전히 바뀌 었습니다. 모든 글로벌 웹 페이지의 52.2 %.

트래픽 공유

이것은 UI에 무엇을 의미합니까?

우선 UI 디자인 접근 방식이 바뀔 것으로 예상됩니다. 개발자는 PC를 디자인하기 전에 먼저 모바일 UI에 중점을 두어 우선 순위를 변경하기 시작할 것입니다. 모바일 사용자는 PC 사용자보다 우선합니다.

그림자와 깊이의 사용

평면 UI 디자인에 이점이 있다는 것을 부인할 필요는 없습니다. 그러나 직면하자. 그들은 이제 너무 단조롭고 확실히 지루해졌습니다.

불행히도 결과적으로 번거로운 그래픽으로 인해 3D 디자인을 사용하는 것이 어려웠습니다. 예를 들어, 3D 인터페이스를 사용하여 웹 페이지를로드하면 일반적으로 평면 디자인을 사용하는 것보다 시간이 오래 걸렸습니다.

글쎄, 웹 브라우저가 실질적으로 향상되기 시작할 때까지. 다른 한편으로, 디자이너들은 그림자를 이용하여 깊이의 환영을 도입하는 뛰어난 기술을 개발했습니다.

그림자와 깊이

따라서 2019 년에는 다양한 3D 인터페이스 전망을 달성하기 위해 그림자 변형을 점진적으로 사용할 것으로 예상됩니다.

예를 들어 특정 요소에주의를 기울이려는 디자이너는 다양한 정도의 부드러움과 강도로 거짓 그림자를 만들 수 있습니다. 최종 결과는 나머지를 3D로 가리킬 수있는 요소입니다.

또 다른 인기있는 기술은 패턴에 그림자를 배치하여 다양한 수준의 텍스처를 생성 한 다음 인터페이스 요소에 생명을 불어 넣는 것입니다.

그럼 어쩌 겠어요? UI 디자인 도구의 최근 발전으로 이러한 디자인 방식과 함께 제공되는 역학이 더욱 확장되었습니다. 그림자를 그리드 및 시차 레이아웃과 쉽게 결합하여 해당 깊이를 체계적으로 확장하여보다 사실적인 3D 환상을 얻을 수 있습니다.

다시 말해, 고급 그림자 사용은 2D 디스플레이에서 더욱 세련된 깊이를 계속 달성 할 것입니다. 또한 특별한 3D 화면이 필요하지 않습니다.

미니멀리즘

적어도 2000 년 연구에 따르면 인간의 평균 관심 범위는 XNUMX 년입니다. Microsoft12 초였습니다. 그럼 어쩌 겠어요? 2015 년에는 표준 금붕어보다 놀랍게도 8 초로 짧아졌습니다.

글쎄, 우리가 더 나빠질 수 없다고 생각했을 때, 인터넷은 사람들을 더 조급하게 만들었습니다. 사이트 방문자의 47 % 이제 2 초 이내에 페이지가로드 될 것으로 예상합니다. 그들은 단순히 더 이상 기다릴 수 없습니다. 실제로 40 초 이상 걸리면 3 %가 떠납니다.

놀랍게도 많은 웹 디자이너들은 이것을 심각하게 받아들이지 않았습니다. 현재 평균 페이지 로딩 속도는 8.66 초입니다– 3 년 Google의 2018 초 미만 권장 사항에도 불구하고.

페이지로드 시간

그리고 그게 전부가 아닙니다. 모바일 사이트의 경우 상황이 상당히 나빠졌습니다. 평균 22 초 로드합니다. 그러나 유감스럽게도 모바일 페이지 방문자의 53 %가 XNUMX 초 이상 매달리지 않습니다.

그러나 이것이 UI와 어떤 관련이 있습니까?

페이지 로딩 속도는 일반적으로 몇 가지 요소에 의해 결정되지만 사용자 인터페이스의 전체 디자인은 특히 매우 중요합니다. 그것이 연쇄 반응이 시작되는 곳입니다.

2019 년에 이것이 무엇을 의미합니까?

음, 구글의 속도 업데이트 2018 년 XNUMX 월은 로딩 속도를 크게 떨어 뜨리는 복잡한 그래픽이 많은 UI의 끝이 시작되었습니다. 우리는 이제 훨씬 더 빠르게로드되는 잘 간소화 된 최소한의 UI로 전환하고 있습니다.

본질적으로, 미니멀리즘은 단순성, 편의성 및 기능성 사이의 이상적인 균형을 달성하는 것을 수반합니다. 이를 통해 전체 속도와 검색 엔진 순위를 향상시킬뿐만 아니라 해당 트래픽 이탈률을 줄일 수 있습니다.

겹치는 효과

현대적인 그래픽 디자인 시대에는 여러 레이어를 결합하고 공간감을 조성하며 가장 중요한 인터페이스를 더욱 매력적으로 만들기 위해 겹치는 효과가 도입되었습니다.

하지만 기다려 처음에 겹치는 효과는 무엇입니까?

일반적으로 이미지, 텍스트 및 색상과 같은 요소를 서로 멋지게 겹치게 배치해야합니다. 이미 여러 웹 사이트에서 그래픽이 겹치는 것을 보았습니다.

겹치는 효과

글쎄, 지난 몇 년 동안 디자인 트렌드가 상당히 개선되고 있습니다. 그러나 현대 장치는 이제 훨씬 더 나은 색상 그라디언트 재현 기능을 제공하므로 2019는 PC와 모바일 UI 모두에서 겹치는 효과를 광범위하게 채택 할 것으로 예상됩니다.

예를 들어 삼성 모바일은 LCD 디스플레이에서 훨씬 발전된 OLED 기술 7 년 전에 Galaxy SXNUMX을 출시했을 때 그런 다음 Apple은 iPhone X와 함께 밴드 웨이 건에 합류했으며 이제 LCD 이전 모델보다 디스플레이 대비가 더 큽니다. 회사는 이것을 유지하는 계획 2019 년으로 예정된 모든 iPhone 모델에서.

그리고 누가 가장 많은 혜택을 볼 수 있습니까?

예상 한대로 그래픽 디자인 세계에서는이 기능을 활용하여보다 자연스럽고 선명하고 또렷한 그라디언트와 겹치는 부분을 만듭니다. 우리는 OLED 디스플레이가 겹치는 요소로 인해 가장 큰 문제를 실질적으로 완화시키는 방법을 좋아합니다.

이 추세는 또한 UI 디자인의 투명성 개발을 유발할 것입니다. 디자이너가 의도 한 강조를 방해하지 않으면 서 기본 그래픽과 보조 그래픽을 동시에 가져올 수 있도록 투명성을 활용하면서 UI에서 "유리 같은"텍스처의 사용이 증가 할 것입니다.

프레임리스 디자인

그리고 오늘날에도 여전히 현대적인 기기에서는 오늘날 전체적인 외장 디자인에서 가장 뛰어난 점을 발견했습니다. 아니요, 저는 그들이 거의 모든 표면에서 유리를 어떻게 과도하게 사용하는지에 대해 이야기하지 않습니다.

좋아, 나는 그것과 관련이 있다고 인정한다. 이상한 이유로, 이제는 모두가 디스플레이 프레임을 싫어하는 것 같습니다. 주요 스마트 폰 및 TV 화면 제조업체는 디스플레이 개요와 해당 장치 가장자리 사이의 공간을 점차 줄입니다. 그런 다음 모양을 완성하기 위해 둥근 모양의 장치 가장자리와 결합합니다.

삼성은 일부 스마트 폰 화면을 가장자리로 확장하여 가장자리 프레임을 완전히 없애기까지했습니다. 반면에 애플은 전체 아이폰의 얼굴을 디스플레이 화면으로 가리기로 결정했다.

무테 가장자리

그것을 생각해 보면, 그것은 그것이 무한한 환영과 관련이 있다고 생각합니다. 화면을 자연 환경의 일부처럼 보이게 만들어야 할 필요가 있습니다. 솔직히 말해서, 디스플레이가 더 몰입감을 찾는 사용자에게는 꽤 잘 작동합니다.

놀랍지 않게도 이러한 추세는 앱 산업에 퍼져 나갔습니다. UI가 프레임 외곽선에서 둥근 모서리와 결합 된 부드러운 선으로 점차 이동하고 있습니다. 결과적으로 인터페이스가 장치 화면과 원활하게 통합되어 전체 화면 프레임리스 전망이 만들어졌습니다.

장치 제조업체가 2019 년에도 이러한 추세를 계속함에 따라 UI는 부드럽고 둥근 프레임리스 디자인을 위해 이전 세대의 날카로운 가장자리를 점진적으로 떨어 뜨릴 것으로 예상합니다.

마이크로 애니메이션

그들은 미묘하고 때로는 중요하지 않은 것처럼 보일 수 있습니다. 그러나 단순한 진실은 UI의이 마이크로 애니메이션이 사용자가 탐색 할 때 참여하고 돕는 데 매우 강력한 것으로 입증되었습니다.

스크롤하거나 클릭 할 때 색상이 변하는 버튼을 보셨습니까? 포인터가 표시되는 즉시 추가 옵션을 표시하기 위해 팝업되는 메뉴 레이아웃도 있습니다. 글쎄, 그들은 모두 사용자 경험을 풍부하게하기 위해 작은 시각 효과를 만드는 마이크로 애니메이션의 예입니다.

마이크로 애니메이션

움직이는 요소가 특히 주목을 끄는 데 효과적이기 때문에 많은 설계자들은 이미 다양한 요소를 활용하여 사용자를 다양한 변환 지점으로 유도하고 있습니다. 이 추세는 지금까지 널리 퍼져 있기 때문에 아직 어떤 형태의 마이크로 애니메이션을 구현하지 않은 XNUMX 개 이상의 사이트를 찾을 수없는 재산을 기꺼이 내기를 원합니다.

그럼 가져와 모든 주요 웹 브라우저는 현재 PC와 모바일 모두에서 만족스럽게 마이크로 애니메이션을 지원합니다. 2019 년이 다가 오면서 UI가 체계적으로 구성된 시각적 계층 구조와 함께 제공 될 것으로 기대합니다.

결론

우리는 가장 주목할만한 트렌드 중 일부만 다루었습니다. 우리는 시간이 지남에 따라 더 흥미로운 것들을 보게 될 것입니다 .2019 년이 공을 굴릴 때까지 기다릴 수 없습니다.

즉, 가장 영향력있는 UI 디자인 트렌드가 무엇이라고 생각하십니까? 그리고이 목록에 어떤 주목할만한 트렌드를 추가 하시겠습니까?

헤더 이미지 제공 왈 리드 베노

보그 단 란 세아

Bogdan은 Inspired Mag의 창립 멤버로서이 기간 동안 거의 6 년의 경험을 축적했습니다. 여가 시간에는 클래식 음악을 공부하고 시각 예술을 탐구하는 것을 좋아합니다. 그는 또한 수정 프로그램에 상당히 집착하고 있습니다. 그는 이미 5를 소유하고 있습니다.