Case Study 3: What Smörgåstårta and The Uniqlo App Have in Common

Niamh AC
6 min readJul 25, 2024

--

The Uniqlo App is like a smörgåstårta. At first glance, it looks intriguing, but in reality, you’re unsure what it is, why it exists, and why somehow it’s in your house. Sure, it’s technically free food (you get a free 5 € voucher when you download the Uniqlo App) but every time you look at it, you begin to question whether it is indeed edible, who even wants it …and why there are so many shrimp on top!?

Chances are, if you live or come from anywhere south of Rostock, you have little understanding of what a smörgåstårta is, and how on earth this relates to an app that you also likely have little experience with.

Let me explain.

A mock-up of the Uniqlo App on a phone screen beside a Smörgåstårta with an equals sign between them.

A Recipe for the Questionable

Believe it or not, this is a case study, detailing the process and learnings from a UX/UI Design student project to redesign the UI of an existing app. My urge to redesign the Uniqlo App was as strong as my urge to defenestrate my phone the first time I saw a picture of a smörgåstårta and someone called it cake!

I worked together with Javier Escobedo on the app redesign. Javi honoured me by being a diligent and thoroughly agreeable partner. However, let it be known that he is not responsible for, nor did he consent to the “smörgåstårta” word count in this story.

Ingredients & Method

When planning to bake any cake, one should begin by examining the necessary ingredients. What things do I need in my hands to create a cake? Within the world of UX Design, designers may consider the customer’s needs and the business needs or restrictions as the initial ingredients. We talk about various tools and methods a lot in UX, but for the purpose of this analysis, I’ll refer to Heuristic Principals as the method. I won’t be going into them all in detail, but you can @ the Neilsen Norman Group if you need to know more.

From what Javi and I could tell, the Uniqlo App had been cooked up from a combination of business needs, the idea that customers might like to save their in-store shopping in a digital way, mixed together with little regard to the above heuristic principals. And with icing that makes it look like a shopping app, if you squint.

To sate your curiosity, and validate my comparison, the abomination that is smörgåstårta is what you get when life gives you too many shrimp, not enough actual cake ingredients, and an appetite for chaos.

smörgåstårta
Learn how to upset your dinner guests here. Photo: kronjast.se

Taking a Slice

Javi and I spent a few hours examining and dissecting the Uniqlo App. We highlighted some problem areas right off the bat, on the Home screen, within the Hamburger Menu, and on the Store Finder screen (this last one is confusingly named STORE when you first become aware of it on the Home screen).

The Home screen has a search bar and an icon of a shopping cart, but I’m sad to say, interacting with either of these things will redirect you to an embedded browser, where you may indeed shop in the Uniqlo online store, but you will not be logged-in, even if you were logged-in on the app. It’s somehow a worse experience than accessing Uniqlo’s online store through a simple browser.

A new customer might download the app thinking they can shop directly within it… You look at it and think, this is cake, right? Sadly, the cake is a lie.

2 screenshots of the uniqlo home screen with red circles highlighting heuristic issues
Uniqlo App Home Screen

Considering the business needs we expected to meet: even the marketing content, a shopping call-to-action button on the home screen, cannot easily be accessed on smaller devices. (I have short, stubby fingers, so I opted for a phone with a smaller screen — the iPhone SE. That’s 320x568px of screen real-estate for all you nerds).

Spending more than ten minutes examining the Store Finder screen will upset you more than the amount of mayonnaise in our friend, the smörgåstårta!

3 screenshots of the uniqlo Store Finder screen with red circles highlighting heuristic issues
Uniqlo App Store Finder Screens

The page isn’t titled, there are faaaar too many magnifying glass icons, buttons don’t look like buttons, errors appear when I try to search for a store and they offer no helpful guidance. I’d also like to understand how it knows where I live? To clarify, when I opened this screen in the app, it showed me Berlin (where I live), but reviewing the app settings, I could see that my location sharing was very much switched off…

Aprons On!

I’m not a professional chef, but I’m proud to admit, I’ve baked a few wedding cakes in my life. And while I’m still but a student of UX/UI Design, I felt like we (Javi and I) could do better. Also, our brief clearly instructed us to do better.

We had examined the original smörgåstårta of UI elements using heuristic principals, so naturally we based our redesign on addressing those very principals. We aimed to simplify and clarify navigation through use of recognisable, familiar icons and naming. We simplified the UI design where possible, reducing visual clutter, and in turn cognitive load for users. We prioritised customer actions, clearly labelled unfamiliar terms, and pre-empted possible mistakes. Oh and we added a logo and screen titles. I don’t know why they didn’t have those.

In short, we threw out all the cucumber, white bread and sour cream, and replaced it with cocoa, sugar and butter. Mmmuch better!

Space added at top below to avoid crowding and content overlapping. Logo and page title added to help orient customers. “Cart” icon removed and clear SHOP label added with icon indicating behaviour. Hamburger menu and search bar removed to eliminate duplicated content. Marketing copy moved up on hero banner — button was hidden on smaller devices. Pagination moved to top of image. Footer / Nav bar now includes key app features including coupons and news. Items renamed for clarity.
Before and After: Home
Screen title clearly displayed to orient customers, consistently named with item in Footer. Search and filter prioritised. Redesign shows broader range of options for users who do not share location. Search and filter condensed slightly. Country selector added. City dropdown updated to show only cities with Uniqlo stores. Filters added as pills to allow more options. Help icon and overlay added to explain terms used. Search button styled as button for clarity and consistency.
Before and After: Store Search & Filter
Screen title clearly displayed to orient customers, consistently named with item in Footer. Search and filter prioritised. Redesign shows broader range of options for users who do not share location. Search and filter condensed slightly. Country selector added. City dropdown updated to show only cities with Uniqlo stores. Filters added as pills to allow more options. Help icon and overlay added to explain terms used. Search button styled as button for clarity and consistency.
Before and After: Store List

Recipe Reviews

While I’ll openly admit that I’m a massive Uniqlo fan-girl — in my eyes, their price to quality ratio is unbeatable — but I’m loath to admit I don’t feel the same way about the Uniqlo App. In it’s current state, it feels like a collections of thoughts and ideas that do not address customer needs, held together with mayonnaise, decorated with shrimp.

Our redesign presents solutions to some of the issues presented, but of course cannot claim to be the best or only solution. Testing is an essential part of UX Design (as tasting is with baking), but was not part of the scope of this project. If given the opportunity, I would leap at the chance to work with Uniqlo to test and improve their app, but I feel I may have excluded myself from possible collaborations by comparing their product to the monstrosity that is smörgåstårta.

(Smörgåstårta count: 10)

--

--