6 Website Button Design Trends To Try Now

With the great deal of importance placed on User Experience, digital button design should not be overlooked. These are just a few of the aesthetic treatments that can be applied to an interface, but as always, ensuring that the design is aligned with the brand it represents and users it serves – is key.

Ghost

The use of ghost buttons is a relatively new treatment to the well used and loved call to action button. Ghost buttons serve the same purpose as traditional buttons but feature transparent interiors and have basic shapes such as rectangles or squares. Outlined, or bordered by a hairline, the inside features very plain text usually in a thin sans-serif. Ghost buttons are incredibly attention grabbing and intuitive which can explain their meteoric rise for designers and developers alike.

Button-4

Flat Button Design (shown left), Ghost Button Design shown (right)

Flat

Personified by two-dimensional, clean, smooth, crisp edges and bright colors – flat design could be coined the ‘champion of usability’. Flat design identifies with a simplified, digital aesthetic, choosing to oppose artificial realism and intricacies in favor of simple iconography. Flat designed buttons are ideal for responsive and mobile interfaces.

Image

The use of image buttons is on the rise with experientially focused websites. Imagery does an exceptional job of telling a story visually, moving the user through an experience with a highly intuitive pathway. Buttons that incorporate imagery are also shown to get users to their destination faster than text alone. The  images chosen must be relevant to the brand as well as the content it is directing to, paying close attention to remain consistent but not redundant.

Button-2

Icon

Icons are one of the most intuitive buttons in place currently. Usually implemented with both textual and visual cues (though text is not necessary), icons have become a mainstay of our digitally inclined minds. Designed well, custom icons can be impactful for the right interface, particularly when space it at a minimum and great for responsive interfaces.

Screen Shot 2015-07-09 at 12.47.08 PM

Material

integrating aspects of flat design with movement and shadows that produce a slight 3D effect to selected graphical elements. Featuring grid-based layouts, responsive animations and transitions, padding, and depth effects such as lighting and shadows, flat design is an alternative to the outdated and overused trend of gradients.

Text

Buttons that consist solely of text overlaid on a solid or image background are on the rise as a direct result of the popularity of oversized imagery. So as not to take away the impact of the image and essential blend into the image, simple and clean type is placed over the image with a line or arrow (usually) indicating that the item is clickable and a call to action. Textual button design is used regularly for high end and luxury lifestyle brand interfaces.

Button-1

Vanessa Petersen

As Executive Director of Brand Strategy based in ArtVersion’s Portland office, Vanessa manages both national and West Coast accounts. She brings with her a passion for strategy with extensive experience in creative marketing, brand growth and development. She is a true advocate of storytelling and brand building from the inside out, and her keen knowledge of the marketplace, trend patterns and usability lead her to identify opportunities that can inspire powerful design strategies.

More Posts - Website - Twitter - Facebook - LinkedIn - Pinterest - Google Plus

1

Leave a Comment