Future UI and the End of Design Sandboxes

• Design, future
future-ui-and-the-end-of-design-sandboxes

Anyone working in design and technology—and probably anyone living in the modern world—will have noticed the swiftness with which we went from using terms like the “World Wide Web” to the “Internet of Things.”

In a short time, we’ve gone from designing and developing web pages—points on the map of the information superhighway accessed through browsers—to future UIs: a vast array of interconnected applications delivering content and experiences across a range of form factors, resolutions, and interaction patterns.

Technology and the screens we use today are disappearing into our surroundings. The “Internet of Things” (IoT), coupled with artificial intelligence (AI) using voice assistants, already surrounds us. We are at the dawn of an “ambient intelligence” (AmI) world where a multitude of devices work in concert to support people in carrying out their everyday life activities. Individual screen-based UIs are slowly disappearing, and designers have to grapple with a fragmented system of design components.

How will designers design for an AI-enabled ambient intelligence world where screens have disappeared? How will this change their role?

Design data will be all around us soon in an ambient intelligence world
An ambient intelligence world will soon be all around us. Single device screen-based UIs are disappearing.

Designer Roles of Tomorrow Are Shifting

The object of the digital designers’ practice was once placing an intricate series of boxes, images, text, and buttons onto a relatively reliable browser screen (and eventually a mobile app screen).

This was the breadth of the experience delivered to people. But now, designers must consider that products exist as separate entities within complex systems of components that interact with, swap information with, and sometimes even disappear behind other parts.

As Paul Adams of Intercom writes in his piece The end of apps as we know them, “In a world of many different screens and devices, content needs to be broken down into atomic units so that it can work agnostic of the screen size or technology platform.”

And this goes beyond just content. Today, designers must consider how every feature or service offered to people exists within, and cooperates with, other components of multiple systems and platforms.

IoT and future UI
Recognizing the end of apps is just the beginning. Ambient intelligence and IoT will soon be everywhere.

How Will People Interact with Information Tomorrow?

At the beginning of the mobile revolution, designers focused on creating apps that deliver an experience similar to websites: well-designed and controlled, boxed-in environments that people interacted with to consume content or accomplish a task, and then exited.

Most of the interaction happened within the confines of a screen, and designers had a good deal of control over the delivery.

However, the range of mobile devices has exploded from screen-based mini-computers to wearable wrist-wrapping message centers and devices that remotely control your home thermostat. Today, people get disjointed snippets of information from multiple sources delivered through notifications and alerts. The paradigm has shifted dramatically.

Nest doorbell, an example of component-based design
The context in which users interact with information is shifting.

What Are Future UIs Going to Look Like?

The proliferation of diverse, interconnected technologies has also meant that a single product will be experienced and interacted with differently in different contexts.

An alert to a message might appear on a person’s smartwatch while they’re en route to a meeting.

Rather than having to find, and then open the messaging app, the user has the option to respond within the notification and send out a pre-composed quick reply with one tap, and engage with the message in more depth later, on another device.

What this means is that an atomic unit—a micro-component of interaction—has to be delivered through varied UIs (and user experiences) tailored to the context of communication.

Chances are, the user is not composing a long-form email reply while jogging. They probably won’t open a laptop for the sole purpose of using the one-tap response that was so handy on their wearable. They may never even read the notification on the screen, but instead, listen to the content to a voice-activated virtual assistant.

Paul Adams writes, “In a world where notifications are full experiences in and of themselves, the screen of app icons makes less and less sense. Apps as destinations makes less and less sense. Why open up separate apps for your multi-destination flights and hotels in a series of vendor apps when a travel application like TripIt can present all of that information at once—and even allow you to complete your pre-boarding check-in? In some cases, the need for screens of apps won’t exist in a few years, other than buried deep in the device UI as a secondary navigation.”

System-level, interactive notifications will enable people to take action immediately, rather than having to use a notification as a gateway to open an app where people are pulled abruptly from one context into another.

Shifting Paradigms of Interaction Transform Future UIs

Apps like the popular WeChat allow people to do things like transfer money, call a cab and receive updates on its arrival time, search for a restaurant and book a table, or find a hotel nearby – all through a text-based interface that removes the need for a user to navigate to individual apps to accomplish a series of tasks.

Future UI design with conversational interfaces

In The Future of UI? Old School Text Messages, Kyle Vanhemert looks to the proliferation of text-based platforms that frequently replace the need for a graphical user interface. The services that apps provide will increasingly be accessed outside of the apps themselves.

Designing for the world of IoT means abdicating even more control over the interface—creating products and services that might not be accessed through a screen at all.

When the touch-based screen revolutionized mobile devices, designers suddenly had a treasure trove of new modes of interaction to leverage, like swipes, pinches, taps, double-taps, long-taps, tap-and-drag that went well beyond the point-and-click.

Now people are swiping and pinching in the air or waving tagged accessories in front of sensor-equipped devices where designers can’t expressly guide them with the standard visual cues—what is the designer to do now?

In a sense, this means designing predictable, reusable interaction patterns.

How Does This Change How Products Are Implemented?

The mobile app as the unit of design—at least in the way it has been looked at so far—is disappearing.

The standalone application is becoming the secondary, or even tertiary, destination for people to receive the content and services that products offer. How can designers realign their approaches to best meet people’s needs?

Designing less for pixels and more for bits of content and moments of interaction is the new paradigm.

Nest thermostat – component-driven design

In a world where the amount of available information and the number of competing services is expanding exponentially, the best way to make an impact is for quality information to be shared and distributed across an array of platforms and contexts.

What this means is that ideally, people are going to receive content in ways that cannot be precisely controlled, often within multiple wrappers.

Designers will be asking themselves a whole new set of questions.

  • How can content be formatted to adjust to an array of viewports and even screen-minimal devices?
  • Is there a way to package a key functionality of services that can exist somewhere else?
  • What are the most appropriate and useful interaction patterns that can be offered as actions to take within a notification?

As people are spending less time inside destinations, such as mobile apps, how can designers create experiences that can be interacted with and completed elsewhere?

