디지털화의 끊임없는 성장은 지금에 머물러 있으며 2019년은 그다지 다르지 않을 것입니다. 올해는 사용자의 관심을 끌고 기업의 경쟁력 유지에 도움이 되는 몇 가지 웹 사이트 디자인 트렌드가 예상됩니다. 예전처럼 미학과 기술의 통합이 더 커질 것입니다.

2019년을 정의할 웹 디자인 트렌드(Web Design Trends)에 대해 알아보겠습니다.

망가진 그리드와 비대칭 레이아웃(Broken grids and asymmetrical layouts)

그리드 기반 디자인이 지금까지 룰이 되어 자리를 지키고 있었다면, 2019년의 웹 디자인은 박스 외부를 바라보고 경계를 넓히는 것에 관한 될 것입니다. 즉, 웹 디자이너는 비대칭 패턴을 배치하여 표준 템플릿에서 벗어나려고 합니다. 여기에는 특이한 게재 위치, 텍스처, 색상 및 공백이 있는 레이어 추가, 타이포그래피를 사용하여 깊이감을 느낄 수 있습니다. 이러한 시각적 계층 구조 및 동적 이미지의 혁신적인 사용은 사용자의 주의를 더 효과적으로 유도하는데 도움이 됩니다.

CSS3 애니메이션(CSS3 Animations)

배경 비디오, 스크롤링 효과, 마이크로 인터렉션 및 모션 그래픽과 같은 기능으로 구성된 CSS 애니메이션을 사용하면 더 나은 사용자 경험을 얻을 수 있습니다. 이러한 애니메이션은 JavaScript 기반 애니메이션과 달리 렌더링 하는 동안 품질이 떨어지거나 가벼워지지 않습니다.

유동적 또는 유기적 디자인(Fluid or organic design)

웹 사이트 디자인의 일부로 평면 디자인이 곤란한 걸까요? 그러나 추세는 그리드에서 벗어나 디자인에서 유동성 요소를 주입하는 쪽으로 나아갑니다. 이것은 정확히 기하학적 또는 정밀하지 않은 직사각형이나 직사각형, 삼각형, 원형 등의 유기적인 모양이나 선을 결합하여 이루어집니다. 유동적인 디자인은 언덕, 호수, 찢어진 종이 조각 등을 구체화하기 때문에 더욱 현실적이고 친근하게 보입니다. 2019년에는 인간 본성에 더 가깝고 더 매력적인 유기적 형태의 사용이 증가할 것입니다.

고상한 이미지(Elevated images)

웹 사이트 디자인 전문가는 사용자의 관심을 끌기 위해 다양한 기술을 사용하여 이미지 디자인을 실험해 왔습니다. 여기에는 이미지 뒤에 그림자를 추가하거나, 원, 사각형 등의 기하학적 패턴 안에 그림자를 넣거나 세피아 색조의 객체로 바꾸는 작업이 포함됩니다. 올해에는 사용자의 주의를 끌거나 그리는 이미지 처리를 볼 것입니다. 이미지를 향상하거나 상승하는 새로운 기술은 패턴을 상단에 추가하거나 이미지를 단색으로 바꿀 수 있습니다.

패럴랙스(Parallax)

이 기법은 배경 이미지가 전경에서 느리게 움직일 때 깊이의 환상을 만듭니다. 무거운 3D 그래픽은 웹 사이트 로딩 속도를 늦추므로 패럴랙스는 2D 환경에서 사용자에게 가상의 몰입감을 제공할 수 있습니다. 이 기술은 웹 사이트 디자인 서비스를 통해 제품 또는 서비스에 대한 사용자의 주의를 높이고 페이지에서 더 오랫동안 머물도록 권장할 수 있습니다.

마이크로 인터렉션(Micro interactions)

