Tag Archives: designing

Stop Designing For Only 85% Of Users: Nailing Accessibility In Design

As designers, we like to think we are solution-based. But whereas we wouldn’t hesitate to call out a museum made inaccessible by a lack of wheelchair ramps, many of us still remain somewhat oblivious to flaws in our user interfaces. Poor visual design, in particular, can be a barrier to a good user experience. Whereas disability advocacy has long focused on ways to help the user adapt to the situation, we have reached a point where users expect products to be optimized for a broad range of needs.

Visit site:

Stop Designing For Only 85% Of Users: Nailing Accessibility In Design

Never Stop Learning With Conference Live Streams And Videos

What makes a great conference? It fuels your ideas and polishes up your skills. It fosters your professional growth and takes your work to the next level. Luckily, a lot of conferences provide videos of their talks after the event has ended, some do even stream live to pass on their knowledge even if you couldn’t attend.
The videos collected in this round-up revive the spirit of the conferences they were recorded at and cater for a lot of fresh insights and light-bulb moments to make the learning never stop.

Jump to original: 

Never Stop Learning With Conference Live Streams And Videos

Designing The Most Desirable Product: Exploration of Banknotes Design


As digital technologies are implanted deeper in the world, making more and more aspects of life intangible, it’s hard to imagine the world without any kind of banknotes, or paper money. In the dramatic history of our world, money became not just generic objects of payment, but also symbols of societies.

Designing The Most Desirable Product Of All Time: Paper Money

Combining utility and exclusivity, money is one of the challenging objects to design. And as with any complex task, currency design holds some valuable lessons for us, web designers. This article is an attempt to formulate some of these lessons and, therefore, draw your attention to the inspirational nature of paper money.

The post Designing The Most Desirable Product: Exploration of Banknotes Design appeared first on Smashing Magazine.

See original article here: 

Designing The Most Desirable Product: Exploration of Banknotes Design

Intimate And Interruptive: Designing For The Power Of Apple Watch


“We’re all back at square one again.” That was the overwhelming lesson we learned while designing our first major Apple Watch app for launch. To be successful in designing for this device, the entire way we think about app design will need an overhaul.

Intimate And Interruptive: Designing For The Unique Power Of Apple Watch

The patterns and processes that became standard for other devices are of little help here and, in many cases, can actively hinder efforts to create a beautiful, functional and user-centric watch experience.

The post Intimate And Interruptive: Designing For The Power Of Apple Watch appeared first on Smashing Magazine.

View original post here:  

Intimate And Interruptive: Designing For The Power Of Apple Watch

Here’s What a Winning Click-Through Landing Page Looks Like

winning-click-through-landing-page
These pages got all the stock image hand models clickin’. Image source.

Last month we held a contest on the blog, challenging marketers to create a click-through landing page to promote our latest ebook, Attention-Driven Design: 23 Visual Principles for Designing More Persuasive Landing Pages.

It was an experiment to determine which design principles and “best practices” make for a seductive click-through landing page. But instead of getting a panel of judges to wax poetic about which landing pages they thought were great, we thought we’d publish the pages and let visitors decide: which ones would actually get people to click through and then convert?

Before we talk about the winning pages and what made them so darn titillating, a quick review session. Let’s take a look at how click-through landing pages differ from their lead gen landing page cousins — both in form and function.

WTF is a click-through landing page?

Click-through landing pages do exactly what it says on the tin. Unlike lead gen landing pages, they don’t have a form on the page asking people to opt in. Instead, they have a goal of convincing visitors to click through to another page (where the actual conversion happens).

They’re frequently used in ecommerce funnels to describe a product in detail and “warm up” visitors for their purchasing decision. They combat the cognitive dissonance that is created when someone clicks on an ad for a specific product and they wind up on a seemingly irrelevant generic product page.

In Attention-Driven Design ebook author Oli Gardner’s words:

Click-through pages are a great way to create an interstitial experience that confirms the intent of your ad in a simple way, maintaining the attention of your visitor, and then guides them through the purchasing decision before taking them further down the funnel.