Can a push notification for an upcoming calendar event give people a set of standard controls to book a flight, make travel suggestions, or order flowers without requiring the user to open the app itself?

How can designers create app functionalities that work with other apps to provide specific services to people but are also compelling enough to exceed the competition?

Future UI and chatbots for component-based design
Chatbots have become the game-changer in the travel industry. AI-powered chatbots help travelers make travel arrangements by chat.

What Does the Design Process of Tomorrow Look Like?

As moments of experiences move from device to device in a non-linear fashion, and the component is the new unit of design, how is the new object of a designer’s practice defined? It’s going to be more and more about designing experiences, not UIs.

The component in question will be defined differently in each case, with different implications for every product. Let’s look at some examples that may help designers when thinking about their products as system components, rather than as neatly-boxed destinations.

Notifications as a system of design components

In What Context Will People Receive a Notification?

Let’s start with notifications as a simple pattern.

Imagine a design for a ride-hailing service app (similar to Lyft or Uber) that echoes across multiple devices and notifies people via rich push notifications on their hired car’s position, estimated arrival time, and delays. In this scenario, the user has an iPhone, an Apple Watch, and earphones plugged into his ears.

First, the user orders the car via voice interaction on their Apple Watch. He raises his wrist to wake the watch, asks Siri for a car, and receives a voice confirmation that a car is on its way via his earphones.

It is unlikely that people would open the app and monitor the screen continually. So notifications must be packaged to be pushed to the operating system and the user via connected devices.

A few minutes later, he checks his iPhone to see the car’s position on the map and how long the wait will be. When the car is only a minute away, the app sends a voice notification to his earphones and a vibrating notification to his Apple Watch. He glances at his iPhone to confirm the car and driver’s information.

This app is looking more like a component within the operating system.

Future UI example – app-less design components with rich push notifications

If People Don’t Open Our App, What Are We Designing?

Components don’t only interact with the operating system—they may even be pulled into other apps.

For example, in a scenario where the user has a travel itinerary which may be affected by a delay, a travel app like TripIt could manage rich push notifications that the user can interact with without having to open the app itself.

If the travel app has other people with whom the itinerary is shared, the notification could be designed to present the user with an option to send an updated ETA to friends waiting at the airport in the event of a delay.

The mobile device’s notification component is merged with the travel app’s notification system, the user’s actions cascade back down the chain, and a change is made to the travel app’s status without the user ever having to open it.

If this step is taken further to include something like a voice-assistant (via a VUI), how are notifications and actions packaged and delivered where a screen-based interaction can’t be anticipated?

Apps are becoming organisms in large ecosystems that interface with other organisms and need to adapt accordingly.

Wearables on VUIs are leading the way with component-based design

The UX Components of Design Have Been Redefined in Future UIs

The unit of design from target destinations, such as a web page or a sandboxed application, is being redefined to system components that interact with each other and with people.

In many cases, these interactions are happening almost invisibly. While apps as a concept are not being eliminated, they are no longer the main event or destination.

Designers have to evolve, pivot, and redirect their focus to create products and services that adapt to thrive in multiple ecosystems. Future UIs will be spread across an array of unpredictable contexts and devices, and in the expanding ambient intelligence world, there is much for designers to contemplate.

• • •

Further reading on the Toptal Design Blog:

Why D2C brands are the future of retail

• brands, future
why-d2c-brands-are-the-future-of-retail

The hottest segment in retail is direct-to-consumer (D2C) brands. It’s also very competitive and quickly evolving, from online-only to multi-channel, with many companies adding physical stores to maintain an edge and continue growing.

Three D2C leaders, Rich Philip, co-founder and CEO of Brooklinen; Arianne Goldman, founder and CEO of Hatch Collection; and Justin Hughes, chief product officer of M.M. LaFleur, spoke about the evolution of their direct-to-consumer businesses during a session I moderated at Yotpo’s recent D2C conference in New York.

We discussed the nature of brands today, how to build loyalty, what marketing channels are most effective, the value of stores and the best advice they’ve received. Below is a transcript of our discussion, which has been edited for length.

Does brand loyalty exist anymore? Yes, but . . .

Greg Sterling: Survey data argue brand loyalty is in flames and that Millennials are much less loyal than earlier generations. What’s your response to this?

Rich Philip: I think the onus is on the brands very heavily these days because there’s a ton of competition. You need to put a lot of emphasis on creating a brand that people desire and want to be a part of for as long as possible. And that puts pressure on brands to keep evolving, to keep innovating, to keep having a new offering that’s enticing to customers. I disagree that brand loyalty is wavering. I think if you have a good product and a good brand experience, people will stick with you. You just have to do right by the customer.

Arianne Goldman: I totally agree. Hatch is a company for women who are pregnant, which can see you through your journey before, during and after pregnancy. The conversation and the trust developed with the customer is key. Loyalty is critical to success and to actually meaning something to people, which is kind of my definition of what a brand should be.

Justin Hughes: M.M. LaFleur is a direct to consumer women’s fashion brand for women that are busy and purposeful. I would say that our consumers aren’t cynical. As you look at the younger group of customers that we have coming through, I would say they’re more mission-oriented. They’re looking for something to come out of the brand. They want you to be meaningful. They want you to be sustainable. And that’s what’s driving them. They’re looking for more social proof. If they don’t get that, they’re going to move away from the brand.

Arianne Goldman: I think following a customer on their journey, knowing what they want and providing things that continue to bring them back. And letting them know that you understand what they’re going through and that you’re just not just selling stuff, you’re actually in it to be their partner through this moment or whatever moment they’re going through.

In my case, it’s a little different because I am obsessed with following the woman on her journey. So that promise to stick with her is quite different from the competition. A big box retailer might have a maternity category, but it’s not their sole focus. Hatch focuses on the woman. I gained her trust not only through great product, but by really evolving into community and letting her know that she can trust us, not just for a beautiful pair of pajamas, but also for a doula connection, or whatever, as well.

How to make (their) brands stand out

How would you describe the personality or essential characteristics of your brands? What helps them stand out?

