UX Design in Healthcare: 3M’s UX Design Principal Talks User-Centred Design in Life or Death Situations


Creative Cloud

Andy Vitale has one colorful background; before getting into design, he studied TV and radio before trying to make it as a professional wrestler. A desire to work in digital brought him to graphic design, launching him down a path that would see him become the UX Design Principal at 3M’s Health Care Business Group.

In 2001, the company Andy was working for became the target of the first anthrax attack in the United States. What followed were two months of chaos and uncertainty for him, as he was tested over and over to confirm he was not affected by anthrax exposure (he eventually received a diagnosis that he was safe and healthy). After that, he vowed to improve the healthcare industry for patients and doctors. More on that part of the story a little further down, but first we asked Andy to share some insights on design that puts the user first.

How can UX designers create experiences that put the user first?

In order to put the user first, you have to involve them. Involving users throughout the process allows you to understand them. Even more than understanding them, it’s about having empathy for them. While product owners have a good pulse on the pain points of the user, they aren’t necessarily able to solve their problems, or see the bigger problem beyond an individual feature. Designers are really good at identifying user needs, whether articulated or unarticulated, and helping solve their problems.

The best way to understand any user is to talk to them. Observe them with intent. Ask them about their goals and their desired results. It should be enjoyable for them to complete their tasks, not complex. When users have to duplicate work because the product workflow doesn’t match their actual workflow, it is a bad experience.

UX designers have a lot of tools and methodologies in their toolkit. Although it may take time up front, activities like card sorts, empathy mapping, journey mapping, persona development, and creating flow charts are integral in the success of the product because they represent the user’s actual needs in a way that is very clear to stakeholders. My team puts designs and concepts in front of users as often as we can, varying in fidelity from napkin sketches to robust prototypes depending on the scenario.

That’s why Adobe XD is so useful. It provides the comfort in knowing a single tool can provide various levels of fidelity to share designs with those users. Our team has both a wireframe template and a style guide template as XD files. We can share wireframes, mockups or links directly with our customers to get qualitative feedback or validation remotely or in-person. The XD links also work well within our user testing software, allowing us to host moderated or unmoderated user testing sessions and obtain analytics and quantitative data around user performance and behavior.

What challenges has 3M Health Care faced in the past?

There wasn’t a UX team until about 3 years ago, so the emphasis on user-centered design is relatively new. 3M is a global organization with a 100+ year tradition in innovation through science and technology. In our Health Care Business Group, the business and development teams have done a good job of building a profitable and widely-adopted product without the involvement of a formal design team.

However, the customer today is very different than the customer 100 years ago, or even 10 years ago. It is no longer possible to deliver a product to market with the guarantee that customers will buy it. Today customers have access to so much information at their fingertips, which allows them to make more informed decisions when deciding between products. There is also a lot more competition in the market. 3M Health Care understood the need to take a customer-centered approach and made the investment in a UX design team.

How has your team used UX design to improve your products?

We use UX design, let’s just call it design, as our most effective problem solving tool. While every problem is different and requires a different approach, through design thinking, collaboration with business and technical teams, and co-creation/validation sessions with customers, we have been able to gain alignment quickly and early on in projects. In large corporations people often have multiple things on their plate. Sometimes moving at the speed necessary means not having the luxury to wait for an email response or trying to schedule meetings to discuss minor details. To solve these communication delays, our team has adopted a show, don’t tell, approach. By creating something visual –a sketch, a wireframe, a concept mockup– it helps people see ideas in a visual way and gets them more engaged than an email.

In organizations where design is still relatively new, especially as an internal strategic function, communicating the value design adds is part of our job. We also use design tools like workshops to educate and evangelize design. The best way to teach someone about your process or help them understand your way of thinking is to have them experience it. This not only exposes them to your problem solving process, but lets them see added value of the designer’s lens first hand.

3M Design Center, St Paul, MN, USA.

At the end of the day the main way to inject UX design into a company is execution. The more results you achieve, the quicker your case studies are being communicated up the corporate ladder. Designers are great at storytelling, so helping the business tell their story provides us with the opportunity and visibility to influence that story. When you advocate for the user and their perspective and begin to involve them, you start to solve the customer’s problems, which also solves the business problems.

