Boiling the Ocean on the Macy’s Mobile App Design Challenge
Likely an F minus toward getting hired, but A+ at cross-disciplinary forensic analysis / UX standup comedy? TBD.
I was asked by the head of UX at Macy’s to redesign its consumer-facing e-commerce app as a design challenge for a contract role. Yes, we’ve all been there, FML. While some may feel that design challenges are a waste of time, unethical, or otherwise demeaning or irrelevant, my reasons for agreeing to do this one are as follows:
Designing without a brief is the purest form of creative freedom — especially the freedom to be wrong, which often leads to creative thinking in-between the margins. So much of what passes for design—especially in software—are known patterns. This is just as true of UX/UI conventions as patterns of belief, (which sometimes too quickly) convert to rules. Not everyone is comfortable with the fact that rules are meant to be broken. Conversely, not having constraints from the gate can also lead to valuable insights which might otherwise be overlooked within an organization. Win-win.
The process of being a “forensic investigator” of digital products is a thrill — it’s a super fun and creative way to stretch skills. More importantly, to have a point of view. It forces you to research “outside your lane”, which leads to new knowledge to bring back into it. As a “hunter brain” type of design thinker, my lane is very broad—bordering on borderless.
Design challenges are a viable creative framework for discussing ideas on Medium. For me, this is far more valuable than even the contract opportunity itself.
Lastly, Macy’s is at an interesting inflection point in terms of their relevance and brand, and there are a few larger themes I wanted to write about. I also have a soft spot for Macy’s and want to see them thrive.
• Download the Macy’s app, screen capture the basic architecture front-to-back.
• Peruse and codify customer feedback by reading app store reviews (ITMS).
• Competitive analysis of other e-commerce apps, as well as research into Macy’s “state of existence” in the overall market—which led me to learn about some cool things they’re doing—unfortunately just not in their app.
• Proposed improvements, based on several “thesis statements”, which I’ll get to a bit later.
Numerous low-hanging-fruit usability issues. Easy fixes that would be hard to argue against, but in aggregate markedly drag the UX down—some of which are causing customers to bounce.
Creative delight within the Macy’s app is asleep at the wheel, like Jim Morrison. Differentiation begets attention. Gary Vaynerchuk refers to this as White Space — a concept he co-opted from designers, but re-made in a far more relevant way to our time in history.
White space is the unclaimed territory that every creative designer lives for, because it’s often overlooked, and its where exponential value is created for businesses. From my view, Macy’s isn’t enabling the kind of forward-thinking mindset in the digital product as its begun with its retail strategy. More on that later too.
The first order of business from my view is somewhat of an emergency. A stop the bleeding situation. And it’s an area that designers are typically told to butt out of. So let’s dive right in, shall we? I live for danger.
Macy’s Sore Red Thumb
A Sore Red Thumb™ is a glaring problem that spans across UX to Marketing, all the way up to the executive suite. It’s a flawed* business model that often appears inside the UX.
*Totally just my opinion, man.
I want to use the opportunity as an outsider to discuss this problem with the wider online design and business communities, and present alternatives.
It goes without saying there are things I don’t know, haven’t considered, or am flat out wrong about. There’s only so much one can uncover in a day or two. And perhaps it’s weird to frame these statements in the context of a “design tryout”. My goal is simply this: to create value. Designers are often extremely limited in how much value they can create, and their work (UX/UI/Marketing/Brand/Etc.) is often so siloed and segmented that they aren’t allowed to solve bigger problems, or think beyond screens into business models, market conditions, and changing consumer dynamics.
One of the hidden benefits of these types of exercises is being afforded a “beginner’s mind” on steroids—if true power lies in creativity, it must be unencumbered by deeply held pre-emptive conclusions or beliefs that are often barriers to major opportunity. Effective persuasion and change often comes—not from within the corporate structure—but from outside its gates.
The designers I admire affect real change in the world. My goal isn’t to finger wag or takedown, but to empower design thinking that recognizes systemic flaws that exist outside of our lane, to make the case for far better outcomes than what is typical for our domain alone to achieve. These battles are the hardest to win, but the spoils are worth it.
🚨 The Crime Scene 🚨
** Note my enlargement of the type below the ITMS carousel of app screens. It says EXCLUSIONS APPLY NEW APP CUSTOMERS ONLY—I think? It’s definitely not legible at a glance. </RedFlag 🚩>
<Putting on my New User Persona Hat 🎩>
One of the first things that stood out to me when downloading the app is the 25% off promotion, which (as a new user ready to go shopping), I was pretty stoked about—learning that I’d get 25% off my first order is definitely what caused me to download the app*.
</New User Persona>
*Multiple ITMS reviewers, complaining about what happens next…
“Aww, come on, that’s not really a smoking gun, Sean. All marketers love/need fine print. Get over it! …Pretentious Designers, sheesh!”
I get it, but just wait—that’s just preamble, the punchline’s yet to come.
New customer is stoked, downloads the app, and then goes through 4 screens of general bling / categorical merchandise, while agreeing to things (location services, push notifications), to enhance the experience.
My first thought was it’s a lot of screens to get someone in the door. You wouldn’t make a new customer wade through a mile of litter to get to the goods in retail, so why do that here? Replace the generic product catalog imagery with relevant imagery supporting precisely how Location Services and Push Notifications enable a superior shopping experience, and consolidate those to one screen. It then dawned on me that the entry funnel has little to do with app set-up, because it resolves on this next screen, where we see the 25% OFF promotion again, but in a significantly altered form:
This should be rethought.
— The user’s first experience being inside the app shouldn’t be a popup ad.
— the customer hasn’t even found anything they want to buy yet.
— The language is deceptive and doesn’t map to Macy’s core values of putting the customer first and integrity — if you try to trick the customer, you may win in the short term, but you’ll lose long term. First off, the “Extra 25% Off” promotion was supposed to be for my first app order, remember? The modal popup here says “Your Next Order”. First and Next are two very different words, for two very different concepts.
Here’s a refresher:
The 25% off only applies to a Macy’s Credit Card holder.
The modal screen is confusing, at best. It prompts me to log in or “create an account” here, but this is irrespective of the offer at hand. This is just a typical “new user” account, which will let me log in to the app or website, and save my user details.
Because the language conflates two very different definitions of “account” on the same modal, it convinces me all I need to do is sign up for a user “account” so I can get my 25% off.
<New User> This is all going to happen today, after I find that new handbag or kicks, and all I need to do is this one final thing before I go shopping. So ok, sign me up! </New User>
The new user signup funnel, in its entirety:
Once you get in the door, the 25% offer comes in the form of an email, which lets you know about a product feature called My Wallet. This is where your promotion lives, (and where it will likely die, just not as glamorously as 2pac). Keep reading to find out why.
Once finally in the store, I loaded up my shopping bag with a veritable Santa Claus super-sized e-chariot full of loot that’d make Kim Kardashian-West kink her neck on the double take. I wanted to create a wide enough swath of conspicuous consumption to capture that discount! The checkout page, however, let me know that nothing in my bag was eligible for the promotion. I clicked on the exclusions to find out why, God, why?
Interestingly, there’s a slightly different wording for the exclusions that come in the email (which is connected to the coupon in your “wallet”)—this is the fine print that says the discount is only available to Macy’s credit card holders, but you only see this version online, not on mobile. With a list of exclusions rivaling the size of the 9/11 memorial, it hardly matters.
The impression I’m left with is that Macy’s core product underlying everything is ultimately about consumer debt—largely targeted at a younger audience that’s year-over-year less interested in what’s on offer, generally more savvy and informed, with far more retail options than ever before. It’s clear that the 25% offer was made in bad faith—if a friend pulled a stunt like that, you’d likely never trust them again. It may have given them the metrics they were after—an inordinately high ranking in the ITMS app store—#28 in shopping. But based on my cursory peruse through Macy’s app reviews, what comes to the surface is a pattern of customers feeling betrayed. It’s a high price to pay, especially for a company that seems to understand the importance of loyalty. It’s a bit like having spinning rims and fancy hydraulics on your car with not a whole lot under the hood.
My personal point of view is this: I don’t like seeing design being used unethically—I think it’s the way of a dying breed, but I don’t want to see Macy’s go the way of JC Penny and Sears. They are the last great iconic American department store after all, and their brand has an innate value that shouldn’t be squandered by short term thinking.
My daughter’s middle school refers to this as a teachable moment, or restorative practices. They emphasize the importance of positive relationships as central to building community, and involve processes that restore relationships when harm has occurred. While this might sound dramatic, I have reason to believe that Macy’s already gets this, but the ship isn’t fully aligned—it’s a large organization, and the hands and the feet are miles apart. It’s also likely that this type of pattern—at least on the surface—seems to work. In a similar way that the effect of carbon emissions are now being “taxed” within the overall cost of fuel, I wonder if the true costs are being measured, not just the positive metrics that justify the practice.
Much has been written about dark design patterns—deceptive UX designed to trick users. I believe this “sore thumb” is a dark marketing pattern, one that has already been written about as far back as 6 years ago. I strongly advise Macy’s to abandon this acquisition strategy and innovate a new approach that truly puts the customer relationship first, and doesn’t jeopardize it.
The Core UX Improvements
Not having time to wade through almost 2,000 ITMS reviews, here are some of the patterns that emerged. I tried to vet the issues that stood out in the app experience—some of them had been resolved since the review was written, so Macy’s is clearly listening.
— Too many forced app updates (x 100). “I Lost everything in my cart. I bounced and won’t be back”. For some, it was every time they opened the app. It’s possible that Macy’s has resolved this one, but I’m including it here because a lot of customers are complaining about it, and customers bouncing is a red alert.
— Shopping bag should have a back button or be a modal so that users can return back to their previous browse state. You can use “home”, but it’s not obvious, and also from a state-wise perspective, incorrect.
— No landscape mode, not iPad friendly.
— No order history. Users would love to initiate returns from their order history.
— Difficult to read.
— Search could use improvement.
The Macy’s app feels dated by today’s standards. Navigation is way too vertical scroll heavy. The design seems weakened by a fear of horizontal swiping, which exists in nearly every other e-commerce app. At minimum, the app should mirror the macys.com website, which uses carousels—but again, a native app should assume users know how to swipe in 2019. It’s practically the most addictive interaction invented since the like button. The Macy’s app “flattens” all the content, forcing the user to thumb scroll way too much. Like taking the elevator to the top of Trump Tower, too much. It also wastes a ton of space on needless chrome that’s not even gold.
A redesign should be full-bleed to the device edge, preferencing catalog-style viewing of merch, with modern interaction models that today’s consumers expect in a modern e-commerce app—browsing with emphasis on visual merch, swiping, favoriting, etc.
—The redesign should bifurcate/separate the visual browsing experience from the navigational/other tools. Navigation and menu bar should be rethought. I’m not a fan of the menu bar for Macy’s and we’ll get into a heated debate about that here in a minute.
—No best sellers anywhere. A core benefit of shopping online vs. a store is seeing what’s hot at a particular retailer. Start with broad categories and narrow them once a user has clicked on 2–3 items.
—“Add to list” is confusing. Comparison shopping isn’t supported. Can’t favorite items.
—Check out is a mess.
New users without an account are lost here. The Create Account affordance is hidden under the keyboard. Put the create new account link above the login.
The big red button scares me because all other buttons have been white up to this point. Lots of red reminds me of being pulled over and makes me think I did something wrong. (Maybe it’s me). Use a white button with a red stroke outline/red text instead, similar to the other in-app links.
The Redesign, Before and After
First up, my recommendation to do away with the nav bar will likely prove controversial, but here’s why I went there:
- The Macy’s nav bar doesn’t have a single feature that a user needs global and constant access to, except the shopping cart/bag—which IMHO belongs in the header anyway, because it’s a. more prominent there, and b. more “special” in its own space, which is near ubiquitous common in a top right position.
- I felt/assumed (thesis-wise) that effective and delightful browsing of merchandise is the primary use-case Macy’s needs to support. The best approach to doing this is the user focusing on the “main stage” where all the pretty stuff lives. Having the nav bar constantly compete for a user’s attention compromises the main goal—finding something I want to buy.
- “Shop”, the second most important item in the nav bar is, in essence, categorical navigation—this is now “Departments”, and due to the more modern and attractive swipe-able browsing experience, users are more likely to 1. discover through swiping where they want to go, and 2. remain in the primary visual interface. The core thesis does away with second-guessing and duplication of function that existed in the primary visual real estate and nav bar.
- The nav bar becomes the global menu, (Star Wafer™) and is accessible from the top left. Let’s have a look, now.
A few things I personally like about this approach that may not be immediately obvious:
- I like making In-Store mode an actual on/off mode for the entire app, instead of a “page”. I’d have to redesign the entire thing to pitch why, but the bottom line is that IMHO the current implementation of In-Store could use some “out of the box” delight. Low-hanging fruit TBD.
- I like the bifurcation of being in “tools” mode vs. the main app, which now feels more focused on supporting browsing and finding things to buy, visually.
- I like the branding of Macy’s digital product being a button. This definitely breaks Macy’s branding guidelines, so this direction likely wasn’t entertained. Breaking out of brand guidelines is a hard sell, especially in large organizations. This is one rule meant to be broken—I’ll posit that this iteration on the Macy’s brand is not only more user-friendly, but it’s also highly campaignable. Like, Obama campaignable.
Speaking of ways to engage with the Macy’s brand, App Style is a way to skin the app, according to several flagship stores.
Macy’s current “Store Mode” is really just a page that lets you “set” your brick & mortar store, check prices and even pay for items in-store. It’s good to have these features, but in 2019 these are table stakes. Fundamentally, I think the most opportunity space for driving customer loyalty exists in finding clever ways to make In-Store more delightful and gamified.
As I was working on this case study, I told my mom about what I was doing, and she offered an interesting piece of feedback. Living in Oregon, she still goes to the mall to shop, often with a specific top of mind need—for instance, (in her words) black dress pants. She said she always finds it incredibly difficult to find what she’s looking for at Macy’s, and the store design seems intended to make you “walk around in circles”. She mentioned the emphasis on brand segmentation, which she’s not terribly interested in—she just wants to find a specific thing that she needs in that moment.
I’m not saying my mom is 100% right and doesn’t otherwise get lost in the mall, even under the best of wayfinding circumstances*. But needing to find a specific item is a common use case, and an obvious feature of in-store should encompass the ability to search for “black pants” and have a list of those items that you can click on, and be subsequently directed to their in-store location. This is why I advise ‘In-Store” to actually be a legit mode of the app, and not a separate page.
*I often use my mom as a reference point for what I consider good design to be. In other words, would my mom understand this? For the record, my mom is one of the smartest people I know. She just has an extremely limited threshold for chaos, which I admire. Hi Mom!
When I began researching in-store product features, I wasn’t that impressed with what’s out there today. It seems most retailers haven’t really had fun with what’s possible, especially with AR—Yet. I came across this ad for H&M’s in store app feature, and I love the ending part where the woman does a search for “red dress” and sees red arrows pop up all over the place to show her where all the red dresses are.
Of course it’s fiction, but it inspired me to ask why the in store feature of the Macy’s app couldn’t be a true “mode” for the app, and allow you to search on items, to be given their precise location? This feature would be incredibly useful for finding specific items, fast.
The next truly creative wave for in-store might involve taking a cue from Story, Macy’s literal “in store” boutique, which is constantly shape-shifting inventory in order to increase shopper visits. Why not the same idea for in-app as well? Perhaps there are creative ways to “interplay” between the app and in-store—for instance, a treasure hunt for new exclusive items, using AR technology?
WalMart is one retailer that seems to understand how much strategic advantage there is to be gained by pushing the envelope on its in-store features. When fighting the battle against online-only retailers, developing an integrated strategy that encompasses the unique attributes and opportunities across both domains can result in truly differentiated convenience and value for customers. In an era when people still love to shop brick and mortar stores, (while simultaneously guaranteed to be carrying a smartphone), not being truly innovative in specific hotspots unique to the retailer and its customers represents a vulnerability.
In-store app integration seems like the next logical frontier for Macy’s to truly innovate, not just phone it in.
In order for Macy’s to get ahead of the online retail pack and stay there, it needs to get religious about the customer-focused core values it espouses. While it might be a cliché to reference Amazon as a weapon of comparative analysis, it's also imperative to start there, since it doesn’t seem like Bezos & Co. are going to get bored of eating everyone else’s lunch anytime soon. Being trustworthy is a long-tail strategy that works every single time.
Finding unique tactics to bring Macy’s into the modern digital era that speak to unmet customer needs, and delights in differentiated ways using contextually relevant interplay between physical and digital touchpoints is the secret sauce Macy’s can build on.
Being a physical retailer with a thoughtfully integrated digital presence is a core strength, and retailers like WalMart are taking the opportunity space seriously while others are resting behind the curve. I don’t think I’ve unlocked the winning formula in this exercise—that would require meaningful research, beginning with customer interviews, and a closer look at relevant business metrics.
I’ve identified the type of innovative forward thinking that already exists within the organization but seems less present online, and even less so in the app. I think there’s a ton of white space yet to be mined, but it will require “out-of-the-box” design leadership that spans across disciplines and domains in order to get Macy’s back to the place they rightfully deserve to be—on the cutting edge of retail.