Rich Philip: We think about the brand as a person all the time. We want to be that nice person that you’d like to be around — not that annoying person, or that abrasive person but somebody that is generally enjoyable. It comes across in the communication and giving good advice. People ask us all the time: My room is this color what do you suggest I do? I live in Minnesota and it’s really cold; what do you think I should go buy? And I think that’s a differentiated experience from our competition or the big-box stores, the department stores that don’t offer any kind of help or personalization or guidance. So if you really just take care of the customers and listen closely, then you can do right by them and that’s how you keep a customer for life because you keep servicing them on that level.

Justin Hughes: When we talk about our brand we want to make it both practical and charming at the same time. That’s a really tough intersection to hit, especially when you don’t often get to talk to people face to face in a store. We just opened up in Brookfield place, a little bit down the river, and it’s a pit-stop for women who may have spilled something on their clothes, or the office is too cold and they want to pick up a sweater, or they just want to sneak away and get a glass of rosé in the middle of the day. We try to be practical and be there for them, and be a little fun too.

Customer engagement starts with instilling connection, regardless of channel

Picking up on the idea of the customer conversation, how do you engage with the customer, through what channels: email, social media? Are you doing surveys? Tactically, what are you doing?

Rich Philip: Every channel you mentioned and then live in our brick and mortar experience. We had a pop up earlier this year and we’re opening a permanent store. But it actually started from the very beginning for us. My wife and I co-founded the company and bootstrapped it for two and a half years. We both did almost everything when we started, including customer service. You get a lot of insight by doing customer service.

We actually bake that into our employee onboarding process. Regardless of level or department, everybody does customer service for two weeks when they start at our company. The philosophy behind that is, regardless of your department or role, you can learn something that’s applicable to your team.

Arianne Goldman: Similarly, I bootstrapped the company for the first five years and really had a chance to take the brand on the road and build it organically. We were doing trunk shows and partnering with key influencers in-market and with some retailers. Women were spending 2X to 3X in-person that they were spending online. It was really that customer interaction, which definitely informed me that brick and mortar would be part of the greater strategy for Hatch. But engagement comes honestly, you can kind of pay for it at the top, but we’re also building it from the bottom: grassroots of meeting people, focus groups, talking to women about what is missing from their lives, what more can we provide them. Then we’re getting in front of them physically to make it more of a touch and feel experience.

Email is about 35% of our revenues. Having that conversation on a weekly basis, several times a week, keeping that conversation fresh and not boring is challenging. But it’s a real opportunity for us; you have to be saying things that are relevant and that matter to keep them engaged.

Justin Hughes: Talking face to face is really important. We always try to use engagement opportunities as a means to create community. Community is something we try to foster as much as we can. If we’re talking to you, chances are that somebody else in the community who’s buying from M.M LaFleur also has the same question or the same thought. And we try to turn that into an opportunity.

Every week we do a “women of the week,” where we take one of our customers and tell her story to the rest of the community. We foster community groups or dinners at our showrooms, so people can tell their stories and learn from each other — so it’s not just about us, it’s about the consumer as well.

Maintaining customer experience at scale

In the beginning, as you mentioned, there’s a lot of hands-on time. As the company grows it becomes harder to deliver the kind of high-touch experiences you’re describing. Talk about how scale has impacted your thinking about how to deliver the best customer experience?

Rich Philip: We have a lot of tools and solutions that have kind of evolved over time. I’ll start with customer service. Customer service is so critical to our business. I just want to take care of every customer and every interaction. When you hear similar questions, similar things all the time, it gives you an opportunity to automate and optimize on that.

We have several tools, AI tools that help us on the customer service side. One of those tools does the work of a few CS reps on its own for us, and it’s become very impactful to answer questions. On the website, I put a lot of pressure on our team and our e-comm team because we strive for segments of one person. Personalization is how you create the relationship with the brand. So if we knew that you bought this or you were on that page, you have a very high likelihood to take another action. And if we lean into the data, then we can really service the customer and give them something they really like.

Arianne Goldman: I’m looking at it inside-out when I think about growing the business. It’s about people first, not necessarily tech first. Building community is about how do I get in front of more people physically and personally? That to me then translates into greater revenue growth.

How to deal with customer experience missteps — and the dangers of social media

What happens when you mess up? How do you handle bad personalization or a bad experience? Give an example of what you did in response to the worst screw up you can remember.

Rich Philip: We make it right at all costs. I don’t want people going out to social media or on our reviews and just skewer us for something. A story that we tell all the time is, we lost this woman’s package and it was a Christmas present. It was like an hour and a half east of Long Island. And this was like December 23, two years ago. She went crazy on us that we lost her Christmas gift. So we put a replacement in an Uber — a $150 Uber ride — and sent it out to her. And she wrote us this long essay about how we saved Christmas for her family. That’s a customer for life, and she has been. Those kinds of little experiences really make the difference and show what a brand with a personality will do that the big box store or the department store wouldn’t do.

Arianne Goldman: Before starting Hatch, I worked at American Express for about nine years, and the card member was always right. I took that into my own company; the customer is always right. The goal is to make sure our customers feel good and happy and at any cost, making sure that their experience is protected. It’s a little more challenging for me because I’m dealing with hormonal women who really have no idea what the hell is going on in their life. So they tend to bark at us a little bit more than usual. But at the end of the day, she’s always right. What can we do to just make this experience better for her?

Justin Hughes: It’s the same for us and we always try to inject personal communication into everything we do as well. We have a lot of customers and it’s difficult when there’s a screw up because it will affect thousands of people. We always try to make sure that one of us on the executive team is always stepping in as much as we can to talk to customers directly. No matter how big the company grows we always have a touch-point and will be able to do that.

Rich Philip: One more thing; social media is a very dangerous weapon that’s out there right now. Everybody has a megaphone that they can broadcast your screw ups to everybody, and it’s dangerous. You don’t want to play with fire. So that’s why it’s worth whatever the cost is to correct those and turn the negative experience into a positive one.

Stores promote the brand in a way online cannot

Speak to the role of physical stores: important, sort of important, critical to your future?

