Menu Search
Jump to the content X X
SmashingConf London Avatar

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf London, dedicated to all things web performance.

Category: UX Design

Quality articles on usability, information architecture, interaction design and other user experience (UX) related topics – for digital (Web, mobile, applications, software) and physical products. Through these articles, experts and professionals share with you their valuable ideas, practical tips, useful guidelines, recommended best practices and great case studies. Curated by Chui Chui Tan. Subscribe to the RSS-Feed.

Popular tags in this category:

How To Design Better Buttons

Buttons are a common element of interaction design. While they may seem like a very simple UI element, they are still one of the most important ones to create.

A Quick Guide For Designing Better Buttons

In today's article, we'll be covering the essential items you need to know in order to create effective controls that improve user experience. If you'd like to take a go at prototyping and wireframing your own designs a bit more differently, you can download and test Adobe XD for free.

Read more...

The Golden Rules Of Bottom Navigation Design

Design is more than just good looks – something all designers should know. Design also covers how users engage with a product. Whether it's a site or app, it's more like a conversation. Navigation is a conversation. It doesn't matter how good your site or app is if users can't find their way around.

Facebook bottom tab bar iOS

In this post, we'll help you better understand the principles of good navigation for mobile apps, then show you how it's done using two popular patterns. When we examine the most successful interaction navigation designs of recent years, the clear winners are those who execute fundamentals flawlessly. While thinking outside the box is usually a good idea, there are some rules that you just can't break.

Read more...

Giving Your Product A Soul

After a few years of designing products for clients, I began to feel fatigued. I wondered why. Turns out, I’d been chasing metric after metric. “Increase those page views!” “Help people spend more time in the app!” And it kept coming. Still, something was missing. I knew that meeting goals was part of what a designer does, but I could see how my work could easily become commoditized and less fulfilling unless something changed.

Giving Your Product A Soul

I thought of how bored I’d be if I kept on that path. I needed to build some guiding principles that would help me find my place in design. These principles would help grow and would shape my career in a way that fits me best.

Read more...

Icons As Part Of A Great User Experience

Icons are an essential part of many user interfaces, visually expressing objects, actions and ideas. When done correctly, they communicate the core idea and intent of a product or action, and they bring a lot of nice benefits to user interfaces, such as saving screen real estate and enhancing aesthetic appeal. Last but not least, most apps and websites have icons. It's a design pattern that is familiar to users.

Icons As Part Of A Great User Experience

Despite these advantages, icons can cause usability problems when designers hide functionality behind icons that are hard to recognize. An icon's first job is to guide users to where they need to go, and in this article we'll see what it takes to make that possible. If you want to take a go at creating your own icons, you can download and test Adobe's Experience Design CC for free and get started right away.

Read more...

How To Build Honest UIs And Help Users Make Better Decisions

Many apps today, such as Google Now, Spotify and Amazon, make assumptions about user preferences based on personal data. They may even use this information to make decisions on our behalf, without any direct input from us. For example, Facebook tailors your news feed and Amazon recommends products  —  both hiding "irrelevant" information and only showing what they think you will like.

How To Build Honest UIs And Help Users Make Better Decisions

This type of design pattern, where user choice is removed, has recently been coined "anticipatory design". Its aim is to leverage data on user behavior to automate the decision-making process in user interfaces. The outcome lowers the excessive number of decisions people currently make, thereby reducing decision fatigue and improving decisions overall.

Read more...

Designing Card-Based User Interfaces

Web and mobile apps are moving away from pages towards completely personalized experiences. These new experiences are built on an aggregation of many individual pieces of content. The way this content is now being presented is in the form of cards. The card-based interaction model is spreading pretty widely, and you can see digital cards almost everywhere — from news sites to food delivery apps.

Designing Card-Based User Interfaces

In this article, I'll explain what cards mean to UI designers, and I'll review three popular card-based services. If you're interested in prototyping your own card-based user interface, you can download and test Adobe's Experience Design CC for free and get started right away.

