[디자인] 2017 디자인 트렌드

[ 디자인 ] 2017 디자인 트렌드

- 2017 디자인 트렌트 톱 10

출처 : https://theblog.adobe.com/the-future-is-now-10-design-predictions-for-2017/

개발자는 개발을 잘 해야 하는것은 당연한 일입니다.

하지만 좋은 개발자는 디자인 트렌드도 읽어 낼 줄 알아야 한다고 생각합니다.

디자인 영역에서는 전문성이 아직 부족하지만, 계속해서 배워가자는 마음가짐 입니다.

어도비 사이트에서 소개된 2017 디자인 트렌드를 되짚어 봅니다.

1. 미니멀한 디자인의 진화

- 복잡성을 최소한 디자인

- 명확한 시각적 커뮤니케이션

- 간결한 라인, 넉넉한 여백, 미니멀한 그래픽 요소

한국적 정서는 아직도 꽉 차보이는, 게시판 위주의 웹 페이지들을 좋아합니다.

하지만 대세는 변하고 있습니다. 심플하고 또한 여백을 강조하고 있습니다.

개인적으로는 '닌텐도 스위치' 홈페이지를 보고 충격을 받은 적이 있기도 합니다.

더불어 '원페이지 사이트'에 대한 사용도 점점 늘어나는거 같습니다.

2. 마이크로인터랙션의 증가

- 마이크로인터렉션은 상태 및 변경 사항에 대한 정보를 전달하고 특정 영역에 주의를 집중시키며 해당 동작을 완료하는데 필요한 피드백을 제공하는 등 사용자의 기억에 남을 만한 경험을 만드는 데 기여합니다.

사용자 행동에 대한 시각적 피드백을 전달하는 매우 간편한 형태, 마이크로인터랙션은

액션이 시작되게 해주는 트리거 / 발생하는 조건을 미리 정한 룰 / 

트리거로 인해 룰에 따라 성공적으로 동작하고 있음을 보여 주는 피드백 /

길이를 정하는 루프, 유저가 프로세스를 지속할 수 있도록 도와주는 모드 

이상 4가지 기본요소를 갖추고 있다고 합니다.

유저가 계속 작업하도록 동기부여를 하고, 직관적인 요소와 힌트를 주어 안내를 간소화 합니다.

오늘날의 디자인은 그 어느때보다 인간중심적이기 때문에

디바이스가 인간 친화적인 방식으로 작동하게 해주는 인터렉션을 요구한다고 합니다.

3. 동영상이 대세로 등극

- 동영상은 사용자의 이목을 끄는 능력이 탁월하므로 시각적 스토리텔링의 도구로 사용됩니다.

특히 동영상이 홈페이지 배경으로 사용 된 경우 처음부터 사용자의 이목을 집중시킵니다.

사진 및 텍스트를 넘어서, 동영상이 사용자에게 가장 강렬하게 다가간다는 것은 이미 많이 알고 계실겁니다.

저는 동영상을 가장 먼저 떠올리면, 네이버의 사이트들이 생각 났습니다.

콘텐츠가 많아서 그런지 별도의 설명 없이도 서비스를 설명하는 동적인 영상이 부러웠습니다.

저희 푸른들소프트 또한 현재 영상작업을 진행 중인데, 잘 나왔으면 하는 바램입니다.

4. 풍부한 색감과 감각적인 타이포그래피

- 색감이 풍부하고 선명하며 짙은 색은 시각적으로 강렬한 인상을 줍니다.

- 타이포그래피는 감정을 자아내고 제품의 특성을 규정짓는 유용한 도구입니다.

- 타이포그래피는 단순히 읽기 위함이 아닌 제품 홍보의 수단으로 사용됩니다.

선명하고 밝은 색상, 대담한 그레이디언트 색상과 더불어

브랜드 아이덴티티를 표출하고 텍스트 콘텐츠의 의미 전달을 향상 시키는 타이포그래피 입니다.

워드프레스에서 대부분의 테마들이 이러한 성향이 강해 보입니다.

슬라이더 레불루션 같은 플러그인에서도 그러한 샘플이 대부분인것을 볼 수 있었습니다.

5. 맞춤형 일러스트레이션

- 기존의 사진보다 개성을 더 잘 표현하기 위해 일러스트레이션을 대안으로 선택하는 추세

- 브랜드나 제품의 고유한 색조 및 특성을 캡쳐한 시각언어를 만들어 냅니다.

- 시각언어는 개념을 이해하기 쉬운 비주얼로 압축함으로써 메세지를 명확하게 전달할 수 있습니다.

저희 푸른들소프트 홈페이지 사업영역 페이지 중 일부입니다.

소프트웨어 관련 여러 사업영역들을 일러스트레이션으로 한 눈에 보기 쉽게 하고자 하였습니다. 

그 중에도 애니메이션은 일러스트레이션을 더욱 흥미롭게 만드는 요소라고 합니다.

6. 긴 스크롤 및 패럴랙스 기법의 웹 사이트

- 긴 스크롤이나 무한 스크롤이 웹 사이트의 표준이 될 것으로 예상합니다.

- 스크롤은 네비게이션의 발전된 형태입니다.