Rich Philip: Very important to our future. Hasn’t been up until now. We’ve done a lot of work on the e-comm side, but for the next phase it’s very important.

Arianne Goldman: Critical to the future. I have two stores now. We’re going to roll out a few more in the next 18 months. But we’re not really looking at them just as stores, but as community retail experiences so that we can build the community and sell stuff simultaneously, but not just sell stuff.

Justin Hughes: They’re important for us as well. We have seven stores plus our popups, and they’re a critical touch-point to get to know our customers and foster that sense of community. They’re very difficult to scale. So, on the revenue side, they’re a fraction. We’re still trying to work out what that model really looks like so we can take that next step.

Rich Philip: Stores promote the brand in a way that online has trouble doing, I think.

Social media has become 4X more expensive

What’s the most effective channel or channels for you, and is digital getting expensive?

Rich Philip: Word of mouth referral and depends on the channel. Some channels are too expensive.

Justin Hughes: Social has gotten 4X more expensive over the past four years, and so actually we’ve been shrinking that as percentage. We’ve also been going back to traditional media, direct mail, doing events. A lot of that has been working a lot better than it had been over the past 10 years. And then of course influencers have taken over a larger percentage of our budget and time, especially as we’re tracking younger consumers today.

Arianne Goldman: Yeah, I’d say going old school and just building a brand from ground-up is going to be the sweet spot that’s going to differentiate you from everybody else.

Best advice they ever got

Finally, what’s a lesson learned or the best piece of advice you received?

Rich Philip: Somebody told me this early on, tomorrow is going to be more difficult than today. It’s super true. Watch out.

Justin Hughes: The best advice I’ve ever gotten was success breeds success. If we ever feel like we’re trying to chase after an idea, it’s probably the wrong one. We take a step back to try to look at a framework for us to get to the right answer and learn over time.

Arianne Goldman: The the best advice I got was always have a sense of humor because it just doesn’t end. It’s a big, big beast, and if I knew then what I knew now, I probably wouldn’t have done it.


About The Author

Greg Sterling is a Contributing Editor at Search Engine Land. He writes about the connections between digital and offline commerce. He previously held leadership roles at LSA, The Kelsey Group and TechTV. Follow him Twitter or find him on LinkedIn.



The Future of UX Is Our Humanity

• future, Humanity
the-future-of-ux-is-our-humanity

“We spend a lot of time designing the bridge, but not enough time thinking about the people who are crossing it.” – Dr. Prabhjot Singh, Director of Systems Design at the Earth Institute.

The UX field has changed as new and emerging technologies dominate product development. However, the true value a UX professional brings to the design process doesn’t come from tech knowledge, but from human-centered skills, and in order for UX to continue to evolve, development of these “soft” skills is crucial.

As Tech Evolves, How Should UX Adapt?

Digital technologies like artificial intelligence (AI), mixed reality (MR), brain-computer interfaces (BCI), blockchain, and voice interfaces are changing the landscape of human-computer interaction, and services like The Grid, Felipe for Sketch, and UIzard show how an increasing share of design tasks are being automated.

But where does the advancement of tech-focused tools and techniques leave the UX professional?

The Story of Phil Tippett

Phil Tippett’s story is a great example of a successful adaptation to tectonic shifts in an industry’s technology. Tippett started his career as a stop-motion animator working on Star Wars, but his shift occurred on the set of Jurassic Park.

While Tippett was building the dinosaur models for the film, Steven Spielberg saw some computer-generated dinosaurs done by another team. Impressed, Spielberg decided to make the movie with CGI instead of stop-motion animation using models. As Tippett says in Vice’s My Life in Monsters, “Jurassic Park was actually the shot in the head that killed stop motion.”

So what was his role in this new world of CGI filmmaking? What value could he bring to the table in the face of this new, unfamiliar technology?

Phil Tippetts’ story represents many elements of the future of UX design.
Still from VICE’s My Life in Monsters

While at the time Tippett didn’t know about CGI, he was already an expert in everything else that goes into the craft of feature film creature animation and understood storytelling, movement, anatomy, and filmmaking—soft skills the new CGI animators didn’t have.

Spielberg brought him back onto Jurassic Park as effects director, where he reinvented the team’s process to incorporate the best of both worlds. The film won several visual effects awards, including an Oscar, and ushered in the age of Hollywood CGI.

When the technology shifted, Tippett successfully turned to the non-technical part of his craft: his human skills. He applied those skills in a strategic way, moving into a role working with people, rather than the technology. That is one of the directions UX professionals can take in the face of shifting technology.

Human-centered Creative Skills for UX Professionals

Tippet’s true value wasn’t his skill in molding clay or bending wire. His true value was his ability to help others use their technical skills to turn digital pixels into terrifying, yet satisfying experiences for audiences around the world.

A UX professional’s true value isn’t a proficiency with wireframing or prototyping; it lies in the understanding of human nature, the knowledge of which will help set the stage for meaningful experiences. This requires a deep insight into people’s needs, the ability to craft engaging narratives, and the use of ethical design to make better products.

What are some of the most important human-centered skills UX professionals can develop while also staying on the leading edge of technology? Empathy, storytelling, and design ethics.

Empathy

When we understand people’s needs, especially latent needs they aren’t consciously aware of, then we can build meaningful products and services for them. Empathy puts us in touch with those latent needs by allowing us to “listen” with our emotions.

Human skills represent UX evolution and the future of UX.
Empathy allows us to connect with people’s deepest level of experience.

Techniques

Empathy in Action

A great example of empathy is the Philips AVENT uGrow mobile app. The app is part of a digital service that helps new parents track their baby’s health indicators (e.g., temperature, sleeping, and breastfeeding).

While temperature can be measured by a connected smart thermometer, data about a baby’s sleeping and feeding habits need to be input manually by the parent. But a pilot study with real parents showed that the UI for tracking breastfeeding was too cumbersome, and mothers didn’t use it. This presented a problem because, without accurate tracking, the service was unable to provide effective guidance or insight into the baby’s health.

