DEV Community

Cover image for User Interface Design Inspiration – 9 Websites That Will Get You There
Pepper Square
Pepper Square

Posted on • Originally published at peppersquare.com

User Interface Design Inspiration – 9 Websites That Will Get You There

When was the last time you came across a website that made you stop and stare? For designers and those that appreciate the finer things in life — it happens every waking second. Great examples of user interface (UX) design are all around us — there’s much to observe and absorb.

On average, users spend about 45 seconds on a website. If you’re lucky, some even invest two hours on it. But here’s the catch. Whether the user spends two minutes or two hours on the website is irrelevant if the user leaves without visiting another page.

What.

Why?

Because Google will still mark it as a bounce.

What can designers do to ensure that the user stays on the website and ventures into other pages? For starters, they can hound the content and SEO folks to create copy so compelling that the user has no option but to view what else is on offer.

More importantly, they must create designs that are not only aesthetically pleasing but also practical. To create examples of good design, designers must become the user to understand pain points and develop solutions. But a little inspiration can also take you a long way. So, hitch a ride with these user interface (UX) design examples till you find your destination.

9 User Interface (UX) Designs to Seek Inspiration From

- Canva’s Ease of Usability

Image description

According to this Forbes article, Canva has over 75 million monthly active users in 2022. It’s been the “next big thing” in design for many years.

With pre-existing templates segregated by categories like posters, logos, flyers, and cards in an extensive library, users already have a big chunk of hard work done. After selecting the template, the rest is drag and drop, experimenting with typography, and customizing elements to their liking. Therefore, it’s so popular – it’s easy to use and even easier to learn. One doesn’t even need to be a trained designer to master the art of design. It solves a problem for many while being straightforward.

- Ease of Search on YouTube

Image description

Great UI is often attributed to smooth navigation. Through eye-tracking software and years of research, there’s enough evidence to prove that when a user first lands on a website, their eyes travel from the top left-hand side of the page and move to the right.

After which, their eyesight goes back to the left again, but a little lower, and pauses around the middle of the page. What’s clearly forming is an “F-shaped pattern”. The search button is the first thing one sees when they log into the video streaming platform. The text box is wide, making it look uncluttered and supports voice search.

It’s forgiving, too. Try typing ‘Skiny Dipping’ instead of “Skinny”, and it will still show you results for the correct spelling. P.S. – the first video that shows up – Sabrina Carpenter’s “Skinny Dipping”, makes for a great Subway listen.

- Crocs’ visually appealing home page

Image description

The landing page of the footwear giant’s website seems like everything your UI teacher taught you not to do. Like the shoes themselves, the website goes against the grain. Full of collages, frames, black banners, and people of different ethnicities – the website is as inclusive as it can get.

It’s also well-thought-out with clean symmetrical lines, fluid gradients, 3D elements, and lightweight serif typography. The risks are aplenty, but that’s why we love it. It unapologetically incorporates many design elements that are all the rage.

- Monochrome magic

Image description

Yet, getting your creative juices flowing to build a unique website doesn’t always require in-your-face risks. Hop on to The Sum’s website for a minute. A masterpiece in greyscale, the website uses somber colors like grey, black, and white to make a statement. Splotches of color punctuate the website for an understated yet impactful effect.

A playful blend of strategically placed negative spaces and animations make the website almost whimsical yet a delight to the eyes.

- Typography done right

Image description

Content ranks high when creating a website. But how you present it can either make or break the website. While fonts like delicate serifs will continue to rule the roost in 2022, how you place or present them will make all the difference. The Pest Stop Boys (gotta love the name) make their presence felt with loud and risky typography combined with what looks like an Amazonian Forest on steroids.

One may even mistake the website for a neo-art gallery or a music festival bigger than Coachella.

They’ve re-imagined what pest control can look like – it can be cool. The website leaves a lasting impression with larger-than-life fonts that almost yells at you.

- High-quality images

Image description

It’s one of the cornerstones of excellent web design. If you’re not using high-quality images on your website, you might as well scrap the idea of the website. The better the image quality the more tender the chicken breast.

The closer the shot of the cheese, the stringier it will be – or at least that’s what insanely good photography will have you believe. Ever ordered from Postmates? While there are several other food-delivery platforms, many throng to Postmates. Even Hailey Bieber does. Postmates brings it home with pictures that make you drool – you can almost touch the holes in the bread.

- More than meets the eye

Image description

The William Lachance website looks like a Picasso painting come to life. Every inch is a pop of color, with moving images, videography, and a scroll that makes you want to dig deeper. It builds curiosity with every scroll while keeping your eyes focused on the entire screen.

The website has several things going for it. Unlike most websites, the menu bar is placed on the left-hand side of the screen. When you click on any of the sections, it directs you to a relatively subdued page full of blank spaces, a stark contrast to the home page, thereby creating balance. Another way it creates balance is by employing serif and sans serif fonts. Navigation is made easy by text hierarchy, depicted through different font sizes.

- Gradients making a comeback

Image description

What seemed like a thing of the 90s (that we never really got enough of) has made a remarkable comeback. Much to the chagrin of Gen Z but to the delight of millennials, gradients are finally coming back. Zeus Jones does it well and like it’s nobody’s business.

When you first land on the website, it’s monochrome—nothing to write home about. But, spend two more seconds staring at it, and you’ll see the website come to life. A mostly black website with a dynamic gradient hero banner, the website hooks you with iridescent imagery, a blend of different fonts, and content that helps clients envision a “new world” for themselves.

The same goes for Haiku-Haiku, which keeps changing the gradient colors like a boss!

- Pepper Square’s minimalist approach

Image description

Pepper Square is set on one mission – to Simplify Interfaces. Drawing from simplistic and minimalistic elements, the UI UX design agency makes an impact. The subtle use of color punctuated with hints of red creates a beautiful harmony that one cannot help but move from one page to another. The menu bar makes navigation easy for anyone and by not adding frills to the website, it manages to be a sustainable and green website.

Conclusion

UI design ideas and inspiration are everywhere. We have to look closer, listen harder and feel more. In design, inspiration can catch you unaware. Translating it into a vision is the hard part. At Pepper Square, we’ll help you do just that and much more. We’ll help you design interfaces so slick that you’ll be running around with a cloth rag to keep it shiny the whole time. Write to us. We’re happy to collaborate and create the best UI designs that will transform the world.

Top comments (0)