Simple enough, yeah? But if you’re gonna use a click-through landing page to “warm up” visitors and reassure them that they’ve made a “good click,” you also wanna be sure you’ve optimized the heck out of it.

Without further ado, let’s look at our winning click-through landing pages — the ones that lead to the most ebook downloads  — and see which Attention-Driven Design principles they employed to get people to convert.

4th place winner: Conversion Lab

Conversion Lab’s landing page does an excellent job of teasing visitors with sneak previews of the ebook above the fold:

conversion-lab-click-through-landing-page

A little lower on the page, for prospects who need a little more information to be persuaded, they include a SlideShare preview of the core concepts from the book.

attention-driven-design-slideshare

Even with all the additional information, the page is really easy on the eyes. Here’s how Oli Gardner put it when we asked him about the page:

The information hierarchy is strong with a nice linear top-to-bottom reading experience and nicely balanced font sizes for easy reading. Overall, a very clean design – which I’ve come to expect from Conversion Lab.

Indeed. Congrats on placing 4th, Conversion Lab!

mean-girls-linsay-lohan

3rd place winner: Tim Ruof

What really stands out about Tim’s page is his generous use of directional cues to guide your eye down the page.

tim-ruof-click-through-landing-page

One minor quibble: Oli pointed out that the model is looking downwards — under the CTA — so there’s no benefit to the angle of her gaze.

Still, this is somewhat counterbalanced by the arrow pointing to the call to action button, along with the other arrows on the page. Oli elaborated:

I like how the continuation arrows are used to guide you through the reading experience. It may not seem like a big deal, but this really helps both the visual and information hierarchy.

Tim also got crafty with his social proof, pulling actual quotes from Twitter as testimonials:

click-through-landing-page-twitter-testimonials

Oli suggested a couple of improvements to test:

I’d remove the links to the tweets though and perhaps cut and paste the actual tweet so it looks exactly like Twitter.

We’ll forgive Tim for upsetting the attention ratio of the page with those external links, because he blew us away by creating Twitter cards to drive traffic to his page:

twitter-card-tim-ruof

Talk about going the extra mile. Awesome job, Tim.

clapping-clap-wonderful

2nd place winner: Winsome Writing

Winsome Writing’s landing page is shorter than most of the other entries we received, but that doesn’t mean it’s not sweet. Like our previous entry, they use screenshots and a SlideShare preview to tease visitors with the juicy content:

winsome-writing-click-through-landing-page

Interestingly, they haven’t really included any social proof, and chose not to lead with a strong hero shot of the ebook itself. Oli suggested that this might be a good thing to test:

This designer chose to keep the model hero shot. It’s interesting as to what impact it would have. As it’s an ebook download page, it could be posited that the model may confuse matters and she does look kinda sad.

Oli also congratulated Winsome Writing for including a bold CTA button which contrasts nicely with the rest of the page.

Overall, a solid effort that secured Winsome Writing second place in the contest. Pat yourselves on the back!

pat-patting

1st place winner: Sherif Makhlouf

Drum roll please…

This landing page scored creator Sherif Makhlouf an all-expenses-paid trip to Vancouver for Call to Action Conference 2016!

sherif-makhlouf-click-through-landing-page

As Oli pointed out, it’s pretty clear that Sherif read the book — he employed several Attention-Driven Design principles. There’s Direction: the way the model’s gaze directs your attention to the CTA, and the Contrast of the big pink button. Finally, the third page section uses Continuation effectively, helping to draw your eye down the page.

But Oli also praised Sherif for employing other classic landing page best practices. For starters, look at how decked out the social proof section of the page is:

click-through-landing-page-social-proof

And then there’s the counter by the CTA button, which displays how many copies have been downloaded:

false-scarcity-click-through-landing-page

But Oli especially appreciated the way Sherif employed a healthy dose of scarcity and urgency:

The use of “only 27 free copies left” is a nice touch, not mentioning price but insinuating that it will become a paid ebook soon.