- 모바일 디바이스에 바람직하며, 사용자의 시선을 사로잡을 수 있는 많은 가능성이 내재되어 있습니다.

인피니티 스크롤의 개념은 이미 많이 사용되고 있습니다.

페이스북이나 텀블러를 떠올리신다면 쉽게 이해 할 수 있을거라 생각합니다.

기존의 페이징 처리 기법에서, 최하단에서는 다음 컨텐츠가 로딩이 되도록 하는 스크롤 방식으로 변하고 있습니다.

또한 패럴렉스 스크롤 기법을 많이 사용하는데,

화면 배경이미지가 전경의 콘텐츠보다 느리게 스크롤되어 입체감을 주거나

요소를 화면 위로 띄워 올려서 다이내믹한 3D 효과를 만들어 내는 등

시각적인 입체효과를 스토리텔링을 할 수 있는 기법들이 많이 사용됩니다.

7. 카드는 여전히 중요한 요소

- 카드는 하나의 주제와 관련된 모든 정보를 하나의 컨테이너에 담을 수 있다는 개념을 전제로 합니다.

- 카드를 사용하면 유연한 UI를 만들어 다양한 화면에 사용할 수 있습니다.

또 네이버의 카드형 포스트 기능이 제일 먼저 떠오르네요. 제가 네이버를 참 좋아하나 봅니다.

모바일에서 정말 강력하다는 생각이 들었습니다.

카드 레이아웃은 다양한 중단점에 맞춰 자동으로 간편하게 재구성 되기도 합니다.

8. 대화형 인터페이스의 등장

- 챗봇(Chatbot)은 현재 우리 업계에서 가장 활발한 논의가 일어나는 주제 중 하나 입니다.

- 챗봇기술과 대화형 인터페이스를 채택한 많은 솔루션이 제작 되고 있습니다.

- 구글 홈과 같은 제품은 미래의 인터랙션이 버튼에만 국한되지 않는다는 사실을 입증하고 있습니다.

챗봇을 쉽게 떠올린다면 카카오톡 챗봇이 있겠네요.

24시간 인공지능 챗봇으로 고객상담부터 예약업무까지 해결하는 서비스가 있습니다.

피자 주문과 같이 일상적인 업무를 수행할때 사용자의 부담을 더는 데 일조하고 있습니다.

시리(Siri)는 자연스럽게 챗봇의 다음 단계가 될 것입니다.

아마존의 인공지능 스피커 '알렉사'나 요즘 광고도 많이 하는 네이버의 '클로바' 같은 것들이죠.

인공지능 스피커를 처음 접했을땐 되게 낯 부끄러움(?)이 있었는데, 지금은 거의 일상이 되어버린 것 같습니다.

점점 더 발전하는 미래의 인터렉션이 될 것이라고 생각합니다.

9. 증강현실 / 가상현실

- 새로운 차원의 몰입형 참여를 제공하는 증강현실 / 가상현실

- VR 디자인은 단순히 2D작업을 3D로 바꾸는 것이 아닌, 새로운 패러다임의 모색을 의미하게 될 것입니다.

- 제스쳐에 모든 관심이 집중될 것이고 실제 세상과 유사한 의미를 지닌 자연스러운 제스처가 대두 될 것입니다.

AR과 VR은 이미 우리 가까이에 왔습니다.

너무나 이야기 할 것들이 많아서, 이 부분에 대한 코멘트는

다음 연재에서 좀 더 자세히 다루기로 하겠습니다.

10. 프로토타이핑의 활성화

- UX와 UI 디자이너의 경계는 계속해서 모호해질 것이고 더욱 통합된 디자인 프로세스로 발전될 것입니다.

- 새로운 프로토타이핑 툴을 사용하면서 사용자가 무엇을 원하는지에 대해 생각하는 데 더 많은 투자를 하게 될 것입니다. 디자이너는 레이아웃 뿐만 아니라 인터렉션에 집중하게 될 것입니다.

언리얼 코리아에서 진행하는 소개 강좌를 신청하여 들어 본 적이 있습니다.

언리얼 엔진의 비주얼 스크립팅 시스템인 블루프린트(Blueprint)를 듣고 참 무서웠습니다.

이 시스템은 매우 유연하고 강력해서, 보통은 프로그래머가 없으면 힘들었던 개념 구현이나

툴 작업 전부를 디자이너 스스로 해낼 수 있게 되었습니다.

게임 개발을 실제로 디자이너들로만 이루어진 팀이 구현하여 서비스까지 한 사례가 있다고 들었습니다. 

디자이너 사이의 경계도 모호해 지고 있지만,

개발자와 디자이너 사이의 경계도 더욱 모호해 질 것이라 생각합니다.

사용자 경험은 앞으로도 더욱 더 중요한 부분이 될 것입니다.

영역의 파괴는 프로그래머의 위기이면서 동시에 기회라고 생각합니다.

디자인 트렌드를 읽는 개발자, 프로그래밍 언어을 이해하는 디자이너 같은

융합적이고 통합적인 인재들이 미래로 가면 갈수록 두각을 나타낼 수 있을 것입니다.

즐거운 마음가짐으로 열심히 배우겠습니다.

다음은 2018년 디자인 트렌드에 관련된 글로 찾아 뵙겠습니다~