Uncategorized How to Use Social Media to Influence and Inspire Your Web Design Projects – Designmodo

• 6 minutes READ
In this day and age, many of us spend our lives swiping and scrolling through our socials. And, in addition to being a constant source of information and entertainment, Instagram, Pinterest, TikTok and other social media sites can also provide an endless stream of inspiration.
Read on to find out how social media can positively influence the web design choices of marketers, designers, brands and businesses.
From photo-editing tools and filters to stickers and meme-generators, today, anyone armed with a smartphone can add striking visual elements to their posts. But social media can also provide a rich source of creative inspiration for even the most experienced web designer.
Remember, the things that are gaining likes, shares and interactions today are likely to trickle down into the web design trends of tomorrow, so now’s the time to start thinking about what you can learn from social media and how to incorporate it into your design thinking.
Read on to find out how social media can influence your web design project by:
Source: Etsy
With Postcards you can create and edit email templates online without any coding skills! Includes more than 100 components to help you create custom emails templates faster than ever before.
Thanks to social media, we’re used to getting a glimpse into the lives of everyday people, and this kind of behind-the-scenes access is pushing the desire for more authenticity in web design. Think of ‘meet the team’ pages that profile employees and literally give brands such as Etsy a human face. Meanwhile, hovering the pointer over Atlassian’s page reveals graphical elements that communicate each person’s job function, and at UK-based gin distillery Sipsmith, professional-looking headshots give way to a lighthearted snapshot – establishing that the brand is all about business meets pleasure, if you will.
This quest for ‘realness’ has also inspired many brands to move away from stock images and posed shots and towards authentic photographs that are instantly recognisable and relatable. This can do wonders for establishing a brand’s credibility, and demonstrate that they understand their customers, the issues that are important to them and the things that make them tick.
Additionally, many fashion and beauty brands are now populating their product pages with user-generated content. Like beachwear label Andie, which invites customers to share images of themselves ‘modeling’ their purchases along with their measurements so online shoppers can get a more accurate idea of how each swimsuit fits – whatever their height, size or body shape.
Everyday, the online world serves up more content than we could ever realistically consume in a lifetime, and so we’ve got into the habit of speed-reading and rapidly scanning sites for the information we require. Take inspiration from social media and use attention-grabbing visual elements to fight the battle against information overload. For example, the cute stickers that accompany news stories published by The Outline quickly convey the essence of each story, while the icons featured on Parade tell customers about the properties of each garment (for example, an ice lolly indicates cool touch ultra-light fabric) and the brand’s commitment to social and environmental issues.
Source: Parade
Similarly, gifs and memes stand out on social media, so why shouldn’t web designers bring them into their projects? A picture paints a thousand words and, when done well, these static and moving images can quickly communicate key messages, tap into a current mood and instantly draw readers’ eyes to the most important parts of each page. Like Glossier’s simple but addictively watchable product gifs. Meanwhile, flavored sparkling water brand Recess takes an irreverent approach by turning its canned drinks into memes – like Peach Ginger, which pays tribute to Tiger King with the addition of a mullet and a moustache.
We can also see Instagram’s love affair with filters playing out on brand websites – like perfume company Abel, where each fragrance is conveyed by a distinct color palette. Bottles of Pink Iris perfume feature crushed raspberries and rose petals, while accompanying lifestyle imagery has been edited to bring out delicate blush tones that combine to create a consistent aesthetic. As a result, the brand offers a valuable lesson in applying specific identities and emotions to individual pages, products or website elements.
Source: Adidas
With Startup App and Slides App you can build unlimited websites using the online website editor which includes ready-made designed and coded elements, templates and themes.
Talking of visuals, think of the editing tools available on Instagram Stories that allow users to add captions, drawings and backgrounds to their photos in order to achieve a curated, collage effect – something we can see in Adidas’ player images, which features scribbles and silhouettes for a hand-drawn look and feel.
Source: Bleach
Double-tapping to like, swiping up to shop, moving an emoji on a sliding scale to show interest – social media platforms invite 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 customer’s likes and dislikes, they can also help point people towards the products and services they need – adding that extra element of personalisation that’s so sought after nowadays. Like the ‘questionnhaire’ that appears on the Bleach site, which poses a series of multiple-choice image-led questions to unite users with their ideal hair dye.
Mobile-first is one of the most important web design rules. And, of course, social media offers a masterclass in content that’s easy to consume on-the-go. With less and less people browsing websites on their personal computers and laptops, web designers have spent the past few years optimizing for mobile and coming up with responsive pages in a bid to provide the best possible user experience.
Whether you’re planning to overhaul your website or make a few tweaks and changes to support speedy consumption, take a look at We Transfer’s editorial platform We Present. Thanks to the site’s modular build, text and images are given equal importance, with paragraphs and pull quotes interspersed by videos and images that entice the audience to keep on reading.
Source: WePresent
Source: Made
We know people love sharing on social media, and user-generated content (UGC) increasingly pops up on web pages via handles and hashtags. Like homeware retailer Made, which heroes customers’ Instagram posts throughout their site under the call-to-action ‘less than humble about your abode? Mention @madedotcom in your photos and we’ll feature the best pics’. Luggage company Horizn also keys into its customers’ wanderlust with the invitation to ‘show us how smart you travel by sharing your most inspiring snapshots. Use the hashtag #LetsGoFurther for your chance to be featured’. Suddenly, the websites become a part of these brands’ community-building efforts.
And while we’ve seen widgets and plugins being used to streamline the transition from site to social media for years, web design inspiration can also be found in the symbols and signals that people have grown accustomed to seeing on Twitter and Facebook. For example, we find Cult Beauty highlighting its ‘trending’ skincare and make-up items, as well as adding a tick against products whose claims have been verified by a third-party. In addition, Evolution of Smooth has integrated a hashtag into its web design, dedicating a whole landing page to products under the #eosflavorlab banner.
Source: Evolution of Smooth
As well as being inspired by social media, you can use platforms like Pinterest and Instagram – or creative networks like Behance – to inform your next web design project. Pose questions, conduct a poll and ask followers to vote for their favorite image or landing page design – you’ll soon get a sense of what people do and don’t like.
As social media continues to grow and dominate the digital space, we have no doubt 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.
Helen Alexander is a freelance writer and Envato contributor, with a passion for charting the latest food and drink, travel and design trends. She’s currently based in London, where she’s never short on inspiration.
An editorial team is a group of authors who publish articles and news on Designmodo.
Create beautiful responsive emails and newsletters easily.
We create beautiful website and email builders, helping 30,000 customers to grow their business.
A simple tool to create emails and newsletters.
Create an animated website in minutes.
A perfect tool to create Bootstrap website.
Earn 25% commission on affiliate sales. We have everything you need to make money.
Whether you’re an experienced web designer, developer, marketer, or a newbie looking to learn the basics, there’s something for everyone on this blog.
28 articles
13 articles
31 articles
47 articles
20 articles
23 articles
5 articles
4 articles
23 articles
77 articles
18 articles
91 articles
82 articles
24 articles
9 articles
18 articles
121 articles
24 articles
19 articles
7 articles
17 articles
9 articles
85 articles
10 articles
11 articles
4 articles
16 articles
22 articles
We’re always looking for new authors. We’re happy to publish useful articles and tutorials related to web design.
Made by Designmodo.
This website design and code was built using our tools. Treat it as a proof of concept.
Subscribe now to receive discounts, news, and updates. We pinky swear to not spam you. 😉
Copyright © 2010-2022. All Rights Reserved
We use cookies to ensure that we give you the best experience on our website. Privacy Statement.
Your cart is empty 🙀
Get started with the most advanced email builder for your next campaign or newsletter.
A perfect tool to create website or prototype projects. It will fit all kinds of projects.
Create an amazing static website in minutes and export ready-to-use template.


Author Details

Sign up for our newsletter to stay up to
date with tech news!