본문 바로가기

Web + Mobile

2017년 웹 디자인 트렌드 전망과 예측

저무는 해와 다가올 해를 바라볼 있는 시간인 같습니다. 우리는 다양하고 멋진 웹사이트 디자인을 보았습니다. 2017년은 어떤 디자인이 나올지 벌써부터 궁금합니다. 2017 디자인을 지배하게 가지 트렌드를 알아보도록 하겠습니다. 





콘텐츠 우선주의



사이드바, 헤더, 배너 광고, 사이드바 광고, 클릭 유도 문안, 댓글, 팝업, 소셜 미디어 버튼, 가입 상자 등과 같은 것들을 우리 사이트에 추가하는 수년을 소비했습니다. 이러한 모든 일이 우리 사이트를 혼란스럽게 만들고 콘텐츠 영역을 점차 잠식해 가면서 페이지의 전체적인 포트인 '콘텐츠'로부터 주의를 빼앗아 갔습니다. 


2017년에는 사이트가 기본으로 돌아가고 콘텐츠에 중점을 두기 시작할 것입니다. 그것이 우리가 수년간 소비하며 쌓아올린 산만함을 모두 없애거나 단순히 영역을 적게 사용한다는 것을 의미하는지의 여부는 아직 없으나, 사이트의 핵심인 콘텐츠로 돌아가는 것이 앞으로 널리 보급될 것입니다. 



플랫 디자인의 종말



우리는 이제 모든 것이 똑같아 보이는 플랫 디자인의 요점에 도달했다고 생각합니다. 디자인에서 개인의 성격과 창의력을 잃어버렸습니다. 내가 가진 것이 다른 사람이 가진 것과 같은, 서로가 그저 똑같기만 한 것입니다. 


필자의 관점에서 볼 때, 플랫 디자인은 모던하게 발전된 스큐어모피즘 디자인에서 모든 사람들이 적용할 수 있는 디자인 미학 세트(구글의 머터리얼)로 바뀌었습니다. 이 때문에 사이트는 동일하게 보이기 시작했고, 사이트마다 큰 차별점을 찾아볼 수 없었습니다. 


디자이너는 독창성이 사라졌다고 느끼고, 다시 창의적이며 독특한 스타일의 레이아웃과 디자인을 만들어내기 시작하면서 플랫 디자인은 사라질 것입니다.   



기하학적인 도형, 선, 패턴



기하학적인 도형, 선 및 패턴의 사용이 2016년 후반에 실제로 보이고 있으며, 2017년까지 계속될 것으로 예상됩니다. 기하학적인 모양이 웹 사이트로 들어갈 수 있는 방식은 다양합니다. 이미지 주위의 원, 기하학적 무게감을 실은 사진 또는 전반적인 사이트의 디자인을 선이나 패턴의 사용에 크게 의존하는 것 등이 있을 수 있습니다. 


웹 사이트에 기하학적 모양, 선 및 패턴을 통합하는 방법은 거의 무한하다고 볼 수 있습니다. 이는 디자이너가 빡빡한 느낌의 디자인을 새로운 차원으로 끌어들이는 방식일 수 있습니다 (위에서 언급한 것처럼 일부 특성을 추가할 수도 있습니다). 전반적으로 2017년 내내 이러한 유형의 디자인 스타일을 더 많이 볼 것으로 예상됩니다.





창의적인 제목 스타일



웹사이트에서 현재 있는 기본적인 제목 스타일(산세리프, 대문자, 가운데에 위치한 제목)에서 벗어나 상상력 있고 창의적인 제목 스타일로 이동하기 시작했습니다. 제목 스타일을 변경하면 디자인에서 독창적인 때문에 환영받을 있습니다. 


제목의 레이아웃을 변경하거나, 독특한 요소를 추가하거나, 심지어 제목을 없애는 (최소한 어보브더폴드above the fold - 사용자가 스크롤 하지 않고 있는 최소한의 화면 영역 - 까지만이라도) 이러한 모든 방법을 가지고 디자이너는 사이트의 일반적인 제목 스타일을 변경하는 실험을 시작하고 있습니다.



이중 그라디언트 이미지



브랜드에 대한 많은 관심이 추구되면서 많은 브랜드는 사이트에 이중 이미지와 그래픽을 사용하고 있습니다. 


