2013년 웹디자인 트렌드

2013년 가을, 미리 살펴보는 웹디자인 트렌드

http://trendw.kr/design/201309/9364.t1m

공식적으로 2013년 여름이 끝났습니다. 곧 추석이 끝나면 이제 업무로 다시 돌아올 시간입니다.  여러분은 이미 새로운 시즌을 대비하여 여러분의 웹사이트를 새로운 컨텐츠나 비쥬얼로 업데이트를 하셨을 겁니다. 만약 여러분이 웹디자인의 최신 유행을 아는 것은 웹사이트를 디자인하거나 수정할 때에 시작하기 좋은 출발점 입니다.

여기 여러분들이 웹사이트 작업을 할 때 알아야 하는 가장 중요하고 최신의 트렌드들을 소개합니다.

스큐어모피즘은 가고, 플랫 디자인이 왔다

스큐어모피즘 디자인은 실제 사물과 흡사한 디자인을 나타내고 있습니다. 예를 들면 당신의 아이폰에서 뉴스 스텐드를 둘러봤을 때, 당신은 진짜 뉴스 스텐드의 나무 질감과 그림자들, 그리고 ‘진짜’ 매거진들을 모방하고 있는 것을 알아채게 될 것입니다.

스큐어모피디자인을 설명하는 완벽한 예를 보여주는 것은  iOS6의 뉴스 스텐드입니다.

스큐어모피즘 디자인의 트렌드는 애플 iOS의 엄청난 인기때문에 지난 몇 년간 급속하게 번져왔지만, 마이크로 소프트의 ‘메트로’ 인터페이스는 “플랫디자인” 이라는 새로운 지표를 선보였습니다.

플랫디자인은 간단함, 선명함 그리고 편리함을 권장하는 것을 철학으로 내세우고 있습니다. 실제로는, 구체적인 3D질감을 벗겨낸 모습으로 동떨어지게 만들거나, 필수적인 그림자의 효과만 유지되도록 합니다.

플랫디자인은 현재 거침없는 상승세에 있습니다. 더 단순하고 최소화되며 편평한 디자인을 채택한 애플의 iOS7의 출시는 ‘플랫’이 새로운 트랜드로 등장할 것이라는 증거입니다.

마이크로 소프트의 메트로 디자인은 오리지널 플랫디자인의 시초

 

 스큐어모피즘 스타일의 iOS6과 새로운 플랫디자인의 iOS7 을 비교

이 영상 꼭 살펴보세요

 

강조하는 색상의 사용과 플랫 아이콘들

 웹사이트의 다양한 부분을 효과적으로 구별하기 위해, 크리에이티브 이벤트 웹사이트 템플릿 에는 대조 색상을 서로 다른 플랫 아이콘에 사용합니다. 여백을 상당히 많이 사용(레이아웃의 빈 부분-반드시 흰색이 아니어도 됨)하는 것은 깔끔하고 우아한 느낌의 아이콘을 분리하고 강조하는 데 도움을 줍니다.

 

큰 이미지, 큰 텍스트 그리고 많은 여백

 다른 광고 웹디자인 트렌드는 큰 이미지와 결합된 큰 타이포그래피를 사용합니다. 이 댄스 스튜디오 웹사이트 템플릿은 두 개의 춤 동작의 이미지를 사용했으며, 춤과 움직임의 아이디어를 큰 텍스트와 단순한 형태로 효과적으로 전달하였습니다. 레이아웃의 여백과 몇 가지의 요소, 웹사이트의 주요 메세지를 중요하게 보이도록 하는 방법을 알 수 있습니다.

다이나믹한 그리드 레이아웃 적용

마이크로소프트의 ‘메트로’ 사용자 인터페이스는 그리드 디자인의 인기에 미친 영향력을 부인하기는 어렵습니다. 우리는 종종 롤오버 효과와 별개의 정사각형이나 직사각형의 형태에 분리되어진 콘텐츠를 볼 것입니다. 좋은 예는 Etch Apps을 포함하여, 진보적이고 세련되며 다이나믹한 그리드 레이아웃을 사용합니다.

다이나믹 그리드 레이아웃의 또다른 훌륭한 예는 에프터스쿨 프로그램이라 불리는 이 윅스템플릿에서 볼 수 있습니다.

배경에 큰 사진을

마지막으로 큰 이미지를 웹사이트의 바탕에 사용하는 것이 유행입니다. 이것은 디자인 포트폴리오 사이트거나, 포토그래피 혹은 아트 포트폴리오 그리고 개인적인 웹사이트일 때 특히 이상적인 형태입니다. 여러분의 랜딩페이지에 강렬한 사진을 바탕으로 사용함으로써, 여러분이나 여러분의 서비스를 사이트의 방문자에게 직접적인 연결을 도와줍니다. 그것이 어떻게 좋은 느낌을 주는지 이 귀여운 윅스 템플릿을 확인해주시기 바랍니다.

원문: http://www.wix.com/blog/2013/09/web-design-trends-fall-2013/