Why is everyone using cards? It is easy to see that many of the most popular websites are moving to a card-based UX. Google Now, Tinder, Jelly and Weotta are some examples. Twitter offers developers a whole deck of cards that are pre-built for their Web and mobile clients:
-
Summary Card: What you normally see in a sharable tweet, including a title, description, thumbnail and Twitter account attribution
-
Summary Card with Large Image: The name works as a description as well
-
Photo Card: Highlights the image by itself
-
Gallery Card: A popular way of displaying a collection of four photos
-
App Card: Good for attaching a link for a mobile app with direct download
-
Player Card: Designed to highlight video, audio or other media
-
Product Card: Optimized for product information
25 Creative and Unique Save the Date Ideas http://t.co/bO8N6dC4hb pic.twitter.com/KkXNteTBYp
— Creative Market (@CreativeMarket) September 29, 2014
5 Mistakes New Photographers Make http://t.co/3HKyvQmrlw pic.twitter.com/Y54FnRczaO
— Creative Market (@CreativeMarket) September 30, 2014
Congrats to @SetSailStudios for becoming the 5,000th Creative Market shop owner! The CM team is SUPER excited for you http://t.co/PLpH0jf3Fj
— Creative Market (@CreativeMarket) September 24, 2014
Ever since Pinterest made it popular, card-based design has been sparking debates over whether it is the key to the mobile future of the Web or merely an annoying fad. Although there are plenty of card champions, here is a more balanced look at the potential and the limitations of a card-based UX.
The Top 5 Arguments for and Against Card Design
Pros:
The End of Hierarchy: With cards, the user controls what is important on the page. Even if the content is laid out top to bottom for optimal mobile viewing, there are no leaders and no followers. The point is to make all the content easily scannable.
CTA Variety: Action buttons can be customized to each card rather than just having “Contact Us†beneath everything.
Preference Testing: Data can be collected on which card users clicked on the most and stayed on the longest, setting the base for a customer behavior study.
Adaptive: Cards make it easier to create a single aesthetic across multiple devices. Most users are viewing sites on two or more screens, and a reliable look and feel makes a big difference.
Sharable: Content in cards is easier to share or embed across social networks. The potential for viral infection is too great a promise to pass up.
Cons:
Transitioning Is Expensive: There has to be clearer evidence that this is not a fad to justify the cost of revamping an entire Web presence across devices.
Sometimes Change Is Bad: Users who find a site easy to use and familiar may balk at the new visual logic.
Updates Are Hard: Fixing a list of elements on a page is easy. Bulk content review and updating becomes much more challenging with cards.
Less Logical: When users are looking for one specific piece of information, scanning through cards can be annoying. Search adds an extra step compared to a themed layout.
Sometimes Hierarchies Are Good: Complex processes often benefit from guiding users along a path rather than allowing them merely to wander randomly. The intent and the outcome are what matter.
Playing Your Hand
Cards are extremely popular right now, and the mobile Web is now the primary way that the majority of users experience the Internet. Laptops have not gone away, though, and they are not disappearing at the rates desktops are. Know your user, and discover how they are using your site now to determine if cards are a good deal or flat out wrong.
Download these worksheets and start practicing with simple instructions and tracing exercises.
Download now!
Making beautiful design simple & accessible to all.
View More Posts
1 Comments