완벽한 이중 톤은 아니지만 일부 디자인은 2-3가지 색상으로 실험하고 이중 효과를 사용합니다. 인스타그램Instagram 생각해보세요. 플랫 디자인으로 도움으로 (대부분의) 그라디언트를 제거하였지만, 가지 색상을 결합한 이중 이미지를 사용하면 낡고 진부한 그라디언트 단색 영역을 멋지게 업데이트 있다고 보여집니다.



애니메이션 GIF 사용 증가



애니메이션은 사이트에서 점차 많이 사용되어지고 있습니다. 무언가가 어떻게 작동하는지, 어떻게 작동해야 하는지, 또는 의미있는 콘텐츠를 보여줄 있는 좋은 방법이기 때문입니다. GIF 이러한 목적으로 사용되었지만, 이제는 SVG CSS 사용하여 정교한 애니메이션과 독특한 디자인 요소를 완성해주고 있습니다. 


2017년에는 많은 콘텐츠 유형이 공유되고 애니메이션이 텍스트 비디오보다 쉽고 빠르게 의사소통을 도울 있기 때문에 애니메이션 사용이 확산될 것으로 예상됩니다. 또한 잘만 사용한다면 이미지나 비디오보다 훨씬 가벼울 있습니다.



내비게이션 다이어트



모바일 사회로서 대부분의 사람들이 컴퓨터보다 스마트폰을 통해 웹에 접속하기 때문에 상황을 쉽게 탐색하는 것에 맞춰 웹사이트의 내비게이션을 개선하려는 움직임이 전반적으로 일고 있습니다. 


점점 많은 사이트가 지나치게 복잡하고 길어진 탐색 대신 4-5 정도의 항목을 가진 내비게이션으로 단순화하기 시작했습니다. 탐색 기능을 최소한으로 유지하면 방문자가 페이지를 이탈하기 보단 방문 목적과 의도에 집중할 있습니다. 



마이크로인터랙션 



마이크로인터랙션Microinteractions 미묘하지만 사이트와 상호작용할 있는 강력한 방법입니다. 마이크로인터랙션은 주로 호버hover, 클릭 애니메이션, 스크롤링 효과 등에서 발견됩니다. 이러한 유형의 디자인 요소는 항상 보아왔지만, 사실 디자이너는 이러한 요소에 많은 시간을 보내고 효과적이고 세련되게 만들어내려 합니다. 


아마도 가장 많이 사용되는 통합은 마우스 호버/롤오버 것입니다. 사용자는 사이트의 일부분으로 커서를 이동하여 이러한 마이크로인터랙션을 확인하고, 그러한 방식으로 사이트와 상호작용할 있습니다.



손으로 그린 요소의 사용 증가 



아마도 디자인 트렌드의 다른 유형이라면 손으로 그린 요소의 사용 증가일 것입니다. 이러한 요소에는 폰트, 아이콘, 그래픽, 단추 기타 독특한 기법이 가미된 요소가 포함됩니다. 


사이트는 대부분이 그리기와 관련된 매체는 아니지만, 이러한 손으로 그려진 요소를 소개하고 표준 디자인 요소에 사용하여 좋은 변화를 가져 왔습니다. 



랜딩 페이지에 대한 강조와 페이지에 대한 중요성 감소

구글Google 콘텐츠를 개선하고 시장에 많이 출시하고 공유한다면, 2017년에는 홈페이지 디자인 대신 랜딩 페이지Landing Pages 디자인이 증가할 것입니다. 모든 사이트는 홈페이지가 필요하지만 콘텐츠 마케팅이 확산되면 마케팅 담당자는 트래픽을 전용 랜딩 페이지로 보내 방문자와 그들의 요구를 보다 효과적으로 타겟팅하고자 겁니다.


부분에는 일리가 있습니다: 콘텐츠 마케팅의 아이디어는 인지도와 전환율을 높이는 것이고, 사용자를 페이지에 강제적으로 오도록 하는 것보다 전환율을 늘리는 좋은 방법입니다. 랜딩 페이지는 사이트의 다른 페이지와 마찬가지로 설계되고 생각되어지지만, 방문객을 훨씬 많이 타겟팅합니다. 






원문: web design trends can expect see 2017


Refresh Studio

해외 최신 웹/모바일/UX 디자인 글과 동향을 소개해 드립니다.