The UX designer on the project, who had no children of his own, needed to figure out why the mothers in the pilot study weren’t using the feeding tracker, and design a solution. After consulting with UX researchers on the team, he still wanted a deeper, more emotional understanding of the context in which the feeding tracker would be used.

He turned to acting techniques to build an empathic connection: sense memory and directed free writing. He began by writing a letter, in character as a new mother, to her new baby. After triggering that emotional state in himself, he conducted sense memory exercises to understand the basic realities of a new mother’s experiences—right before the moment she would feed her baby and use the app.

One of the elements of the future of UX design is empathy.
A UI for tracking breastfeeding

The exercises resulted in a better understanding of what was important to the mother as she prepared for, and during breastfeeding. He made it possible to use the screen with one thumb while the other hand was holding the baby, and moved nonessential data input behind an extra tap which simplified and focused the controls, thereby creating a new way to show content that didn’t interrupt tasks in progress. Feedback from the changes was positive and usage increased.

Storytelling

Just as empathy helps designers connect with a person’s latent needs, storytelling helps designers connect with people’s latent motivations. Stories can inspire people to change their behavior or help them engage emotionally with a product or service.

Storytelling is another powerful human element of the future of UX design.
Empathy is “listening” with emotion, while storytelling is “speaking” with it.

Storytelling Techniques

Storytelling in Action

A great example of storytelling is when Philips created the Shaver 7000 series for men with sensitive skin. Philips realized that with a little coaching, the shaver could also help men with shaving-induced skin irritation (SIS). So they created a digital shaving coach as well as a smart shaver.

Seeing this project as an opportunity to leverage design storytelling, the UX lead hired a professional journalist and playwright as content strategist. Together, they created a character for both the “user” and digital coach, then wrote a story of how those characters’ relationship developed over time.

The future of UX design relies on human-centered aspects such as storytelling.
Part of the narrative map used for designing the Philips Smart Shaver 7000 digital shaving coach

This evolving, dynamic narrative provided a framework for the team’s designers and developers to understand a person’s needs over time, create content to address those needs, and build a mechanism in the app to deliver each piece of content at exactly the right time.

The digital coach they created helped all the men in their pilot study to successfully reduce their shaving-induced skin irritation.

Design Ethics

The work of UX designers and developers can literally make the difference between life and death. This is a heavy responsibility, but also a great opportunity to build trust and differentiate themselves from less ethical competitors.

Ethics represents a large part of the UX evolution.
Ethical Design Checklist via The Greatness Studio

Design Ethics Tools

Ethics in Action

As an example of ethics we can turn to Philips and the EU’s General Data Protection Regulation (GDPR), which took effect in 2018.

Philips had a Privacy by Design policy as far back as 2014. A UX designer developed the policy and the requisite guidelines, together with engaged stakeholders from the business, Legal, and IT.

Philips quickly recognized their responsibility around privacy, since many of their apps and products collect medical data about the people who use them. And because Philips’ apps already used mechanisms like short-form privacy notices and explicit consent, unlike other companies, they didn’t have to change anything when the GDPR came into force.

The UX evolution will continue with a focus on ethics and other critical human skills.
Short-form privacy notice design

Embracing the Future of UX

UX professionals are faced with a world dominated by technology, and it’s easy to be drawn in by the tools from the latest trend. However, in order to truly embrace and survive the future of UX, it’s important to master human-centered design skills while also striking a balance with UX technology.

• • •

Further reading on the Toptal Design Blog:

4-day workweeks are the future – and this is how you can make them happen

• future

Lift your head up from your desk and take a look around the office. Is the number of people at work today the same as yesterday? Probably not. Across the world, standard workweeks are already taking new shape and the United States is jumping on the bandwagon with Summer Friday initiatives and flexible hour scheduling.

It won’t be long before all of corporate America adopts four-day workweeks to increase productivity and boost company morale, while minimizing the risk of burnout and business profit loss.

Setting up shorter workweeks was a hot topic turned dream pursuit and now, it’s steadily becoming a reality. It appears to be the solution to perfecting work/life harmony in a labor market where modern employees crave ownership over their schedules and greater social freedom to experience, you know …life.

The new workplace has already edged itself into a state of flexibility that gifts employees the opportunity to work remotely, use paid time off guilt-free, and come early or late depending on the time of day their brain functions best.

Four-day workweeks are the natural next step and just may be the solution to both depleted productivity levels and the onset of burnout. Oh, and trust me: no one is disputing that the hourly adjustment wouldn’t come with some kinks to work out. The benefits of the four-day workweek far surpass that short, uncomfortable time period of transition and it’s undeniably favorable to all incoming work generations. 

Is a shorter workweek the key to happiness?

I know what you’re thinking: if we give employees an inch, they’ll eventually take a mile. It starts with a four-day workweek that turns into three, and then two, then maybe even none.

A study published in the Social Science and Medicine Journal by researchers from the University of Cambridge and the University of Salford that shows that a one-day workweek reduces mental health issues by 30 percent. To be perfectly frank, a one-day workweek isn’t sustainable or practical for any company, especially not a high-growth startup with the relative competition. Although, the cutback on standard work hours and its effect on employee happiness shouldn’t be discounted. 

Companies should keep in mind that a four-day workweek implies their commitment to mental wellbeing in the workplace, allowing employees to dial back external stress or pressure they would now be able to manage on a Friday or another day of the week. 

In 2000, the BLS began recording what’s known as the quits rate, and the number of employee quits has increased for nine consecutive years. This year, an estimated 40 percent of people will quit their job. It pays to keep your people happy and let’s be honest; a thriving state of mental health is invaluable. Companies need to prioritize their employees’ happiness and the numbers make a convincing case for shorter workweeks as the antidote to burnout and a cyclical quitting economy. 

How can companies switch to four-day workweeks? 

You’ve seen the stats, and now you’re convinced! It’s time for a four-day workweek to get your people pumped and productive. The transition process might be a bit bumpy, so you need to formulate a plan of action that effectively changes your employees’ schedule without upsetting or inconveniencing them. 

