Product Design Newsletter

Insights from fields like user experience, agile development, marketing and of course product design.

Product Design Newsletter

Issue from

Jan Mikula Jan Mikula • Weekly

UX Planet

UX Planet

Website Header Design in 2020: Best Practices and Examples

Illustration by Eleni Debo

The header plays a key role in the design of a website and sets the tone for its every other aspect. Especially now in the era of triumphant minimalism, when various eye candies often get ruthlessly but fairly expelled. Sometimes there is nothing else left for the eye to catch, so the role of website header design has increased significantly.

Web designers put forth a lot of effort into designing this part of a website with creativity and productivity in mind. According to Google, it takes only 50 ms to form an opinion about a website and some opinions develop within the incredible 17 ms. Consumers’ acquaintance with a brand starts here.

Read the article (5 min read)
UX Collective

UX Collective

UX debt 101

Like tech debt, UX debt accumulates over time and, if left unaddressed, leads to amplified user problems and costly cleanup efforts.

UX debt 101

A brief history of the term

User experience debt is called a debt as it’s similar to real-life debt; we get something in the present, but only pay for it in the future. Until the debt is paid off, interest rates rise as a permanent cost.

The UX debt concept was built on a similar one, known as technical (or tech) debt. The term “technical debt” was coined by Ward Cunningham in 1992 who realized that cutting corners with technology and releasing software too quickly can result in additional costs (interest) after the launch.

Read the article (4 min read)
NN Group

NN Group

Executing UX Animations: Duration and Motion Characteristics

Summary: Define a trigger, transformations, duration, and easing of the animation, and be mindful of accessibility issues and annoying the user.

Animations in user experience can help by providing feedback and preventing disorientation or can be distracting, annoying, and dizzying. There are two dimensions for making animations a positive aspect of the user experience: their purpose and their execution.

In a previous article, we reviewed the first dimension — how animations can be used to make feedback noticeable and build the right mental models for a system. In this article, we explore the second dimension: how to execute motion in a way that is natural, smooth, and visible, without causing frustration, discomfort, or significant delays for users.

Read the article (5 min read)
UX Movement

UX Movement

When to Use a Floating Call-to-Action Button

Flick, flick, flick, flick! That’s the sound of the user’s finger scrolling through your long mobile landing page. Eventually, they’ll get flick fatigue and abandon your page if they don’t see the call-to-action button.

The user’s attention and energy are finite resources. Once it exceeds a certain point, they’ll call it quits and move on. If they can’t tap your call-to-action button when they’re ready, you could lose them as potential customers.

There’s nothing wrong with a long mobile landing page. It’s what naturally happens when you condense content to fit the width of a mobile viewport. The problem is the call-to-action button buried at the bottom of the page. When users are ready to act, it’s nowhere to be found.

Read the article (1 min read)
UX Planet

UX Planet

Top UI/UX Design Works for Inspiration — #90

UI & UX Design Inspiration

Every day most digital designers look for inspiration on sources like Dribbble. In a large stream of the works, it is very easy to miss some quality shots with small number of likes and comments.

We decided to change that and every week showcase some of the recent cool shots of young designers who didn’t get much attention of the community. Here they are:

SEARCH JOB — MOTION DESIGN INTERACTION FOR A MOBILE APP
👨‍🎨 Taras Migulko

HEALTHY FOOD
👨‍🎨 Taras Migulko

THREAD REACTIONS
👨‍🎨 Noah Jacobus

Read the article (2 min read)
UX Planet

UX Planet

404 Page: Design Not Found. How to Create Great Error Pages

Illustration by Pequeño Capitan

What’s an error page for you? A reason for feeling confused and annoyed? A bit of a bother? Nothing at all? Having users stumbling upon a 404 page is equally frustrating for the site owners. However, there can be a 404 page design for a business to capitalize on.

You have the power to choose what it would feel like for your user.

A designer is able to produce a creative 404 error page to raise your conversion rate and increase traffic, turning passers-by into leads. If you’re on the lookout for some inspiration on how to improve your website’s 404 page (with examples), then read on!

Read the article (3 min read)
UX Collective

UX Collective

Redesigning components for an existing design system

What to do when a component is no longer aligned and causes downstream usability issues

As a designer, have you ever come across an outdated component in your design system that was no longer serving the needs of your team? Dusty from the years since its conception, it fails to provide its original value as it has accumulated its fair share of pain points and usability issues? If this sounds familiar, redesigning the component may be the best thing you can do for yourself and for your design team moving forward. This is a step-by-step guide on how to do just that based on a recent side project I worked on at MongoDB.

Read the article (4 min read)
NN Group

NN Group

How to Maximize Insights in User Testing: Stepped User Tasks

Summary: You can learn the right kind of things and much more in user tests if you start with broad tasks instead of immediately leading to areas of interest. Prepare additional, focused tasks that can be used to direct users.

When writing usability-testing tasks, you must walk the thin line between telling users too much and too little. Too often usability tasks direct users straight to the site area in which the team is interested, whether it’s a redesigned website or a new piece of content. This approach will usually reap some information about the feature’s usability, but it leaves on the table the potential to learn about the important topics of discoverability and findability. It’s also the reason why some companies are doing lots of testing but still producing unhelpful designs. You can learn more if you start users off with broad instructions before directing them to what you are interested in. Prepare directed tasks that target your points of interest, but give them to participants only if the broad tasks don’t give you the insights that you need.

Read the article (7 min read)
Smashing Magazine

Smashing Magazine

Meet “The Ethical Design Handbook”: How To Leave Dark Patterns Behind

Over the past twenty years, user privacy has become merely a commodity on the web: there, but hardly ever respected — and often swiftly discarded. No wonder ad-blockers have gained traction, browsers have introduced tracking protection, and new legislation in form of GDPR and CCPA brought regulations for data collection.

We need to craft better digital products that respect customer’s choices without hurting business KPIs. And we need to do so by taming data collection and abandoning dark patterns, from hidden checkboxes to ambiguous copywriting. How do we get there?

That’s the question we wanted to answer. Meet Ethical Design Handbook, a new Smashing book full of practical techniques and blueprints on how companies ridden with shady practices can shift towards better, sustainable design. Download a free PDF excerpt (1 MB).

Read the article (4 min read)
UX Collective

UX Collective

Mobile design trends to watch out for in 2020

Reading back this post from December 2018, it seems that not much has changed, and many of the trends are still happening: chromeless designs, gestures, gradients, deep flat, big bold fonts, and more, they are still here and will remain dominant during 2020.

Here’s a closer look at some new mobile trends that will continue to grow in 2020:

1. Dark mode

Yep, I know that’s old news already, but you know what they say: “once apple decides to go black, no one can go back…”. With the release of iOS13, dark mode has become built-in in every mobile app running on Apple devices.

Read the article (3 min read)

That's it. You read the whole issue.

Subscribe to newsletter

  • Read the best content selected by Jan Mikula Jan Mikula.
  • You will receive newsletter in your inbox Every Wednesday at 15:00.
  • You can also subscribe using RSS feed.

Modern news platform
for demanding readers

Subscribe to thematic newsletters prepared by professional editors.

  • Read your newsletters at regular time you want. E.g. every day at 9am.
  • We update your timeline only every 3 hours. Because that's sane.
  • No notifications. No endless scrolling. No addiction and FOMO.