One of the most effective things we have done to build customer empathy with stakeholders is to facilitate journey mapping workshops with stakeholders and give their perspective of the steps, touchpoints and emotions of our users as they use the product. We then hold the same session with our users and report the findings back to our stakeholders so they can start to see and understand the gaps between the two perspectives.

What’s your number one tip for UX designers facing their own challenges creating positive experiences for users?

You have to realize that neither you, nor your stakeholders are the user. Even if you are potentially a user, you still have to understand the behavioral trends of a larger subset of your users. Spend time with them; building a relationship between users and your product is major piece of the puzzle.

UX designers also have to be aware that customers aren’t always aware of possibilities or solutions they can’t envision. Most likely, they aren’t cognizant of technical or business limitations. This is further justification for the need to be transparent with users and their goals. Transparency builds trust, which makes working together to solve user problems that much easier.

Emotions are powerful and tend to be extremely positive or negative. UX designers should be validating solutions with users along the way so there isn’t a less-than-delightful experience that would warrant an unexpected strongly negative reaction. Once a product is released, the UX team should continue to iterate and improve the solution by working with users because business, customer, and industry realities change over time. Designers can gain a lot of empathy for users by watching them struggle to complete tasks on a product they once loved using.

Adobe XD also comes in handy here. It has made it easier and faster to communicate concepts with team members, stakeholders, and customers. In the past there may have been an interaction designer, visual designer, and front-end developer working together through a series of handoffs around next steps. Now our smaller team can leverage XD to create wireframes, comps, or clickable prototypes more quickly, gaining alignment before creating robust designs or prototypes.

What has been really helpful is the ability to send a video clicking through the workflow to stakeholders, allowing them to easily see and understand the intended functionality. The development teams also enjoy having a reference to some of the interactions.

3M Design Center, St Paul, MN, USA.

Why is it so important to you, in your role, to create experiences with the user at heart?

In 2001 I was working at a company in South Florida that published The Enquirer, Star, Sun, Weekly World News, and more – basically all of the tabloids. We were the first anthrax attack in the United States. Shortly after us there were more publicized attacks of anthrax being mailed to media outlets and politicians. One of my co-workers died as a result. There wasn’t a lot of information around anthrax at the time and it felt like even less information was being shared to those affected.

I remember getting a call from my dad, telling me that he saw my company on the news and that we were required to go to the Health Department. During a very chaotic time we were required to sign paperwork and undergo testing for anthrax exposure. I remember being in a hotel ballroom with the FBI, CDC, and Florida Department of Health and being told that there wasn’t much certainty about what was going to happen. We were tested weekly, and sometimes called and told that everything was OK, only to be called again to come back for another nasal swab because the tests were inconclusive. This continued for about two months.

I’ve directly experienced the effects of a poor healthcare experience and the distrust, anxiety, and feeling of helplessness it causes. While my story was unfortunate, I have heard a lot worse. When it comes to health care, the slightest error can not only have financial implications to all parties, the difference can be life or death. To me, there are no higher stakes, which is the primary reason that drives my cause to improve the healthcare industry.

Get more UX advice from Andy Vitale on his Medium page or follow him on Twitter.

Iteration Without Alienation: Instagram’s Masha Ioveva Shares Her Tips For Growing A Live Product


Creative Cloud

“Always apply to work with the best designers you can reach.” That’s been Masha Ioveva’s guiding career principle. It’s a mantra that’s taken her to some of the world’s top companies, including Apple, and eventually brought her to Instagram, where she is now one of those “best designers” in her own right. As one of the social media giant’s Senior Product Designers, Ioveva strives for constant change and iteration; always pushing Instagram in new directions to maintain the app’s colossal success. So how do you constantly innovate and iterate without alienating your users? We asked for some of her best design advice.

What’s the best way to go about making changes to a live app without compromising UX?

Truly great products don’t stick to an experience that is fixed in time. Our devices and their capabilities are evolving and so are our expectations for what makes a fantastic user experience. Innovative patterns over time become established best practices and make space for new innovations. For an app to be intuitive and delightful, it has to keep up with the changes around us. It really has to be current to have good UX, so it must always be changing.