Scaling up can be done smoothly. For companies looking to adopt a four-day workweek policy, it’s best to initiate the new schedule by shortening weeks in the summer. Those companies who still operate at full capacity can integrate more remote or part-time employees if there are excessive or unexpected quarterly goals to be met.

Regardless of the tight labor market, vacancies will be easier to fill, as most people see shorter workweeks as an unbeatable perk. By starting out with shorter summer workweeks, you’re given the chance to acclimate your staff to a new way of living, which will also prove to be beneficial when the holiday season comes around; they’ll want to spend the extra day off with their loved ones.

A four-day workweek that dials down burnout is bound to ignite productivity. Along with those higher levels of productivity, comes a stronger company culture, positive employee relationships, and an elevated understanding of certain tools that make the five-day workweek unnecessary and eventually obsolete; even England is on track to instate a national four-day week by 2050. 

But, will the same amount of work get done?

Productivity and communication tools are also available so employees can stay connected to coworkers and clients even while out of the office. This is changing corporate culture and its established structure, but that’s a good thing. The traditional 9-to-5 mentality that once sucked employees dry of their energy, drive, and creativity, is bouncing back with a vengeance, and the four-day workweek makes ample legroom for these to take precedent over time.

Working from home is pretty much becoming the norm these days, for reasons that include — well, managers and HR don’t actually feel they need to stick their nose in people’s business anymore. So, that’s a moot explanation. 

The point is that working from home as a best office practice hasn’t just increased work quality, but introduced the modern workplace to any productivity and communication tools needed for collaboration, growth, and overall company success.

Keeping your teams connected and prioritizing time management those four “on” days via project and time management tools will prove just irrelevant that new “off” day is. Digital tools that streamline workflow make four-day workweeks seem less criminal and hopefully, with time, will prove to skeptics that it’s really the only way to work effectively in the long term sense. 

What do four-day workweeks mean for the future of work?

Companies are finally focusing more on employee happiness and wellbeing. Wellness isn’t just a top perk that attracts the best talent, it’s becoming a staple in people retention. Four-day workweeks are the gateway to wellness goals that companies are trying to reach.

It’s easy to just offer a yoga program or keep fruits in the fridge (which you should definitely still be doing); employees appreciate a gesture that allows them to be present in their lives outside of work, and the four-day workweek is a cure for that FOMO illness we get when stuck inside the office. 

Instating four-day workweeks worldwide can bring added value to younger generations who are renovating the workforce structure with their expectations and preferences for meaningful experiences that make an impact, both in their job and at home. With the quitting economy hosting a two-year employment rate for the average millennial, four-day workweeks could alter that stat.

Why? Because we now have proof that confirms that the happiness quotient can excel with one extra day per week to recharge. Don’t you think it’s time to stand out by putting employees and their needs first? Plus, you might save a bit of money on the bills by turning those office lights off on Thursday nights instead of Friday. 

Published September 29, 2019 — 17:00 UTC

HTTP/3: the past, the present, and the future

• future, present
http/3:-the-past,-the-present,-and-the-future

September 26, 2019 1:00PM

During last year’s Birthday Week we announced preliminary support for QUIC and HTTP/3 (or “HTTP over QUIC” as it was known back then), the new standard for the web, enabling faster, more reliable, and more secure connections to web endpoints like websites and APIs. We also let our customers join a waiting list to try QUIC and HTTP/3 as soon as they became available.

Since then, we’ve been working with industry peers through the Internet Engineering Task Force, including Google Chrome and Mozilla Firefox, to iterate on the HTTP/3 and QUIC standards documents. In parallel with the standards maturing, we’ve also worked on improving support on our network.

We are now happy to announce that QUIC and HTTP/3 support is available on the Cloudflare edge network. We’re excited to be joined in this announcement by Google Chrome and Mozilla Firefox, two of the leading browser vendors and partners in our effort to make the web faster and more reliable for all.

In the words of Ryan Hamilton, Staff Software Engineer at Google, “HTTP/3 should make the web better for everyone. The Chrome and Cloudflare teams have worked together closely to bring HTTP/3 and QUIC from nascent standards to widely adopted technologies for improving the web. Strong partnership between industry leaders is what makes Internet standards innovations possible, and we look forward to our continued work together.”

What does this mean for you, a Cloudflare customer who uses our services and edge network to make your web presence faster and more secure? Once HTTP/3 support is enabled for your domain in the Cloudflare dashboard, your customers can interact with your websites and APIs using HTTP/3. We’ve been steadily inviting customers on our HTTP/3 waiting list to turn on the feature (so keep an eye out for an email from us), and in the coming weeks we’ll make the feature available to everyone.

What does this announcement mean if you’re a user of the Internet interacting with sites and APIs through a browser and other clients? Starting today, you can use Chrome Canary to interact with Cloudflare and other servers over HTTP/3. For those of you looking for a command line client, curl also provides support for HTTP/3. Instructions for using Chrome and curl with HTTP/3 follow later in this post.

The Chicken and the Egg

Standards innovation on the Internet has historically been difficult because of a chicken and egg problem: which needs to come first, server support (like Cloudflare, or other large sources of response data) or client support (like browsers, operating systems, etc)? Both sides of a connection need to support a new communications protocol for it to be any use at all.

Cloudflare has a long history of driving web standards forward, from HTTP/2 (the version of HTTP preceding HTTP/3), to TLS 1.3, to things like encrypted SNI. We’ve pushed standards forward by partnering with like-minded organizations who share in our desire to help build a better Internet. Our efforts to move HTTP/3 into the mainstream are no different.

Throughout the HTTP/3 standards development process, we’ve been working closely with industry partners to build and validate client HTTP/3 support compatible with our edge support. We’re thrilled to be joined by Google Chrome and curl, both of which can be used today to make requests to the Cloudflare edge over HTTP/3. Mozilla Firefox expects to ship support in a nightly release soon as well.

Bringing this all together: today is a good day for Internet users; widespread rollout of HTTP/3 will mean a faster web experience for all, and today’s support is a large step toward that.

