PREPARING FOR LAUNCH: APP DESIGN BEST PRACTICES WITH LSKD
LSKD is an Australian brand that prides itself in producing high-quality functional sportswear with a street aesthetic.
And, they strongly value the community they’ve created focused around sport, fitness, and adventure.
And, you can clearly see this through their app design.
So, in this lesson we’re going to break down how they were able to bring their awesome app design to life.
And, there’s a few things that I want to focus on here.
This includes multi page design..
Their brand logo..
And, their ‘Discovery’ page.
So, let’s dive in.
Alright, we’re in the app.
And, the first thing you can see is simply how clean and “on-brand” this app is.
It's as if you’re walking straight into the LSKD store..
And, that’s what you’re really looking for when building a brand..
No matter where your brand presents itself..
Cohesion is key.
And, LSKD has proven to do a great job at carrying their brand with continuity on their mobile app.
So, as for what is going on here..
The first thing we can see is that this is a multipage mobile app.
So, I can slide back and forth between pages.
Or, simply tap a page to jump to it.
And, I really love how simple and clean this design is.
There’s a page for ‘Releases’, which are all ‘New Arrivals’ in their store..
And, ‘Discover’ page.
And, a page to learn more about the brand..
And, even discounts and offers you can receive by using the app.
The navigation is beautiful and makes it incredibly easy to find what you need.
And, clear navigation is incredibly important when shopping on mobile
With clarity comes a seamless experience for the customer.
Now, the brand logo.
The thing I like about this logo is that it doesn’t take up too much real-estate on the phone.
Meaning, it’s a long and thin icon that showcases the brand’s logo clearly.
And, this is actually a very simple, yet very effective point to call out.
Has a ‘Search Block’..
So, no matter what page you’re on..
You can search for something.
And, this is something a customer intuitively assumes will simply be at the top of a page..
So, always be sure the search bar is at the very top of your app.
Now, the good stuff.
LSKD does an amazing job with utilizing ‘Custom Banner Blocks’.
Basically, everything you see here is a custom banner block.
Either image, GIF, or video blocks with their own customized look..
And, the cool thing is that they all have the same look..
Whether it’s an image or a video..
It's a square with rounded edges..
A brief description..
And, an arrow icon that makes it look like something will happen when you tap on it.
So, this is not an actual button..
It’s simply an overlay edited into the actual image or video, to create a call to action..
With blocks, the sky's the limit with regards to creativity.
If you can edit an image, a GIF, or a video..
That’s all you need right there to fully customize this whole page however you want.
One additional thing that I like is the legibility of the text.
High contrast text like white text on black..
Or, black text on white..
Makes the app easier to read.
And this brand does a really helpful thing where they have this black fade on the bottom of each image or video blocks underneath the white text to make it easier to read.
It's a very small detail, but these decisions make navigating the app easier and smoother for the viewer.
Now, ‘Collection Blocks’.
Under the ‘Mens’ and ‘Womens’ pages..
There’s a mix of custom banner blocks, and product blocks.
What I like about this, is that product blocks are incredibly helpful for a user to easily see a variety of products in a clean and organized way.
LSKD perfectly exemplifies this.
They show a banner block that leads to a category..
For example, ‘Leggings’..
And, directly underneath, they show a product block with leggings..
So, even if you don’t tap on the block that says leggings..
You can see a preview of what belongs to that collection.
From here you can simply scroll to see what’s there and then tap ‘View All’..
To be taken into the collection.
Or, the user has an opportunity to go straight to a product detail page to ‘add to cart’.
And, they continue this design down the whole page.
And, they do the same thing with the ‘Mens’ page.
So, aside from looking and feeling good..
It’s actually a really good idea to showcase a variety of products to a user..
Even if they don’t choose to open the collection view.
Really good use of blocks to showcase products and collections.
And last, we have this ‘Discover’ page.
Now, this page is different from the others because it's not selling you anything.
It’s completely content and loyalty driven.
From the top..
Fifteen percent off your first app purchase with a code..
A custom video block leading to a YouTube channel of brand-related videos..
All the way to blog posts on the best leggings to choose..
It’s a whole page of content that helps a user understand the brand..
And, even receive benefits of their own by watching this content and getting discounts.
So, I simply wanted to call this page out because it’s doing something completely different than the other pages, but it looks and feels the same.
This whole app is completely on-brand..
And, my main advice for anybody learning how to create their own app is to go and download the LSKD app
See what they’re doing..
And gain some inspiration for your mobile app.