When designing for a product that is ‘live’ and growing daily, I’m reminded of that moment when Alice meets the Red Queen in Through the Looking Glass and they start running as fast as possible only to remain under the same tree. The Queen explains:

“Now, here, you see, it takes all the running you can do, to keep in the same place.

If you want to get somewhere else, you must run at least twice as fast as that!”

So you run twice as fast at Instagram?

We run as fast as possible to keep the app feeling simple and relevant while introducing new features. One way to do that is to make sure that new design patterns feel like natural extensions of established ones. It’s easy to see how story rings, the colorful gradient outline of the profile picture, have quickly become a staple not just at the top of Instagram’s feed, but next to each post, on people’s profiles, and even in search results. This pattern for activating a profile to show there is new content is reinforced throughout the app. It encourages people to both see their friends’ daily activity and share their own.

We also take time to understand the use cases behind different behaviors. The way people share and express themselves, for example, has changed a lot over the past five years. Our community wanted more ways to share quickly and casually. So, we made changes to the app and introduced features like stories, disappearing messages and multiple photos and videos in a single post.

What’s your long term strategy at Instagram?

Because people’s behavior changes over time we are constantly reviewing our previous assumptions and making adjustments. Even though direct messaging was built into Instagram as a conversation platform we knew it was widely popular for sharing funny memes and discussions within groups. When we had to choose where to send people who wanted to comment on a story, direct messaging felt like a natural extension. This introduced more people to messaging inside the app and led us to more ephemeral content sharing.

As design thinkers, we also look for opportunities to create extensible systems. As we add features to the stories camera like stickers, drawing tools, live broadcasts and integrated boomerangs, we always make sure creative tools exist as a system that works together.

Is an app ever ‘good-enough’? Should you always be striving to iterate even if the users are happy with the existing product?

Never underestimate the value of change! We want people to be excited to try new things and able to master new interactions quickly. A useful product design goal for me comes from Csíkszentmihályi’s idea of helping users achieve a state of flow. This means people can derive both enjoyment and accomplishment from new features while staying immersed in the app. So yes, we want to always look for new ways to surprise, challenge, and ultimately captivate our users.

What’s the best part about creating subtle changes in Instagram?

The best part about working on a dynamic product is seeing whether and how quickly the community adopts a new idea, then racing to design the next extension for it. Sometimes new ideas are adopted and transformed in ways we never imagined and that gives us more ideas to build on to. It’s a wonderful race through the Looking Glass.

See more of Masha Ioveva’s work on her website or follow her on Instagram.

Professional Brochure Templates


Creative Cloud

Photoshop and Illustrator comes with professionally-made Adobe Stock brochure templates to launch your projects faster, for both paid and trial Creative Cloud users. All you need to do is sign in to your Adobe ID and download. Our templates have three distinct benefits that separate us from the rest:

Quality
There are a variety of brochure templates available for use, with options for beginners as well as more experienced designers. All Adobe Stock templates go through a quality assurance process to ensures the best experience for our users.

Integrated and easily accessible
Our templates are available on the Adobe Stock website, but many are also directly integrated in our design apps. When you create a new document, you can browse these templates directly in the “New Documents” dialog.

All-inclusive
Lastly, all Adobe templates are optimized with our apps in mind. This means that all fonts used are available on Adobe Typekit and the template files are created with best practices in mind specific to each design app.

Professional Tri-Fold Brochures by Creativedash (PS) – Free Download at Adobe Stock

Modern Tri-Fold Brochure by Owen Jones (PS) – Free Download at Adobe Stock

Simple Tri-Fold Brochure by Owen Jones by (AI) – Free Download at Adobe Stock

Brochure with Instructions by Adobe Stock (AI) – Free Download at Adobe Stock

XD Essentials: Breadcrumbs


Creative Cloud

Navigation can make or break the user experience of a site. It helps users to locate themselves on a site, and figure out how to get to where they want to go next. Of course, it’s important to get the big things right when it comes to designing a primary navigation or you will have high bounce rates and unfinished user flows. However, practical experience shows that getting the small things right is equally important, such as the breadcrumb trail.

