Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. 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 Barcelona, dedicated to smart front-end techniques and design patterns.

Posts Tagged ‘UI’.

We are pleased to present below all posts tagged with ‘UI’.

Combining Graphical And Voice Interfaces For A Better User Experience

With​ ​the​ ​appearance​ ​of​ ​voice​ ​user​ ​interfaces,​ ​AI​ ​and​ ​chatbots,​ ​what is​ ​the​ ​future​ ​of​ ​graphical​ ​user​ ​interfaces (GUIs)?​ ​Don’t​ ​worry: Despite​ ​some dark​ ​predictions​,​ ​GUIs​ ​will​ ​stay​ ​around​ ​for​ ​many​ ​years​ ​to​ ​come. Let​ ​me​ ​share​ ​my​ ​personal, humble predictions​ ​and​ ​introduce​ ​multi-modal​ ​interfaces as​ ​a​ ​more​ ​human​ ​way​ ​of​ ​communication​ ​between​ ​user​ ​and​ machine.

Combining Graphical And Voice Interfaces For A Better User Experience

The​ ​old​ ​wisdom​ ​that​ ​a​ ​picture​ ​is​ ​worth​ ​a​ ​thousand​ ​words​ ​​is​ ​still​ ​true​ ​today.​ ​Our​ ​brain​ ​is​ ​an incredible​ ​image​-​processing​ ​machine.​ ​We​ ​can​ ​understand​ ​complex​ ​information​ ​faster​ ​when we​ ​see​ ​it​ ​visually.​ ​According​ ​to​ ​studies,​ ​even​ ​when​ ​we​ ​talk​ ​with​ ​someone​ ​else,​ n​​onverbal communication​​ ​represents​ ​two third​s ​of​ ​the​ ​conversation.​ ​According​ ​to​ ​​other​ ​studies​​, ​we​ absorb most​ ​information​ ​from​ ​our​ ​sight​ ​(83%​ ​sight,​ ​11%​ ​hearing,​ ​3%​ ​smell,​ ​2%​ ​touch​ ​and​ ​1% taste).​ ​In​ ​short,​ ​our​ ​eyes​ ​are​ our ​primary​ ​sensors​.

Read more...

Why I Switched To Sketch For UI Design (And Never Looked Back)

User interface design has changed dramatically in the last few years, as traditional computers have ceded dominance to smaller screens, including tablets, mobile phones, smartwatches and more.

My Ideal Sketch Setup For UI Design

As the craft has evolved, so has its toolset; and from one app to rule them all — looking at you, Photoshop! — we have gotten to a point where it seems like a new contender among UI design tools crops up every month. And I have to admit that many of the new UI design tools look pretty good and promising.

Read more...

A Guide To Virtual Reality For Web Developers

Recently, there has been a proliferation of virtual reality (VR) web browsers and VR capabilities added to traditional browsers. In this article, we’ll look at the state of browsers in VR and the state of VR on the web via the WebVR APIs.

A Guide To Virtual Reality For Web Developers

The web community has experimented with VR before, with VRML, but now WebVR takes a new approach to VR, one more suited to the modern web. We've accelerated 3D on the web since 2011 with the release of WebGL. Now the web can handle VR thanks to new web APIs that take advantage of VR hardware using WebGL.

Read more...

Building A Simple AI Chatbot With Web Speech API And Node.js

Using voice commands has become pretty ubiquitous nowadays, as more mobile phone users use voice assistants such as Siri and Cortana, and as devices such as Amazon Echo and Google Home have been invading our living rooms.

Building A Simple AI Chatbot With Web Speech API And Node.js

These systems are built with speech recognition software that allows their users to issue voice commands. Now, our web browsers will become familiar with to Web Speech API, which allows users to integrate voice data in web apps.

Read more...

The Surprising Relationship Between Gamification And Modern Persuasion

If you're like me, then being persuaded requires a scientific approach and concrete examples. And that's exactly what this article does. It explains how gamification can work by showing the relationship between gamification, UX design and BJ Fogg's modern persuasion phenomenon, "mass interpersonal persuasion." And it has a lot of practical gamification examples that you can apply to your own products for more engaging experiences.

The Surprising Relationship Between Gamification And Modern Persuasion