Read more...

In-App Gestures And Mobile App User Experience

Remember the days when hovering and clicking using the mouse were the most used trigger for interaction with site or app? Those days are gone. When Apple introduced the iPhone, multi-touch technology became mainstream and users learned that they could not only point and tap on the interface, but also pinch, spread, and swipe. Gestures are the new clicks.

In-App Gestures And Mobile App User Experience

The rise of touch and gesture-driven devices has dramatically changed the way we think about interaction. Gestures are more than merely entertaining, they are very useful and feel familiar. Today, the success of a mobile app significantly depends on how well gestures are implemented into the user experience. Even Adobe introduced a new design and wireframing app called Experience Design CC (Adobe XD) that lets you prototype on everything from simple wireframes to multi-screen experiences.

Read more...

Reducing Cognitive Overload For A Better User Experience

The best user experience is the one the user doesn’t notice. It appears smooth and simple on the surface, but hundreds of crucial design decisions have been made to guide, entertain and prevent trouble. If the user experience design does what it’s supposed to do, the user won’t notice any of the work that went into it.

Reducing Cognitive Overload For A Better User Experience

The less users have to think about the interface or design, the more they can focus on accomplishing their goal on your website. Your job as a designer is to give them a straight path to their goal by clearing out the obstacles beforehand.

Read more...

Sponsored Article How We Use Prototyping, And How It Made Us More Efficient

Prototyping is essential to help your team create the best product possible. It’s a chance to experiment with ideas and turn them into something tangible that you can test and build upon. When you fail with your prototype, you land softly — there’s always the chance to iterate and improve.

Prototyping For Success

The team behind Adobe’s new prototyping tool Experience Design (Adobe XD) uses prototyping as a method to test new features before they make it into the program. Being a product manager on the Adobe XD team, I'll share some insights into how the team uses prototyping to build and improve Adobe XD, and make prototyping more efficient for designers.

Read more...

Pixel-Perfect Specifications Without The Headaches

Designers, developers and managers often work with compressed timeframes and multiple projects simultaneously. A team must be able to respond quickly to feedback on their product from clients, project managers and developers. Each minor revision in the UI or UX needs to be reflected in the documentation, so that designers and developers always have the latest information.

Pixel-Perfect Specifications Without The Headaches

A style guide ensures that your project doesn’t encounter serious problems when you implement the initial design. Making sure that all specifications are accurate to their designs is critical, because an inaccurate specification means that developers will have to either rely on guesswork when building the app or go to the design source to get answers to their questions.

Read more...

How To Run A UI Design Critique

Criticism is easy. It seems like everybody has an opinion, but, as the author Harlan Ellison points out, "You are not entitled to your opinion. You are entitled to your informed opinion." To become informed, though, requires exploration. Design critiques are an important part of any product exploration.

Creativity Under The Microscope: Running A UI Design Critique

A design critique — where the creator discusses and explains the creation with the rest of the team and/or client — is not about badgering the designer or pushing them to justify every decision they made. That’s just criticism. A good design critique is meant to explore the design, find where it is working and where it could be improved. If done well, design critiques allow everyone on the team to feel as if they have been heard and allow clients to give valuable feedback.

Read more...

Experience Design Essentials: Animated Microinteractions In Mobile Apps

Dariel Fitzkee, the famous magician, once said, “Magic is both in the details and in the performance.” Interaction design is just like that. Designers love to get the big picture right, but if the details aren’t handled properly, the solution will fail. The magic is all in the details. That’s why well-designed microinteractions make experiences feel crafted.

Experience Design Essentials: Animated Microinteractions In Mobile Apps

To get a better understanding of how your design benefits from microinteractions, it will help to sketch out your app ideas. Adobe introduced a new design and wireframing app called Experience Design (or Adobe XD) which lets you design wireframes and make them interactive. You can download and test Adobe XD for free.

Read more...

↑ Back to top