사이트를 탐색할 때 작은 행동이나 응답의 형태로 놀라움 두 개를 제공하면 사용자 경험이 향상됩니다. 이것은 마이크로 상호 작용이 웹 디자인의 일부로서 중요한 역할을 할 수 있는 곳입니다. 이러한 이벤트는 사용자를 놀라게 하고 참여시키기 위해 의도된 것으로, 사용자 상호 작용에 의해 생성되거나 트리거 되는 두 가지 유형으로 분류할 수 있습니다. 예를 들어 Twitter에서 페이지를 새로 고침 하거나 메시지 수를 보여주는 Facebook에서 빨간색 아이콘을 볼 때 경고음이 들리면 소프트웨어에서 생성된 마이크로 인터렉션이 발생합니다.

다른 한편, 사용자 상호 작용의 결과로 텍스처, 색상, 명암 또는 디자인과 관련하여 디지털 요소의 배경에서 미묘한 변화를 볼 때 마이크로 인터렉션은 사용자에 의해 시작된다고 합니다. 예를 들어, 포털에서 가입하는 동안 사용자가 비밀번호 열을 채우면 강도 필드가 빨간색에서 녹색으로 점차 바뀌어 사용자에게 비밀번호의 강점을 알립니다. 마이크로 인터렉션은 스크롤 애니메이션, 차임(chimes) 등과 같은 여러 형태로 볼 수 있으며 페이지에서 수행한 특정 작업에 대해 사용자에게 미묘한 메시지를 전달합니다.

머트리얼 디자인(Material design)

Google에서 개발한 머트리얼 디자인(Material Design)은 표준 UI 위젯, 맞춤 그림자(Custom Shadow), 애니메이션, 고상한 카드 레이아웃, Vector Drawable 및 버튼을 사용하여 몰입형 사용자 환경을 만드는 데 도움이 됩니다. 이 특정 유형의 웹 사이트 디자인은 평평하고 가벼운 객체를 사용하고 사용자 상호 작용을 크게 개선합니다.

색상의 부재(The absence of colour)

색상의 상호 작용이 웹 사이트의 미학에 더해지지만, 같은 색상이 없으면 웹 사이트가 뚜렷한 관심을 끌 수 있습니다. 대부분의 웹 사이트에 색상이 풍부한 디자인 요소가 있는 경우 단색으로 사이트를 전환하면 눈에 띄고 기억에 남을 수 있습니다. 올해는 웹 사이트를 눈에 띄게 만들기 위해 색상의 사용량이 적을 (주로 중립적인 - 검정, 흰색 및 회색) 것으로 예상됩니다.

풍부한 공백 사용(Abundant use of white spaces)

오랜 기간 동안 유행했음에도 불구하고 2019년 웹 사이트 디자인은 공백이 많이 사용되는 것을 볼 수 있습니다. 이렇게 하면 콘텐츠가 아닌 시청자를 위한 포커스 영역이 됩니다. 눈을 쉬게 하고 디자인을 뚜렷하고 주목할 가치가 있는 쌍을 이루는 대상과 대조로 사용하는 것이 더 좋습니다. 따라서 이전에 공백이 '공간 낭비'로 여겨졌으나 2019년은 레이아웃에 이러한 가치를 더할 것입니다.

결론(Conclusion)

2019년은 평면 디자인(Flat Design)과 같은 트렌드의 지속을 볼 수 있지만 깨진 그리드, 유기적 디자인, 마이크로 인터렉션 등과 같은 더 많은 디자인 요소를 통합할 것입니다. 날이 갈수록 경쟁이 치열해지면서 비즈니스는 트렌디하고 매력적이며 사용자 친화적인 온라인 존재여야 합니다. 이것을  달성하려면 2019년 웹 사이트 디자인 트렌드를 내부 조직 또는 경험이 풍부한 웹 사이트 디자인 회사에 참여로 통합시키는 것이 좋습니다.

이 글은 WEBGRRU blog에서 발행한 'What Are The Top Web Design Trends of 2019?' 글이 유익하여 웹 디자인 트렌드 공유 차원에서 공유하고자 번역. 정리한 것입니다. 다소 오역된 부분이 있으면 댓글을 남겨 주시길 바랍니다.

출처: https://www.designlog.org/2512696?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+DesignlogOfMaru+(DESIGN+LOG+-+Design+%26+Digital+Convergence+Webzine) [디자인 로그(DESIGN LOG)]