UX Review: pattern brands know the rules and when to break them
It started with a Sweetgreen on the corner of W 91st street and Broadway, three blocks from Central Park. I sat down and forked the first bite of my chicken Caesar salad into my mouth. My eyes widened, my palette salivated.
Salty. Crunchy. Perfection.
No, this is not a love letter to Sweetgreen (but if you would like that this one is my favourite), or koalas (that is my next Medium post). My Caesar salad was however, my introduction to Gin Lane, the agency behind their super salad brand identity (and a humble $15B+ worth of other brands you may have heard of).
Gin Lane has since become Pattern Brands, announcing it on this very platform. Pattern is a direct-to-consumer multi-brand company with the mission to help our generation find more enjoyment in daily life, with $14M VC funding to boot. They currently have one brand— Equal Parts, combining cookware with expert guidance to help you enjoy home cooking. Their second brand — Open spaces, is an approach to organizing your home launching this month.
Which brings us to our real story: Pattern’s multi-brand webpage, its winning UX features, and expert story telling.
1. Tell Me a Story (But Give Me Subtleties)
Good web design is good story telling. When I first meet Pattern, I am greeted by a tree with two fruits, representing Pattern’s two brands. This memorable visual immediately conjures a thought of Adam and Eve, the first story told in the Bible. I feel this is the beginning of something new.
Next, we’re presented with Pattern’s simple and eloquent one sentence mission statement. I know both who they are and what they do effortlessly. This needs to happen quickly because 55% of users spend fewer than 15 seconds actively on a page.
Could the homepage stand alone without the Welcome Tree? I don’t think so, at least not with the same effect. Pattern’s brands want us do the dishes and make our beds, we can’t get on board without an emotional response, which can only result from expert story-telling.
Note, if you revisit the site within the hour the Welcome Tree disappears, once novel and curious, now tedious. Excellent design.
2. Make Me Feel Something
Pattern doesn’t underestimate the design tools they have available to connect directly to their users.
Copy, visuals, and interactions can all connect to convey and elicit positive emotion throughout an experience, with no tension, no conflict, no characters, and no plot points.
— Jesse Weaver, “What is Story-Telling in Design?”
If childhood nostalgia has a colour story, then Pattern has found it. Dream-like purples accompanied by cool greys, greens as vibrant as summertime grass, saturated oranges like a perfectly ripe peach. I am at once transported what a summer’s day in the 90’s looks like in my mind.
“Research reveals people make a subconscious judgment about a person, environment, or product within 90 seconds of initial viewing and that between 62% and 90% of that assessment is based on colour alone.”
— Institute for Colour Research
Countless hours of my childhood were spent in my friend’s basement in front of her Dell desktop playing Chapman’s Ice Cream online games. It was the promise of free Chapman’s merchandise that kept us coming back for more.
When was the last time a webpage solicited a happy memory? Or, made you feel anything at all? I hadn’t seen a hand mouse since my Chapman’s days, but Pattern digs deep into their nostalgia pockets to pull this one back from the dead. I am delighted.
Pattern’s website is full of gouache-inspired illustrations sized as if they might have come from a children’s book. The visceral emotions Pattern is sparking with these Easter eggs are ideal for their brand’s identity: to remind me of the simplest form of enjoyment, childlike.
3. Don’t Forget The Sprinkles
“The cleverness that you add to a product should be like salt and pepper sprinkled on a well-prepared dish. They add to the recipe, but they should not be a main ingredient.”
— Randy K Hunt, Creative Director of Etsy
Little touches make a difference, like when your mom use to cut the crusts off your peanut butter sandwich. The movements of clouds, birds in flight, swaying tree branches, all add life to the webpage. What they lack in direct purpose they make up for in a greater experience. More importantly, they do not detract from the usability of the webpage.
Clicking the menu symbol in the left corner of the homepage offers an unexpected delight when it expands like a raindrop hitting the sidewalk. These surprises make me want to stick around longer. Things are happening here.
4. Know When to Break the Rules
Iconography is a well understood UI design component. The smaller the symbol, the less detail should be used. Too much detail and you risk a cluttered illegible appearance, too little and your icons feel chunky and cheap.
Pattern’s icons are not significantly more detailed than what is expected from a 48px icon, they are however more nuanced. A flag detail on a tent, plants of different heights enjoying a cloudy day. These are not icons designed for efficiency, but rather enjoyment. After all, enjoyment is the kool-aid Pattern is selling. You’re damn right their cactus is flowering. “Do you have a cactus?” I feel Pattern thoughtfully ask me.
Web navigation best practices aim to improve the user experience by providing a clear, simple, and consistent user journey.
“A good navigation has no more than seven links, because more than that is confusing. The human brain can’t keep more than seven items in its short term memory.”
— Ran Segall, UX Designer & Flux Academy Founder
Pattern’s navigation page boasts nine pages, but groups their lesser visited pages and assigns them a significantly smaller typeface. They give a wink to the rules, then break them with care.
5. Nothing is Original
“Authenticity is invaluable; originality is non-existent.”
— Jim Jarmusch, Filmmaker
The birds and clouds on Pattern’s homepage create an element of motion reminiscent of Vincent Van Gough’s Starry Night brush strokes. This clue led me on a deep dive into Post Impressionist art. It seems improbable that they weren’t inspired by this art movement both in colour and design.
There are many places web designers find inspiration from these days, Lapa.ninja, Awwwards.com. But Pattern? They went all the way back to 1886. Great web design inspires great web design, but Pattern makes the case for better web design being inspired by well, everything else.
The best of Pattern’s UX features pull you into their story and elicit positive emotion. With a company mission statement like “help our generation find more enjoyment in daily life”, maybe that is exactly the point… for you to stick around long enough to enjoy the experience.