It’s worth mentioning that this is in fact false scarcity — the ebook will remain free forever, we swear! But that this page is the winning page speaks volumes about the psychological power of these tactics.

Before you run off and employ false scarcity on your own page, step back and remember that, “With great power comes great responsibility.” Because if prospects suspect that you’re trying to trick them, you could lose them forever…

lines-album

Create a winning landing page of your own

Thanks to everyone who submitted landing pages to our Attention-Driven Design contest — you guys never cease to amaze us.

And special congrats to Sherif, you sneaky-but-super-smart marketer! We can’t wait to meet you at Call to Action Conference 2016.
Want to create a landing page that replicates the success of Sherif’s? Check out Oli’s latest ebook by entering your email below…

Source: 

Here’s What a Winning Click-Through Landing Page Looks Like

The 23 Principles of Attention-Driven Design [Free 68-page Ebook]

BuzzFeed. Squirrels. Popups. Taylor Swift in a Tesla tickling tuna.

Do I have your attention?

Probably not, because so many darn things are competing for it at the exact same time. (Like that email notification that just popped up in the corner of your screen. Don’t look at it! It’ll still be there in a minute, I promise.)

This is the challenge marketers are faced with everyday and that Unbounce co-founder Oli Gardner tackles head on in his brand new 68-page masterpiece, Attention-Driven Design: 23 Visual Principles For Designing More Persuasive Landing Pages.

attention-driven-design-ebook-650

Oli has been touring the world for the last 18 months, spreading the gospel about how to design amazing marketing experiences that both delight and convert. We finally persuaded him to sit down and put his latest research, insights and hilarious ramblings into writing.

You won’t believe what happened next.

Spoiler alert: He wrote a brilliant ebook. Download it below to see for yourself. It’s totally free and will make you a better human being. Or at least a better marketer and designer.

You’ll learn:

  • Why Oli has a love/hate relationship with BuzzFeed
  • What happened when he put his own mug next to a landing page CTA (hint: it was a humbling experience)
  • How to design a page with a perfect Attention Ratio (and when you might want to bend the rules)
  • What John and Yoko can teach you about attention-driven design
  • Why squirrels are jerks. Really, they are.

This article is from:  

The 23 Principles of Attention-Driven Design [Free 68-page Ebook]

A Closer Look At Personas: What They Are And How They Work | 1

In my experience as an interaction designer, I have come across many strategies and approaches to increase the quality and consistency of my work, but none more effective than the persona. Personas have been in use since the mid-’90s and since then have gained widespread awareness within the design community. We’ll discuss the process of creating personas from ethnographic research in Part 2 of this series. [Links checked March/29/2017]

Continued here:

A Closer Look At Personas: What They Are And How They Work | 1

75 Instructive Design Case Studies

Unlike many other industries, the web design community is all about sharing knowledge and experience. Each of us is very lucky to be part of such a great and useful learning environment, and it is up to us to embrace it — to embrace our learning experiences, and also to embrace our ability to share.
Not only are case studies a great way to explain the design process of an agency, but they also help designers and developers to learn from each other.

Originally from: 

75 Instructive Design Case Studies

Not Just Pretty: Building Emotion Into Your Websites

Emotional design has become a powerful tool in creating exceptional user experiences for websites. However, emotions did not use to play such an important role on the Web. Actually, they did not use to play any role at all; rather, they were drowned by a flood of rational functionality and efficiency.
We were so busy trying to adapt to the World Wide Web as a new medium that we lost sight of its full potential.

See the article here: 

Not Just Pretty: Building Emotion Into Your Websites

How To Design Global Applications For Children

The entire process of designing digital applications comes with many challenges and decisions. For the majority of projects, you will be designing in somewhat familiar territory. But what happens when you have to design something to be used by hundreds of children around the world? How do you accommodate your design for kids of different ages and backgrounds? What special challenges emerge, and how can they be overcome?
For a project of this scale, the design process we follow might require modifications.

Continue reading here – 

How To Design Global Applications For Children