In this article, we’ll explore the use of breadcrumbs on websites, and discuss some best practices for applying breadcrumb trails to your own website.

What Are Breadcrumbs?

Breadcrumbs are a set of contextual links that function as a navigation aid for websites. Basically, it’s a secondary navigation scheme that reveals the user’s location in a website. The term comes from the Hansel and Gretel fairy tale in which the two children drop breadcrumbs to form a trail back to their home.

A trail of breadcrumbs can show you all the places you have been. Image credit: howstuffworks

Just like in the tale, breadcrumbs in real-world applications offer users a way back to a site’s starting point. There are three different types of breadcrumbs represented in websites – location, attribute, and path.

Location-based

Location-based breadcrumbs show the current position within a site’s hierarchy and enable the user to quickly navigate through levels of a site. They reduce the number of steps needed to navigate to a higher-level within a website.

Location based breadcrumbs help a user go to a broader category (higher-level page) from the page they are on.

 

Attribute-based

Attribute-based breadcrumbs enhance the breadcrumb trail with attributes of the current content. They are commonly used on ecommerce websites that implement faceted classification. Here’s a good example from online retailer T.M.Lewin – you can navigate around within the product catalog by product category and filter the view by particular properties.

Breadcrumb trails on T.M.Lewin website show the attributes of the items displayed on a particular page.

 

Path-based

While two previous types of breadcrumbs were about hierarchy, this one is all about history. Also known as ‘history trail,’ these breadcrumbs enable users to see the path they have taken to arrive at a given page.

Path-based breadcrumb trails created dynamically and display all pages the user has visited before arriving on the current page. Image credit: Oracle

Even though path breadcrumbs are most like their fairytale ancestors, they are infrequently used on sites. In most cases they are useless since they duplicate functionality offered by the “Back” button.

A rule of thumb for breadcrumbs is to show the site hierarchy, not the user’s history. Thus, try to use location-based / attribute-based breadcrumbs, not path-based ones.

When Should I Use Breadcrumbs?

Deciding whether to use breadcrumbs largely depends on how you’ve designed your website hierarchy. A proper way to determine if a website would benefit from breadcrumb navigation is to create a diagram representing the website’s navigation architecture, and then analyze whether breadcrumbs would improve the user’s ability to navigate within and between categories. In general:

  • You should use breadcrumb navigation for websites that have hierarchically arranged pages (3 levels or more). An excellent example is ecommerce websites, in which a large variety of products is grouped into different logical categories.

An example of site with 4 level content hierarchy.

 

  • You shouldn’t use breadcrumbs for single-level websites that have no logical hierarchy. Including breadcrumbs in this case is unnecessary and potentially confusing to users.

Why Should I Use Breadcrumbs?

Breadcrumbs serve as an effective visual aid, indicating the location of the user within the site’s hierarchy. This property makes breadcrumb navigation a great source of contextual information for users and helps them find answers on the following questions:

  • Where am I? Breadcrumbs inform site visitors of their location in relation to the entire site’s hierarchy.
  • Where can I go? Breadcrumbs improve the findability of site sections or pages. The structure of the site is more easily understood when it is laid out in a breadcrumb than if it is put into a menu.
  • Should I go there? Breadcrumbs communicate content value and encourage browsing. For example, an ecommerce site visitor might land on a product page directly from the search engine’s results, and while the product itself might not be a good match, the visitor still might want to view other products from the same category. Thus, breadcrumbs reduce the overall site bounce rate.

In addition they have a number of other undoubted advantages:

  • Reduced number of actions. Breadcrumbs reduce the number of actions a site visitor needs to take in order to get to a higher-level page. Instead of using the browser’s “Back” button or the site’s primary navigation to return to a higher-level page, visitors can use the breadcrumbs. A study conducted by Hull, S.S. (2004) found that users who received instruction to use breadcrumbs completed tasks much faster than users who didn’t use them.
  • Takes up very little space on a page. Breadcrumbs are a compact mechanism that don’t take up much on a page. They have little to no negative impact in terms of content overload.
  • No user suffer problems because of Breadcrumbs. Breadcrumbs never cause problems in user testing. Users pay attention to breadcrumbs only 30% of the time; when they do, it helps and even when they don’t, it doesn’t cause any harm.