More importantly, today is a good day for the Internet: Chrome, curl, and Cloudflare, and soon, Mozilla, rolling out experimental but functional, support for HTTP/3 in quick succession shows that the Internet standards creation process works. Coordinated by the Internet Engineering Task Force, industry partners, competitors, and other key stakeholders can come together to craft standards that benefit the entire Internet, not just the behemoths.

Eric Rescorla, CTO of Firefox, summed it up nicely: “Developing a new network protocol is hard, and getting it right requires everyone to work together. Over the past few years, we’ve been working with Cloudflare and other industry partners to test TLS 1.3 and now HTTP/3 and QUIC. Cloudflare’s early server-side support for these protocols has helped us work the interoperability kinks out of our client-side Firefox implementation. We look forward to advancing the security and performance of the Internet together.”

How did we get here?

Before we dive deeper into HTTP/3, let’s have a quick look at the evolution of HTTP over the years in order to better understand why HTTP/3 is needed.

It all started back in 1996 with the publication of the HTTP/1.0 specification which defined the basic HTTP textual wire format as we know it today (for the purposes of this post I’m pretending HTTP/0.9 never existed). In HTTP/1.0 a new TCP connection is created for each request/response exchange between clients and servers, meaning that all requests incur a latency penalty as the TCP and TLS handshakes are completed before each request.

Worse still, rather than sending all outstanding data as fast as possible once the connection is established, TCP enforces a warm-up period called “slow start”, which allows the TCP congestion control algorithm to determine the amount of data that can be in flight at any given moment before congestion on the network path occurs, and avoid flooding the network with packets it can’t handle. But because new connections have to go through the slow start process, they can’t use all of the network bandwidth available immediately.

The HTTP/1.1 revision of the HTTP specification tried to solve these problems a few years later by introducing the concept of “keep-alive” connections, that allow clients to reuse TCP connections, and thus amortize the cost of the initial connection establishment and slow start across multiple requests. But this was no silver bullet: while multiple requests could share the same connection, they still had to be serialized one after the other, so a client and server could only execute a single request/response exchange at any given time for each connection.

As the web evolved, browsers found themselves needing more and more concurrency when fetching and rendering web pages as the number of resources (CSS, JavaScript, images, …) required by each web site increased over the years. But since HTTP/1.1 only allowed clients to do one HTTP request/response exchange at a time, the only way to gain concurrency at the network layer was to use multiple TCP connections to the same origin in parallel, thus losing most of the benefits of keep-alive connections. While connections would still be reused to a certain (but lesser) extent, we were back at square one.

Finally, more than a decade later, came SPDY and then HTTP/2, which, among other things, introduced the concept of HTTP “streams”: an abstraction that allows HTTP implementations to concurrently multiplex different HTTP exchanges onto the same TCP connection, allowing browsers to more efficiently reuse TCP connections.

But, yet again, this was no silver bullet! HTTP/2 solves the original problem — inefficient use of a single TCP connection — since multiple requests/responses can now be transmitted over the same connection at the same time. However, all requests and responses are equally affected by packet loss (e.g. due to network congestion), even if the data that is lost only concerns a single request. This is because while the HTTP/2 layer can segregate different HTTP exchanges on separate streams, TCP has no knowledge of this abstraction, and all it sees is a stream of bytes with no particular meaning.

The role of TCP is to deliver the entire stream of bytes, in the correct order, from one endpoint to the other. When a TCP packet carrying some of those bytes is lost on the network path, it creates a gap in the stream and TCP needs to fill it by resending the affected packet when the loss is detected. While doing so, none of the successfully delivered bytes that follow the lost ones can be delivered to the application, even if they were not themselves lost and belong to a completely independent HTTP request. So they end up getting unnecessarily delayed as TCP cannot know whether the application would be able to process them without the missing bits. This problem is known as “head-of-line blocking”.

Enter HTTP/3

This is where HTTP/3 comes into play: instead of using TCP as the transport layer for the session, it uses QUIC, a new Internet transport protocol, which, among other things, introduces streams as first-class citizens at the transport layer. QUIC streams share the same QUIC connection, so no additional handshakes and slow starts are required to create new ones, but QUIC streams are delivered independently such that in most cases packet loss affecting one stream doesn’t affect others. This is possible because QUIC packets are encapsulated on top of UDP datagrams.

Using UDP allows much more flexibility compared to TCP, and enables QUIC implementations to live fully in user-space — updates to the protocol’s implementations are not tied to operating systems updates as is the case with TCP. With QUIC, HTTP-level streams can be simply mapped on top of QUIC streams to get all the benefits of HTTP/2 without the head-of-line blocking.

QUIC also combines the typical 3-way TCP handshake with TLS 1.3‘s handshake. Combining these steps means that encryption and authentication are provided by default, and also enables faster connection establishment. In other words, even when a new QUIC connection is required for the initial request in an HTTP session, the latency incurred before data starts flowing is lower than that of TCP with TLS.

But why not just use HTTP/2 on top of QUIC, instead of creating a whole new HTTP revision? After all, HTTP/2 also offers the stream multiplexing feature. As it turns out, it’s somewhat more complicated than that.

While it’s true that some of the HTTP/2 features can be mapped on top of QUIC very easily, that’s not true for all of them. One in particular, HTTP/2’s header compression scheme called HPACK, heavily depends on the order in which different HTTP requests and responses are delivered to the endpoints. QUIC enforces delivery order of bytes within single streams, but does not guarantee ordering among different streams.

This behavior required the creation of a new HTTP header compression scheme, called QPACK, which fixes the problem but requires changes to the HTTP mapping. In addition, some of the features offered by HTTP/2 (like per-stream flow control) are already offered by QUIC itself, so they were dropped from HTTP/3 in order to remove unnecessary complexity from the protocol.

HTTP/3, powered by a delicious quiche

QUIC and HTTP/3 are very exciting standards, promising to address many of the shortcomings of previous standards and ushering in a new era of performance on the web. So how do we go from exciting standards documents to working implementation?

Cloudflare’s QUIC and HTTP/3 support is powered by quiche, our own open-source implementation written in Rust.

