Innobirds Media Design Webzine no.7
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Innobirds Media Design Webzine no.7

on

  • 8,749 views

이노버즈 디자인실 웹진 제 7호, 이번 호 주제는 ‘꼭 기억해야 할 2014년 웹디자인 트렌드 10’ 입니다. 유용한 정보들과 링크들이 많이 있으니까 꼭 ...

이노버즈 디자인실 웹진 제 7호, 이번 호 주제는 ‘꼭 기억해야 할 2014년 웹디자인 트렌드 10’ 입니다. 유용한 정보들과 링크들이 많이 있으니까 꼭 한번 씩 읽어보세요 :D

2013년에 가장 HOT했던 디자인은 반응형 웹 디자인이었는데요, 그 외에도 커다란 이미지를 배경으로 사용하는 디자인, 무한으로 떨어지는 스크롤, 심플 & 미니멀리즘한 디자인 등이 유행했습니다. 작년에 유행했던 웹 디자인 의 트렌드 중 상당부분은 2014년에도 여전히 트렌드로 이어질 것으로 예상 됩니다.

Statistics

Views

Total Views
8,749
Views on SlideShare
8,688
Embed Views
61

Actions

Likes
22
Downloads
184
Comments
0

6 Embeds 61

http://itviewpoint.com 34
http://blog.naver.com 9
http://www.pinterest.com 7
http://cluster1.cafe.daum.net 5
https://twitter.com 4
http://m.cafe.daum.net 2

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Innobirds Media Design Webzine no.7 Document Transcript

  • 1. 7호 14/02/28 2013년에 가장 HOT했던 디자인은 *반응형 웹 디자인이었는데요, 그 외에도 커다란 이미지를 배경으로 사용하는 디자인, 무한으로 떨어지는 스크롤, 심플 & 미니멀리즘한 디자인 등이 유행했습니다. 작년에 유행했던 웹 디자인 의 트렌드 중 상당부분은 2014년에도 여전히 트렌드로 이어질 것으로 예상 됩니다. 01 개성 있는 타이포그래피 *타이포그래피는 꾸준히 언급되어오고 있는 디자인 트렌드 중 하나입니다. 단지 타이포그래피의 성향도 시대의 흐름을 따라 계속 변화하고 있다는 것이 포 인트라고 할 수 있습니다. 2014년에는 믹스 매치된 타이포그래피가 눈에 띌 것으로 예상되고 있으며, 표준 글꼴에 디자이너의 개성과 고유성을 추가하여 새로운 글꼴을 창조 해, 남용 되던 서체에서 벗어나 좀 더 크리에이티브한 전개가 될 것이라고 합니다. 디자이너의 감성과 개성을 담은 타이포그래피는 웹 디자인의 레이아웃과 전체적인 이미지나 사이트의 느낌에 큰 영향을 주기도 합니다. ▲ 그래픽 디자이너 Jordan Metcalf 작품 http://www.jordan-metcalf.com/ *반응형 웹 디자인 : 모든 브라우져와 모바일 기기에서 자동으로 크기를 변환해주는 방식의 디자인 *타이포그래피 : 활판술, 활자 서체의 배열을 말하는데 특히 문자 또는 활판적 기호를 중심으로 한 2차원적 표현 01
  • 2. 02 플랫(Flat) 디자인 3D 입체감을 벗고 좀 더 심플한 플랫 디자인이 각광 을 받고 있습니다. 이러한 변화는 애플의 ios7 업데 이트를 보면 극명하게 나타납니다. 그라디에이션과 입체감을 과감히 없앤 심플한 아이콘, 심플한 라인 과 타이포그래피로 구성된 화면들을 보면 플랫디자 인으로 트렌드가 바뀌었다는 사실을 한 눈에 알 수 있습니다. 이전까지의 디자인은 실제질감(3D효과) 을 나타내기 위해 애썼지만 이제는 미니멀한 인터페 이스, 강렬한 컬러로 채워진 블록, 그라디언트를 거 의 없애는 등의 플랫디자인으로 트렌드가 바뀌어 가 ▲ ios7 업데이트 후 Flat icon으로 변화된 화면 http://www.makeusknow.com 고 있습니다. 전체 화면을 모두 사용하는 디자인 03 와이드한 화면의 웹사이트는 별도의 클릭 없이 마우스 스크롤만으로 간편하게 모든 내용을 한 화면에서 확인 할 수 있도록 해주며 또한 다양한 브라우저와 디바이 스 환경에 대응하기 위해 Flash나 별도의 플러그인 없 이 HTML5나 CSS만으로 사이트를 구성하여 편리하게 이용할 수 있도록 합니다. 이런 전체 화면을 활용한 사 이트들은 점점 더 창의적이고 정교해질 것입니다. ▲ 와이드 모니터로 보아도 여백 없이 채워지는 메인 http://developer.skype.com/ 04 데스크탑에서 모바일로 데스크탑, 랩탑, 스마트폰, 태블릿PC 등 웹에 접근하 는 기기들이 늘어나게 되면서 화면의 해상도도 점점 다양해 지고 있습니다. 다양한 기기들을 활용한 웹 사이트의 접근이 일상화 되면서, 디자이너들은 점점 더 유동적인 해상도를 고려한 디자인을 하게 될 것 입니다. 앞으로 콘텐츠를 중심으로 불필요한 기능과 형식, 꾸미기와 이동 등을 강제로 최소화 시키는 기 능을 구현한 웹 디자인이 늘어나게 될 전망입니다. ▲ 다양한 해상도에 맞춰진 반응형 웹사이트 예시 http://macsamoon.com 02
  • 3. 텍스트 대신 영상 05 새로운 환경들은 사용자들로 하여금 텍스트 보다 동 영상을 선호하게 만들 것입니다. 다양한 소셜 미디 어의 활용과 공유는 많은 데이터를 효과적이고 신속 하게 처리할 필요성이 있으며, 이를 위해 동영상은 현재로서 가장 효과적인 커뮤니케이션 방법이 될 것 입니다. 하지만 무거운 영상을 웹에서 완벽히 활용 하기 위해서는 용량문제 등 풀어야 할 숙제들이 남 아있습니다. ▲ 동영상으로 움직이는 재미를 더한 웹사이트 http://www.diadobaralho.com.br/ 06 무한스크롤 스크롤을 내림에 따라 지난 콘텐츠가 로드 되어 보여 주는 방식으로 끝이 없이 내려가는 웹 페이지 디자인 을 말합니다. 페이스북, 트위터, 핀터레스트, 텀블러 등 의 소셜 네트워크 서비스에서 주로 이용되고 있는데, 이는 소셜 네트워크 서비스의 특징상 다수의 사람들이 폭발적인 수의 콘텐츠를 업로드 하기 때문에 적정량의 콘텐츠를 불러온 후 스크롤에 따라 부가로 콘텐츠를 로드하여 로딩속도를 줄여주기 때문입니다. 따라서 웹 사이트 구축 시 콘텐츠 양에 따라 무한 스크롤 기능을 적절하게 사용한다면 매우 매력적인 사이트를 구현할 수 있습니다. 07 ▲ 무한스크롤 형식으로 콘텐츠가 로드되는 핀터레스트 www.pinterest.com 단순화 된 콘텐츠 모바일의 접속 비율이 늘어나게 되면서 가독성을 고려한 디자인이 중요해지게 됨에 따라 콘텐츠가 간소화 될 것입니다. 그리고 짧아진 사용자의 집중시간을 고려하여 핵심적인 내용위주의 임팩트 있는 콘텐츠를 전달하는 것이 효율적이기 때문에 콘텐츠는 점점 더 단순화 될 것이며, 내용 게시의 주기도 트위터처럼 점점 짧아질 것 입니다. 03
  • 4. 08 사이드바 삭제 블로그나 잡지 타입의 사이트에서 흔히 볼 수 있는 형태의 디자인으로, 요즘은 그 이외의 웹 사이트에서도 유 사한 디자인을 종종 볼 수 있습니다. 이런 형태의 디자인은 사용자의 주의를 분산시키는 것들을 줄여 편안하게 웹사이트의 내용을 숙지할 수 있도록 하기 때문에 시각적 효과와 다양한 콘텐츠 배치에 도움을 주고, 좀 더 나 은 비쥬얼 효과를 얻을 수 있습니다. 심플한 색 사용 09 간단한 색 구성, 타이포그라피의 강약 등을 이용한 심플한 디자인이 새로운 트렌드로 자리 잡고 있습니 다. 강렬한 비비드 컬러도 좋지만 한가지 색상 톤을 사용하여 차분한 느낌으로 작업하면 집중도를 높일 수 있습니다. 단조로운 색상을 활용한 디자인은 앞 서 말한 Flat design과 함께 사용될 수도 있습니다. ▲ 챕터별로 일러스트와 컬러가 다르게 표현된 웹사이트 http://www.adamhartwig.co.uk/ 10 보정된 이미지 사용 2014년에도 원래 이미지를 보정하여 새로운 느낌을 창조하는 디자인이 계속 될 것으로 보입니다. 인스타그램의 이미지를 연상시키는 색상 오버레이, 흐린 이미지 등을 사용한 디자인을 더 많이 볼 수 있을 것으로 생각되며, 일상을 공유하는 콘텐츠가 많아 짐에 따라 소박한 느낌을 주는 이미지로 보정 되는 경향을 보일 것으로 예상됩니다. ▲ 따뜻한 감성이 느껴지는 필터로 보정된 이미지 http://blog.naver.com/dhj07037 ▶ 감성사진 보정법 http://blog.naver.com/soul07777 본 리포트는 원문 http://thenextweb.com/dd/2013/12/29/10-web-design-trends-can-expect-see-2014/1/을 참고하여 해석된 자료를 가지고 재 편집한 글입니다. COPYRIGHTⓒ 2014 INNOBIRDS MEDIA 기획, 편집 : 황인택, 김영은 발행처 : 디자인실