How Should I use Breadcrumbs?

Using breadcrumb trails is a fairly straightforward affair, and there are only a few things to consider before deciding to implement them on a website:

Breadcrumb Don’ts

Don’t use breadcrumbs as a replacement for primary navigation

Breadcrumb navigation shouldn’t replace effective primary navigation menus. Main navigation should be the element which leads the user, while breadcrumbs should only support the user. Relying on breadcrumbs as a crucial method of navigation rather than an extra feature, usually, is an indication of a poor navigation design.

Don’t use breadcrumbs on the homepage

The homepage is where the user journey starts, it doesn’t make sense to have breadcrumbs displayed on your homepage.

Don’t make the current page a link

Make sure that the last item in the breadcrumb trail (current user’s location) isn’t clickable. Since users are already on the page, it does not make any sense to add a link of the current page to the breadcrumb navigation. A user might get confused when clicking on a link that leads to the same page again.

Don’t make breadcrumbs the focal point of your design

Stay away from fancy fonts and bright colors because these will go against the purpose of using breadcrumb navigation. A rule of thumb to follow when sizing and styling your breadcrumb trail is that it shouldn’t be the first item that grabs the user’s attention when landing on a page. The breadcrumb trail in the example below isn’t bad, but it’s too eye-catching and might distract visitors from the primary navigation and main content.

Image credit: Alex MacDuff

Breadcrumb Dos

Put the breadcrumbs at the top

Main navigation is typically placed at the very top of a website. Because breadcrumbs work as a secondary navigation aid, it should be placed above the content, but below the main navigation bar and above the page title.

Start trail with a homepage

A breadcrumb trail should begin with a link to the website’s homepage and end with the current page. Including the homepage in the trail acts like an anchor giving a strong sense of orientation to users.

Use arrowheads, not slashes as separators

Separate each level with clarity. It’s recommended to use a more-than sign (>) or arrows pointing to the right (→), because these symbols signal direction.

A forward slash (/) isn’t recommended as a separator for ecommerce sites. If you’re going to use it, you have to be certain that no category will ever use a slash:

It’s hard to distinguish different levels for this trail.

Single out the current page

Use a different style on the last item of a breadcrumb list to establish that it’s the currently viewed page.

Differentiate where the user is by making the current level bold or changing its color.

 

Select a proper size and padding

Think carefully about target size and padding when designing. There should be enough of a gap between different breadcrumb levels, otherwise people might find it hard to use them. At the same time you don’t want your breadcrumbs to dominate the page, thus they should be less prominent than the primary navigation menu.

Breadcrumbs at Google Search Console Help has a good spacing between targets.

Pagination and breadcrumbs

If you have paged content, you should add the first element and the current element of the paginated content in your breadcrumbs.

The link “Integrated cookers” in the example above links to the first element of the paged content “Integrated cookers” and allows the user to jump back to the start of the pagination.

Conclusion

Breadcrumbs are one of the few simple things that enhance usability and fosters user comfort. It makes it easier for visitors to move around a site, and helps UX designers present information in an easy-to-find way. And that’s a sufficient contribution for something that takes up only one line in a design.

Premiere Pro 11.1.1 update

Creative Cloud

Today we’re releasing an update for Premiere Pro CC 2017. The 11.1.1 update contains two important bug fixes, and is highly recommended for all users.

You can install the update through the Creative Cloud desktop application, or you can check for new updates from within any Creative Cloud application by choosing Help > Updates. Please note that it can take 24 hours or more for all of our global data centers to receive the update. If the update isn’t available for you right now, please check back later.

The 11.1.1 bug-fix update for Premiere Pro addresses an issue with the recently introduced feature to clear the Media Cache Folder automatically after 90 days.

The update changes the behavior of the media cache deletion. With 11.1.1, only files that are within the Media Cache folder’s subdirectories will be deleted. Files that sit next to it will no longer be affected. However, we still strongly recommend keeping the Media Cache folder separate from your original media.

