draftEditorial staff • • READ 6 minutes

Today, many of us spend our lives flipping and scrolling through our social networks. Not only are Instagram, Pinterest, TikTok, and other social media sites a constant source of information and entertainment, but they can also provide an endless stream of inspiration.

Read on to find out how social media can positively influence the web design decisions of marketers, designers, brands, and companies.

Social media as a source of inspiration

From photo editing tools and filters to stickers and meme generators, today anyone armed with a smartphone can add bold visuals to their posts. But even for the most experienced web designer, social media can be a rich source of creative inspiration.

Remember, the things that are gaining likes, shares, and interactions today are likely to feed into tomorrow’s web design trends.

6 web design ideas inspired by social media

Read on to find out how social media can affect your web design project by:

  1. Add authenticity
  2. attract attention
  3. Increase in the imagery
  4. Inviting interaction
  5. Embrace the cellphone
  6. Increase UGC

1. Add authenticity

Source: Etsy

Online email template generator

With postcards you can create and edit e-mail templates online without any programming knowledge! Includes 100+ components to help you create custom email templates faster than ever.

Try for freeOther products

Thanks to social media, we are used to getting insights into everyday life, and this look behind the scenes drives the desire for more authenticity in web design. Think of “Meet the Team” pages that create employee profiles and literally give a human face to brands like Etsy. Hovering the mouse over the Atlassian site will reveal graphic elements that will communicate the job role of each person you are going to be.

This striving for “reality” has also inspired many brands to move from archive images and staged recordings to authentic photographs that are immediately recognizable and assignable. This can do wonders for establishing a brand’s credibility and showing that they understand their customers, the issues that matter to them and the things that drive them.

In addition, many fashion and beauty brands are now populating their product pages with user-generated content. Like beachwear label Andie, which invites customers to share pictures of themselves by “modeling” their purchases along with their measurements so that online shoppers can get a better idea of ​​how each swimsuit fits – regardless of size or size or body shape.

2. Get attention

The online world offers more content every day than we could realistically consume in our lives, so we have made it a habit of reading web sites quickly and quickly searching for the information we need. Be inspired by social media and use eye-catching visual elements to fight the battle against the information overload. For example, the cute stickers that accompany the news reports published by The Outline quickly convey the essence of each story, while the symbols on Parade inform customers about the characteristics of each garment (z) and the brand’s commitment to social and environmental issues.

Source: Parade

Likewise, gifs and memes stand out on social media, so why shouldn’t web designers include them in their projects? A picture is worth a thousand words and when done well, these static and moving images can quickly convey key messages, pick up on a current mood and immediately draw the reader’s attention to the most important parts of each page. Like Glossier’s simple yet addicting product gifs. Meanwhile, the Recess brand is taking a disrespectful approach to flavored sparkling water by turning their canned drinks into memes – like Peach Ginger, which pays tribute to Tiger King with a mullet and mustache.

3. Improvement of the imagery

We can also see Instagram’s love affair with filters on branded websites – like the Abel perfumery, where each fragrance is conveyed through its own color palette. The Pink Iris perfume bottles feature crushed raspberries and rose petals, while the accompanying lifestyle images have been edited to produce delicate blush tones that combine to create a unified aesthetic. As a result, the brand offers a valuable lesson in applying specific identities and emotions to individual pages, products or website elements.

Adidas

Source: Adidas

Speaking of visuals, think of the editing tools on Instagram Stories that allow users to add captions, drawings, and backgrounds to their photos for a curated collage effect – something we can see in Adidas gamer pics, the doodles and silhouettes for a hand-drawn one Look and feel.

4. Inviting interaction

Inviting interaction

Source: bleach

Double-tap to like, swipe up to shop, move an emoji on a scale to show interest – social media platforms encourage communication and conversation. And websites are no different. Online forms, surveys, and other interactive elements not only enable brands to collect valuable data about their customers’ likes and dislikes, they can also help direct people to the products and services they need – and the added element of being Add personalization that is so sought after these days. Like the ‘questionnhaire’ that appears on the Bleach site, which poses a series of multiple-choice picture questions to match users with their ideal hair dye.

5. Mobile optimization

Mobile-first is one of the most important web design rules. And of course, social media offers a master class of content that is easy to consume on the go. With fewer and fewer people browsing websites on their PCs and laptops, the past few years web designers have spent optimizing for mobile devices and developing responsive pages to deliver the best possible user experience.

Whether you are revising your website or want to make a few tweaks and changes to support quick consumption, take a look at We Transfer’s We Present editorial platform. Thanks to the modular structure of the site, text and images are given equal priority, with paragraphs and quotes being interrupted by videos and images that encourage the audience to continue reading.

Mobile optimization

Source: WePresent

6. Increase UGC

Increase UGC

Source: Manufactured

We know people love to share on social media and user generated content (UGC) is increasingly appearing on web pages via handles and hashtags. Like the homewares retailer Made, which highlights its customers’ Instagram posts across its website under the call-to-action “less than modest about your place of residence”? Mention @madedotcom in your photos and we’ll feature the best pictures. Luggage company Horizn is also attacking its customers’ wanderlust by inviting them to show us how smart you travel by sharing your most inspiring snaps. Use the hashtag #LetsGoFurther for your chance to be featured. Suddenly, the websites are becoming part of these brands’ community building efforts.

And while we’ve been using widgets and plugins for years to make the transition from website to social media easier, the inspiration for web design can also be found in the icons and signals people have gotten used to on Twitter and Facebook. For example, we find Cult Beauty highlighting its “trending” skin care and makeup items and ticking products whose claims have been verified by third parties. In addition, Evolution of Smooth has integrated a hashtag into its web design, which dedicates an entire landing page to the products under the banner #eosflavorlab.

Extra tip: Use social media to get insights into web design

Source: Evolution by Smooth

Not only can you get inspiration from social media, but you can also use platforms like Pinterest and Instagram – or creative networks like Behance – to inform your next web design project. Ask questions, take a survey, and ask your followers to vote for their favorite image or landing page design – you’ll quickly get a feel for what people are doing and what they’re not doing.

Finally

As social media continues to grow and dominate the digital space, we have no doubt that it will continue to influence the evolution of web design. To learn more about web design, social media, graphic design, marketing, and more, don’t forget to check out the Envato blog.

Do you like what you read? Subscribe to our top stories.