웹과 모바일로 깊숙히 들어온 카드UI

카드 UI를 이제는 정말 많은 곳에서 접할 수 있게 되었습니다. ‘Using Card-Based Design To Enhance UX‘를 통해 카드UI에 대해 조금더 자세히 살펴볼 수 있었는데요! 구체적인 정보를 담을 수 있는 역할을 하는 이미지와 텍스트로 이뤄진 작은 사각형으로 이미 우리에게 익숙한 존재가 바로 ‘카드’입니다. 이러한 카드가 웹과 모바일로 들어오면서 미적 요소는 물론, 사용성을 많이 끌어올려준 것도 사실이죠. 현실 세계(?)에서도 만날 수 있었던 카드이기에 UI에서 카드를 활용하는 것은 직관적으로 다가올 수 밖에 없는데요! 또한 콘텐츠들을 의미 있는 섹션으로, 다양한 디바이스의 화면을 보다 효율적으로 활용할 수 있도록 도와주기도 합니다. 다양한 정보를 모아 하나의 일관된 조각으로 모아주는 역할을 하기 때문이죠. 뿐만 아니라, 시각적인 즐거움을 주기에 안성맞춤이며 애니메이션을 활용함에 있어서도 좋은 조건이 될 수 있습니다. 그래서 오늘은! 다양한 카드UI 사례들을 정리해볼까 합니다. 최대한 다양한 모습을 확인하고 참고할 수 있도록요!

 

AIGA

http://www.aiga.org/

 

CSSDSGN

http://www.cssdsgn.com/

 

AWWWARDS

http://www.awwwards.com/

 

SHOPIFY THEMES

https://themes.shopify.com/

 

WORDPRESS.COM THEMES

https://wordpress.com/themes

 

CASUAL START

http://casualstart.com/

 

UXPIN

https://www.uxpin.com/knowledge.html

 

WE OCCUPY

http://www.weoccupy.co.uk/

UI8

https://ui8.net/

OUR DAILY EDIT

https://www.ourdailyedit.com/collections/women

 

EXTENDED PLAY

http://www.extendedplay.nyc/

 

BERTUS GERSSEN

http://www.bertusgerssen.nl/

 

RE:COLLECTION

http://www.recollection.com.au/

 

ROSIE LEE

http://rosielee.co.uk/

 

FACEBOOK DESIGN

http://facebook.design/

 

HANDSOME FRANK