If you want the cache files to be available for a longer period of time (the default is 90 days), it’s easy to change the preference by going to Premiere Pro CC -> Preferences -> Media Cache.

The second issue addressed with this update is a variation in peak amplitude when normalizing all peaks on audio clips. This no longer results in extreme positive or negative values.

May Visual Trend Exploration: The Mindful Photographer


Creative Cloud

This month we’re thinking about images with a purpose. There are lots of purposes for photography — to persuade or document or earn a living. But what if the act of taking the image is its purpose? We talked to Ja Soon Kim, a photographer and veteran yoga and meditation teacher about photographing mindfully.

Finding your vision, not someone else’s.

Ja Soon is thinking a lot about Instagram these days. “I’m older than most Instagramers,” she says. “I see all these young people hopping in a car, driving thousands of miles, or flying to faraway lands, and they end up taking pictures that look a lot like what everybody has already posted. I think, ‘You went there, but did you really see what was there?’”

In Ja Soon’s view, photographers of the Instagram age can be so focused on capturing that “it” shot that they forget to experience the moment and develop their vision. “Your own vision has value. Post what you like, and post what you see,” she advises. “You don’t have to go far. I live in the desert, so that is what I see. I see the changes in seasons. I see the beautiful natural phenomena in a desert that’s carved by water and wind. I travel, too, but I always take pictures of what’s right in front of my eyes.”

JA SOON KIM / ADOBE STOCK

Wander (not too far), and bring a bag.

One of Ja Soon’s signature techniques is the flat lay. She gathers items, arranges them thoughtfully, and captures their images from above. The subjects don’t have to be exotic or even traditionally beautiful. Instead, they are the bits and pieces from a walk, or a moment that captures her thoughts.

“Wherever I go, I usually have a little bag with me to collect things. Sometimes the things don’t have any value to the general public, like a leaf, but I bring them home,” she explains. “I have a very simple setup by the window, and I arrange them until I’m really happy with them. For me it’s a time of quietness, a time of contemplation, and even meditation. It’s just being with what you’re seeing and being with that particular moment, because our memories are made of moments. They’re not made of days or trips.”

JA SOON KIM / ADOBE STOCK

After a recent desert snowstorm, Ja Soon watched her neighbors sweeping away bark that had fallen from the trees. But she saw beauty in the shades and textures of the dropped pieces, and collected them for a future flat lay. “There are even days when I go outside my door and collect a few pine leaves,” she says, “and that can be a satisfying flat lay.”

Ja Soon is fortunate to live close to an expansive scenery of mountains and desert, but her favorite photography strategy is to lose herself in the small details of a moment. “Things present themselves to me, but you have to look closely. If you look really close, you’ll see this tiny nest in a tree, and there’ll be a little bit of a cracked egg in it. That’s beautiful.”

Paying attention means Ja Soon witnesses life in ways that are small but also profound. For example, recently she was walking through a park and noticed feathers on the ground. “I realized a lot of the feathers were from a crow. They’re black. Then, I saw a few that were the chest feathers of an owl. There were more black feathers, so obviously the owl ate the crow. I was astounded, looking at it and thinking about this battle of life, so I collected the feathers and made a picture. It was a documentation of how life really is.”

Photo courtesy of Ja Soon Kim

Be in the moment.

As Ja Soon describes it, an in-the-moment approach to photography doesn’t just change your photographs, it changes you, too: “It makes me more mindful about what’s around me, and it makes me more present. That sounds so abstract, but it just means that you are paying attention to each and every passing moment. When I am out collecting, sometimes I totally lose myself. I am no longer identifying myself with who I think I am, I’m just lost. That’s the crux of meditation, too — you lose yourself to much bigger things.”

See more mindful images in our dedicated Visual Trend Gallery.

Free InDesign Magazine Templates


Creative Cloud

Whether you have a paid or trial subscription of InDesign CC, you can download and use any of the InDesign templates below. Templates are a good way to get inspired or, if you’re a beginner, it’s a good way to get acquainted with the potential of InDesign. Don’t forget to check out the digital magazine templates: With InDesign you can publish interactive magazines online using the Publish Online feature.