Today, virtually all companies (except for special ones like Basecamp) have to grow non-stop. Why? Well, that's simply how the capitalist engine works. Investors pour money into startups, banks loan money to entrepreneurs, employees accept stock options instead of cash, all in the hope of the company growing much bigger.

Read more...

Designing The Perfect Accordion

Design patterns. An almost mythical phrase that often inspires either awe or resentment. As designers, we tend to think of design patterns as generic off-the-shelf solutions that can be applied to various contexts almost mechanically, often without proper consideration. Navigation? Off-canvas! Deals of the day? Carousel! You get the idea.

Designing The Perfect Accordion (With A Checklist)

Sometimes we use these patterns without even thinking about them, and there is a good reason for it: Coming up with a brand new solution every time we encounter an interface problem is time-consuming and risky, because we just don’t know how much time will be needed to implement a new solution and whether it will gracefully succeed or miserably fail in usability tests.

Read more...

Connecting With Users: Incorporating Humor In Web Design

Joan is applying for a small loan on all-online-loanzzz.com. She's becoming frustrated with the number of financial-disclosure forms she has to fill out. She's thinking about visiting her local bank to ask for a loan instead.

Connecting With Users: Incorporating Humor In Web Design

While waiting for a page to load, the application presents a cartoon image of a person wearing a business suit sitting in a jail cell. The image caption says, "Hey, everyone hates disclosures. We know you do, too. We're doing our best to keep everyone out of jail. Please bear with us for a few more clicks. You won't regret it, and our loan officers will stay out of jail." Joan smirks at the image. She might not appreciate the number of forms she has to complete, but she understands the serious nature of applying for a loan.

Read more...

Designing Voice Experiences

Voice-based interfaces are becoming commonplace. Voice assistants such as Siri and Cortana have been around for a few years, but this past holiday season, voice-driven devices from Amazon and Google made their way into millions of homes.

Designing Voice Experiences

Recent analysis from VoiceLabs estimates that 24.5 million voice-driven devices will be shipped this year, almost four times as many as last year. As experience designers, we now have the opportunity to design voice experiences and interfaces!

Read more...

How To Prototype IoT Experiences: Configuring The Software (Part 2)

In the first article of this series, we walked through how to put together the hardware board and all of its additional components into a single rig. I also gave you a glimpse of the decision-making process behind the selection of the board.

How To Prototype IoT Experiences: Configuring The Software (Part 2)

In this second (and last) article of the series, we will go over the code that will drive the sensor and the communication to the cloud. Additionally, we will configure a custom dashboard on Adafruit IO, so that we can visualize our data in real time.

Read more...

How To Prototype IoT Experiences: Building The Hardware (Part 1)

The world is constantly evolving with frameworks, such as the Internet of Things (IoT) and virtual reality (VR). These and many others are opening opportunities to rethink how we approach prototyping: They introduce avenues to marry the digital software with the tangible aspect of the overall user engagement.

How To Prototype IoT Experiences: Building The Hardware (Part 1)

This two-article series will introduce readers of different backgrounds to prototyping IoT experiences with minimum code knowledge, starting with affordable proof of concept platforms, before moving to costly commercial offerings.

Read more...

An Overview Of E-Commerce Platforms

Did you know that bandwidth overage charges are (still) a problem and most users prefer not to rely on a developer? Well, I talked to 917 (real-life) users and created a guide to help others find the e-commerce software that suits them best.

The Ultimate Guide To E-Commerce Platforms

I completed this guide by searching for websites built with e-commerce software (you can verify by looking at the source code — certain code strings are unique to the software). Once I found a website, I (or one of my virtual assistants) would email the owner and ask if they'd recommend a particular software. Typically, they'd reply and I'd record their response in a spreadsheet (and personally thank them).

Read more...

Figma Vs Sketch: The Showdown

The past year has seen quite a rise in UI design tools. While existing applications, such as Affinity Designer, Gravit and Sketch, have improved drastically, some new players have entered the field, such as Adobe XD (short for Adobe Experience Design) and Figma.

Sketch Vs. Figma: The Showdown

For me, the latter is the most remarkable. Due to its similarity to Sketch, Figma was easy for me to grasp right from the start, but it also has some unique features to differentiate it from its competitor, such as easy file-sharing, vector networks, “constraints” (for responsive design) and real-time collaboration.

Read more...

↑ Back to top