You can find it on GitHub at github.com/cloudflare/quiche.

We announced quiche a few months ago and since then have added support for the HTTP/3 protocol, on top of the existing QUIC support. We have designed quiche in such a way that it can now be used to implement HTTP/3 clients and servers or just plain QUIC ones.

How do I enable HTTP/3 for my domain?

As mentioned above, we have started on-boarding customers that signed up for the waiting list. If you are on the waiting list and have received an email from us communicating that you can now enable the feature for your websites, you can simply go to the Cloudflare dashboard and flip the switch from the “Network” tab manually:

We expect to make the HTTP/3 feature available to all customers in the near future.

Once enabled, you can experiment with HTTP/3 in a number of ways:

Using Google Chrome as an HTTP/3 client

In order to use the Chrome browser to connect to your website over HTTP/3, you first need to download and install the latest Canary build. Then all you need to do to enable HTTP/3 support is starting Chrome Canary with the “–enable-quic” and “–quic-version=h3-23” command-line arguments.

Once Chrome is started with the required arguments, you can just type your domain in the address bar, and see it loaded over HTTP/3 (you can use the Network tab in Chrome’s Developer Tools to check what protocol version was used). Note that due to how HTTP/3 is negotiated between the browser and the server, HTTP/3 might not be used for the first few connections to the domain, so you should try to reload the page a few times.

If this seems too complicated, don’t worry, as the HTTP/3 support in Chrome will become more stable as time goes on, enabling HTTP/3 will become easier.

This is what the Network tab in the Developer Tools shows when browsing this very blog over HTTP/3:

Screen-Shot-2019-09-20-at-1.27.34-PM

Note that due to the experimental nature of the HTTP/3 support in Chrome, the protocol is actually identified as “http2 quic/99” in Developer Tools, but don’t let that fool you, it is indeed HTTP/3.

Using curl

The curl command-line tool also supports HTTP/3 as an experimental feature. You’ll need to download the latest version from git and follow the instructions on how to enable HTTP/3 support.

If you’re running macOS, we’ve also made it easy to install an HTTP/3 equipped version of curl via Homebrew:

 % brew install --HEAD -s https://raw.githubusercontent.com/cloudflare/homebrew-cloudflare/master/curl.rb

In order to perform an HTTP/3 request all you need is to add the “–http3” command-line flag to a normal curl command:

 % ./curl -I https://blog.cloudflare.com/ --http3
HTTP/3 200
date: Tue, 17 Sep 2019 12:27:07 GMT
content-type: text/html; charset=utf-8
set-cookie: __cfduid=d3fc7b95edd40bc69c7d894d296564df31568723227; expires=Wed, 16-Sep-20 12:27:07 GMT; path=/; domain=.blog.cloudflare.com; HttpOnly; Secure
x-powered-by: Express
cache-control: public, max-age=60
vary: Accept-Encoding
cf-cache-status: HIT
age: 57
expires: Tue, 17 Sep 2019 12:28:07 GMT
alt-svc: h3-23=":443"; ma=86400
expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"
server: cloudflare
cf-ray: 517b128df871bfe3-MAN

Using quiche’s http3-client

Finally, we also provide an example HTTP/3 command-line client (as well as a command-line server) built on top of quiche, that you can use to experiment with HTTP/3.

To get it running, first clone quiche’s GitHub repository:

$ git clone --recursive https://github.com/cloudflare/quiche

Then build it. You need a working Rust and Cargo installation for this to work (we recommend using rustup to easily setup a working Rust development environment).

$ cargo build --examples

And finally you can execute an HTTP/3 request:

$ RUST_LOG=info target/debug/examples/http3-client https://blog.cloudflare.com/

What’s next?

In the coming months we’ll be working on improving and optimizing our QUIC and HTTP/3 implementation, and will eventually allow everyone to enable this new feature without having to go through a waiting list. We’ll continue updating our implementation as standards evolve, which may result in breaking changes between draft versions of the standards.

Here are a few new features on our roadmap that we’re particularly excited about:

Connection migration

One important feature that QUIC enables is seamless and transparent migration of connections between different networks (such as your home WiFi network and your carrier’s mobile network as you leave for work in the morning) without requiring a whole new connection to be created.

This feature will require some additional changes to our infrastructure, but it’s something we are excited to offer our customers in the future.

Zero Round Trip Time Resumption

Just like TLS 1.3, QUIC supports a mode of operation that allows clients to start sending HTTP requests before the connection handshake has completed. We don’t yet support this feature in our QUIC deployment, but we’ll be working on making it available, just like we already do for our TLS 1.3 support.

HTTP/3: it’s alive!

We are excited to support HTTP/3 and allow our customers to experiment with it while efforts to standardize QUIC and HTTP/3 are still ongoing. We’ll continue working alongside other organizations, including Google and Mozilla, to finalize the QUIC and HTTP/3 standards and encourage broad adoption.

Here’s to a faster, more reliable, more secure web experience for all.

Birthday Week
Product News
HTTP3
QUIC
Security

Related Posts

September 27, 2019 7:00PM

Birthday Week 2019 Wrap-up

This week we celebrated Cloudflare’s 9th birthday by launching a variety of new offerings that support our mission: to help build a better Internet. Below is a summary recap of how we celebrated Birthday Week 2019….

    By 

September 27, 2019 1:00PM

Workers Sites: Deploy Your Website Directly on our Network

Performance on the web has always been a battle against the speed of light — accessing a site from London that is served from Seattle, WA means every single asset request has to travel over seven thousand miles….

    By 

September 25, 2019 1:00PM

WARP is here (sorry it took so long)

Today, after a longer than expected wait, we’re opening WARP and WARP Plus to the general public. If you haven’t heard about it yet, WARP is a mobile app designed for everyone which uses our global network to secure all of your phone’s Internet traffic….

    By 

September 25, 2019 1:00PM

The Technical Challenges of Building Cloudflare WARP

If you have seen [our other post] you know that we released WARP to the last members of our waiting list today. With WARP our goal was to secure and improve the connection between your mobile devices and the Internet….

    By