Minimalist Magazine Layout by Teweka DesignFree Download at Adobe Stock

Art and Culture Magazine Layout by The Royal StudioFree Download at Adobe Stock

Food Magazine Layout by ThemzyFree Download at Adobe Stock

News Magazine Layout by Tom SarraipoFree Download at Adobe Stock

Creative Digital Magazine Layout by The Royal StudioFree Download at Adobe Stock

Adventure Digital Magazine Layout by Tom SarraipoFree Download at Adobe Stock

Arte Digital Magazine Layout by Tom SarraipoFree Download at Adobe Stock

May Update of Adobe XD


Creative Cloud

Header image includes work by Simon Waloszek

Last month, we shared our roadmap for some of the new features coming in Adobe XD, and this month’s release brings us another step closer to realizing this vision. This month, we’re making some significant strides toward aligning our two desktop platforms, while releasing the first in a group of new features coming for both desktop platforms in the upcoming months.

New in Windows

Next generation layers

You’ve been very clear: one of the most highly requested feature on Windows 10 has been the Layers Panel. Now, in our May release, you can access the Layers Panel by pressing Ctrl+Y or selecting the icon in the lower left hand side of the application screen. You can use Layers for selection right now, but you won’t be able to drag and drop layers to change the Z-order yet. You’ll be able to use this feature soon in XD.

Updating shared prototypes

In this release, you can now update your shared web prototypes instead of always having to create new prototypes. Open the Sharing pop-up and click “Update” to share to the same link you had before. Your reviewers can simply refresh their link to see your new content.

PDF export

In addition to exporting to PNG and SVG, you can now export to PDF as well. Select an individual asset, an artboard, or a group of artboards to export to PDF. You can also select multiple artboards to export as a single PDF.

Copy and paste from the File Explorer

Importing assets became even easier through pasting through the File Explorer. Now, you can copy from the File Explorer and paste into XD to import the file.

Expanded language support

Bienvenue! Willkommen! XD for Windows 10 now supports French and German. You can see your UI in these languages by setting your default language in the Region & language settings panel in Windows 10.

Copy with Interaction

In this month’s release on both Mac and Windows, you can now paste objects with their wires. Copying and pasting (as well as duplicating) an object in Prototype mode will now maintain its wire, allowing you to reuse objects with interactions–like that home button–quickly, without having to rewire. If you copy and paste a set of artboards with wires in between them, we’ll maintain the interactions between them, saving you time as you iterate on your designs and transfer interactions from one file to another.

In upcoming months, you’ll be seeing some pretty major features land that will open up new functionality for both Mac and Windows.

===

Earlier this month, we ran a contest where you submitted a profile page designed in XD. We were thrilled to see what you were able to create using our tool. Seeing your submissions, whether shared on Behance or over Twitter using #MadeWithAdobeXD, continues to fuel our own commitment to bringing you a fluid, performant experience to let you do what you do best: design engaging workflows for your end users.

Social

We’d love to continue the dialogue! You can follow our handle @AdobeXD for updates or reach the team on Twitter using the #AdobeXD. You can also talk to us using Facebook, where we share videos and updates as well as answer questions during live sessions.

Meet some UX designers who have used Adobe XD. Learn how they got started in UX design and their creative process; check out some of their work and listen to their favorite tunes.

#MadeWithAdobeXD

While sharing your prototypes on Behance, don’t forget to tag them with #MadeWithAdobeXD and select Adobe Experience Design under “Tools Used” for the opportunity to be featured in the Adobe XD Newsletter.

May Update for Audition CC 2017.1

Creative Cloud

The Audition team has just released an update to the Spring 2017 release of Audition CC to address some critical bugs that were discovered after release.   While not an exhaustive list, the highest priority issues fixed with this update include:

  • Severe error and/or crash when using Noise Reduction effect
  • Clip volume keyframes lost when using Convert to Unique Copy
  • Severe error when using Automatic Speech Alignment with clips of drastically different durations
  • Support for Panasonic GH file decoding
  • Remix now correctly supports clips referencing channels of a multichannel file
  • Potential crash on macOS when home folder located outside of /Users/
  • Additional stability and performance fixes

We always aim for stable, bug-free releases, but sometimes late changes can evade our manual and automated testing and prerelease users and sneak into the wild.  Thanks to all our customers who shared their incident reports through our bug reporting site, on our forums, or via facebook and twitter.

You can download this update by launching your Adobe Creative Cloud desktop application or selecting Help > Updates… in Audition.

UXperts Weigh In: Designs We Love, May Edition


Creative Cloud

May is in full swing, and for many of us that means a fresh start is on the horizon as the seasons change. It’s a perfect chance to check out some new designs, get inspired, and do something great. We’ve tapped a few of our favorite UXperts to share the websites or apps they’re loving, right now, and tell us why they’re examples of fresh design.

Jack Morgan – Designer at Duolingo

Pick: Google Fonts

I’ve been really enjoying the new Google Fonts. It embodies what I think of as good old-fashioned graphic design. It’s as if they took The Vignelli Canon and applied it to a highly-functional tool for finding web fonts.

There’s this timeless approach of big, beautiful typography paired with a solid grid system and strong colors. When you compare the new design to previous versions of the product, it’s obvious that this was a very bold and creative redesign of a project that has traditionally focused on function over form.

The Google Design team wrote a great little case study on the UX challenges they faced with the design, including notes like “users don’t know what the number means” and “users were confused about these icon.” It’s proof that if you don’t user-test, even the best design can contain big flaws.

Mandavi Kaushik – Senior UX Designer at Travel Supermarket

Pick: Sweat with Kayla

I was looking for a healthy lifestyle app which supports a workout plan as well as a nutrition plan. Sweat with Kayla does the job. The app is engaging and keeps motivating you to do your best. The set timed workout videos keep you motivated and the workout music is a bonus. The app is easy to follow and as a first time user I was able to navigate the journey with ease. It also allows the users to easily jump from one section to the other and I always have full control on how I want to use the app. The visual look and feel is inspiring and guides you along the user journey.

I found the app on Instagram, and it would make sense to bring some more social elements to the app. There are a few areas where it can be improved further, especially around reminders and sending positive messages, and the food advice content can be made a bit more engaging.

Shane Mielke – Freelance Designer at Shane Mielke

Pick: For Honor – Scars

In a world where good design is slowly becoming boring product websites with formulaic scrolling UX grids and static photos, experiences like this are becoming rare. It leverages all of the unique interactive design techniques and assets and creates a great immersive experience.

During the preloading, your senses are teased by audio and video that create an emotional response, keeping you interested and setting the tone for the product and experience. As the site opens, you’re treated to a beautiful 360 animation which lays the groundwork for understanding how to navigate through the character choices. Every navigation element or background element yields a silky smooth interaction animation letting you know how the item should be used.

Upon choosing a character, the site continues to keep you engaged in the storytelling process by requiring you to actively scroll through different poses, and clicking items to view and digest the content piece by piece. This is great design because, just like a movie with great cinematography, you can stop at any point in this experience and see the beautiful layout, background, and content regardless of the context.

Kenji Arakawa – Senior Experience Design Manager at Adobe

Pick: Bear

I write a lot of notes through the course of the day for work and for my personal ideas. My go-to app for notes had been Evernote, but when I want something similar I use Bear. I love how focused it is.

It’s also beautiful, which isn’t what you’d naturally expect from a utility – but you should. Although Avenir (Next) does tend to get a bit overused these days, it manages to somehow feel unexpected in a text editor. It’s a tasteful and quiet typeface that still has some personality and it works nicely with the pictograms they’ve designed for the UI.

I also love how Bear handles markdown. I’ve gotten really used to using markdown for formatting since it appears in a lot of tools I use, like Trello. What’s really nice is that Bear makes it easy to use keyboard shortcuts (or icons) to quickly format markdown, and it visually displays the formatting inside the tags. It’s a nice touch.

As a bonus, try tapping on the info icon. When was the last time you saw mundane document information presented so beautifully? The elegance of Bear’s experience reminds me a lot of how I felt about Medium when I first saw their editor: refreshingly focused and intuitive.

What websites or apps are you loving right now? Let us know in the comments!