Today we are predicting the future. We’re talking about what Web Design trends will dominate 2020. Get some ideas, implement them, & launch your site into the future.
What’s In This Episode?
- Brutalism (1:40)
- White Space & Minimalism (6:05)
- Grids & Cards (7:35)
- Death of Flat Design (9:40)
- Microinteractions / UI Animation (11:30)
- AI & Contextual Technology (14:00)
- Voice Optimised Content (17:04)
- User Focus (19:50)
Josh: Today we are predicting the future and we are talking about some of the biggest web design trends that we think are going to dominate online this year in 2020. Now this was pre-recorded before all of the Covid-19, but we thought that this was very relevant for what we are currently going through, as many of you are thinking about your online presence.
So let’s get right into it!
Welcome to Creative Juices, the show where we help you feel personally confident about your online presence. I’m your host Josh and today I am joined by Julz.
Julz: Mate I’m really excited about this one!
Josh: Yeah! Super excited! And this is your second one in a row.
Julz: It is! And we’re talking about the future which is like my favorite topic of all time!
Josh: Julian gets stuck in the future a lot and requires people to pull him down to reality.
Julz: Yeah, unfortunately!
Josh: But it’s your strength! It’s your strength and so we’re gonna play to your strengths today, and we’re going to be talking about the trends of web design and web building and web sites of 2020.
Julz: I love it! I have to say though, the first one is probably a bit more geared for you, so I’m going to let you pick up on that one.
Josh: Yeah. And so, this one we’re talking, we’re kind of going into the space of web design and graphic design, but also we’re looking at the foundations and the actual technical side of web design as well. And so these are all predictions of course. This is the start of 2020 so this isn’t looking back, this is looking forward and based on what has happened in the industry we are predicting what will happen in 2020. So don’t hold us to it if it doesn’t happen.
But, number one is exciting and totally different and is geared to me and I have been known to delve into the realm of this and that is Brutalism. Have you heard of Brutalism?
Julz: I have heard of Brutalism but for our audience out there, I have to say, I’m not a huge fan of it. I am a little bit old-school I guess when it comes to graphic designer things so expand on Brutalism.
Josh: So Julz, when did you first start University for Graphic Design? How old were you?
Julz: I was sixteen.
Julz: Yeah I finished up school early and I got offered a position back in Auckland to get into Uni.
Josh: And so you’ve had years and years of graphic design experience?
Julz: Yeah! You trying to get my age out of me here or what?
Josh: No. No I haven’t, but you’ve got at least 40 years…. I’m joking! I’m joking!
Julz: A good half a lifetime. I’ll put it that far!
Josh: So here’s what we need to understand. If we delve into the human psyche and culture at the moment, you’ve got what we call the Millennials.
Josh: And then, there’s the generation after the Millennials who are coming in and there’s, if you if you are… I like to people watch, and I like to, I’m a student of society observature. And so I have realized, and through lots of research as well, like this generation is very rebellious.
Julz: Do we have a name for them yet? I’m a millennial so….
Josh: Well, Millennial’s kind of a loose term, but then there’s the I generation or whatever you call it, or the screens or whatever you know. But the whole point is that there’s so much information that is so readily accessible now, and what’s happened is that this generation has started to reject the previous generation’s thoughts. And so you see things like Crocs for example, those terrible sandals! Those rubber sandals that have holes in them for your dignity to fall out of.
Julz: I’ve never tried them to be honest.
Josh: They’re so bad!!
Josh: And so, they went bankrupt, but they were saved by the lovely Millennials who just started wearing them because of the irony of them. Irony! And you see like the mean culture. And it’s just ripping on people, and it’s just rejecting previous forms of, previous beliefs. And then, the saying of, okay, boom art and it’s all ripping on the previous generations. Brutalism is kind of like that.
Josh: It’s the rebellion and the rejection of previous beliefs, in particular the ones you hold close to your heart.
Julz: Design beliefs!
Josh: Design beliefs.
Julz: Okay, sure.
Josh: Concepts, constructs, all of what you’ve been taught about web design, Millennials have thrown out the window, and then the result is Brutalism. And so, what Brutalism is, you see when you go onto a website and you see five different fonts, all of totally different font weights, and all totally different sizes, paired with crazy colours and it’s just over the top!
Julz: Don’t know where to look! I think you should actually did find a photo. Let’s put this up on the podcast page as an example.
Josh: I will link to an example of Brutalism in the show notes. It’s crazy! It throws all design conventions out the window! And so what result is a website that is crazy! It’s characterized by gigantic text, Technicolor colours and lots of shapes, geometric shapes. There’s a liquid design that’s currently trending at the moment and lots and lots of gradients that clash. Clashing and contrast is the, it is the characteristics of Brutalism.
Josh: And so the first prediction of 2020 is that we will see a rise in this Brutalism. Big fonts, clashing colours and pretty much the rejection of design conventions.
Julz: Sounds hard to undo.
Josh: Sounds hard to undo, but then the second prediction of 2020 is kind of like the rebellion of the rebellion.
Josh: That as Brutalism appears, because culture is so extreme, we just want to be individuals. We want to be different to everyone else. The total extreme of Brutalism is Minimalism.
Julz: Yep. It’s been around for a long time!
Josh: It has been, yes, but I think that we will see in 2020, I think we’ll see a rise of it in rejection of the Brutalism.
Julz: Okay. I might ride that bandwagon a bit more!
Josh: And so, we tend to hover closer to minimalist design than anything else. And why is that?
Julz: It’s partly our niche I think, that we work in, and also just how I design. It’s just what a preference is for me. Yeah.
Josh: And so it lines up with all of the pillars of our design which is….
Julz: That too. Yeah. The technical aspects and that side of things.
Josh: Yeah. And so it’s better for mobile because there’s more white space and less content for example. It’s better for speed. It brings focus to actual call-to-actions where you want to bring focus, instead of just overwhelming them with where do I look?
Julz: Yeah, yeah. Yeah so I probably more, it’s probably more to do with our marketing side of things as well. So we are focused more on leads, conversions, optimizations, stuff like that.
Josh: Yeah. Definitely! So number one was Brutalism, number two was whitespace and minimalist design. Number three is grids and cards.
Julz: I love grids and cards! We’ve been playing around with them a lot lately. Yeah. It’s something that we’ve really tried to implement. And I think maybe we were in part inspired by Pinterest?
Josh: Yeah. Definitely!
Julz: Because they use a lot of cards, hey?
Josh: So the Pinterest design is totally just cards and cards and cards. And so what a card is, is pretty much every single website, every single online whether it’s an app or a website, they’re designed on an invisible grid system. If you have any experience of web design you’ll know that it’s made up of rows and columns and then you design on that. And those rows and columns don’t necessarily show on the front end, but my prediction for 2020, our prediction for 2020 is that these grids will become a lot more visually dominant and obvious.
Julz: Yeah I love them!
Josh: And so we use them all the time. Where do we use and where are they most obvious?
Julz: Probably blog posts. I think that we’ve seen like ‘masonary’ cards which is ones that are all different sizes which works with your featured image, then they’re responsive as well. I’ve also actually used them on products. I have used them on Em’s blog, search results even. Yeah.
Josh: And it’s super easy because it’s like if you’re actually looking for something, all you have to do is look at the title of the cards, instead of having to scroll through the masses of information. It makes it easier to find.
Julz: There’s a great combination between like the visual of like that kind of image, and the text and the call-to-action actually. It’s a great design!
Josh: Yeah! And so one thing that characterizes these cards in particular, are drop shadows or a border, something that kind of separates them, because it’s like you want the user’s focus to be focused just on that singular thing. And that goes on to number four.
Our fourth prediction of 2020 is the death of flat design!
Josh: So maybe not fully death. Flat design has been a standard that’s been around in the design industry for years and years, but I think that, like a Google for example, Google has ditched flat design and decided to go to ‘material design’ is what they call it.
Julz: I think in part this is because technology is advanced. What’s able and capable and possible on the web now is so much more advanced than what it once was. Flat design was all that there was once upon a time. So it’s cool to see as technology evolves it’s cool to see that as technology evolves that these things change as well.
Josh: Yeah definitely! And so, some of the things that characterize the death of flat design or the things that characterize material design or whatever we’re talking about here are things like drop shadows, layers that overlap each other and floating elements. And the cool thing about this is that it actually brings focus. So let’s say you’ve got a whole flat designed page and then you’ve got one box that has a drop shadow. It looks like it pops out at you. And then you use that as a call-to-action…
Julz: Yeah. Awesome! I love it and this is I find this more your gifting actually. As we’ve been designing and working together you have brought this more into NCC’s approach to website design and focus as well. So it’s really cool!
Josh: I just like making things look pretty!
Julz: I ain’t got no time for that! Too many clients to build websites for!
Josh: Speaking of making things look pretty, number five prediction is micro interactions.
This is mostly… it’s kind of like user interface animations. It’s the things that even we don’t necessarily notice. We take them for granted.
Julz: The subtleties….
Josh: Mmm, but they are those subtle things that make your website seem more human, seem more reactive, seem like you’re actually making changes. And so, an example is like when you upload a file, and then you hit the submit button and you then you see an upload status bar pop up and it goes from zero to a hundred percent. That’s a micro interaction.
Josh: Another one is like you hover over a call-to-action and then the colour of that button saturates, and the button gets a little bit bigger. That’s a micro interaction.
Julz: Yeah I like that effect!
Josh: Yeah, same. You scroll down in e-commerce category page and focus your cursor over a particular product that you like and then a sale icon jumps up and down on the product. So micro interactions let the user feel what they’re doing. They bring your site to life. The user gets instant feedback, direction, and in some cases emotional validation.
Julz: What’s that?
Josh: As in ‘I feel so nice when I click a live chat, and then it like bounces and gets a little bit bigger’.
Julz: Sure! The joy!
Josh: Just me?
Julz: The joy! The joy in the website! Yeah okay.
Josh: Like for example, have you clicked the Facebook ‘like’ button.
Julz: I haven’t but you were just telling me about it.
Josh: When you click it, the thumb zooms a little bit, and then it looks like it slams down on the page, and then these little blue like lines pop out of it you look like there is more of an impact.
Julz: Imagine. I wonder what the kind of person is like that has to come up with that.
Josh: Like me! It’s probably like 40 minutes on a pulsing button.
Julz: Yeah, and it probably will last like six months. Anyway!
Josh: How dare you!
Julz: That’s just me. I’m being cynical.
Josh: But I feel like those little things will play more of a role than like big animations in particular.
Josh: It’s those little things that kind of set your website apart. It’s those little things that make your website seem more professional than just built on even a drag-and-drop builder.
Josh: So I feel like those are getting a little bit more popular. So did you have anything to say?
Julz: No. I’m just looking at the next one actually, AI and contextual technology. I think that this one started to rise up last year quite a bit, but I think that it’s evolving quicker than we realize.
Josh: Yeah. Most definitely! And so, when you say AI and contextual technology, what do you mean by that?
Julz: So things like a live chat and those chat BOTS, you know those things that talk back to you automatically and things like that, and engage with you not on a human front. It’s… yeah…
Josh: It’s artificial intelligence, and it’s like you land on a page, and let’s say that page is… let’s say you’re on a physiotherapist page.
When you land on a service page, a chat BOT appears and says hey I’ve noticed that you’re looking at booking an appointment for our physios. Can I help with that? You open it up and then it runs you through, step-by-step on how to book an appointment.
But, let’s say you click on a shop instead, and you want to buy shoes. They offer like orthotics or something. The chat BOT shows, like sees that you’re on the shoes page and so it gives you a different welcome, like hey I see that you’re checking out some of our orthotic devices. Do you need some help? What’s your shoe size? It’s that kind of contextual technology that depending on where you are on us on the site, it looks different.
Julz: And not all chat BOTS are created equal! Right?
Julz: So we use a specific one and we’ll chuck a link in that offers that kind of level of engagement with people.
Josh: Most definitely! And you can hear more about the chat BOTS that we use in episode 12 of this podcast of Creative Juices, where each have a little bit more about it.
But another example of AI and contextual technology is, like I went onto a sunglasses website. I think it’s called Le Specs?
Julz: Oh yeah, I like Le Specs.
Josh: Cool. And they have this AI technology now let’s say you’re looking at purchasing the new pair of sunglasses. You go click AI and then take a photo of your own face, and then it puts the sunnies on you so you can see if those sunnies suit you!
Julz: Yeah. Wow!
Josh: That kind of that kind of AI is crazy!
Julz: Yeah! Big budget!
Josh: Big budget! Another one is, let’s say your landing page, you create a landing page for Google Ads. The navigation may look different to your normal navigation. Let’s say you remove some of the exit points because you want people to focus on just that one thing. And so our prediction is, that kind of contextual technology and that kind of artificial intelligence will increase in 2020. Websites are becoming more conversational.
Josh: …which leads into number seven, which is voice.
Josh: Voice. Have you ever used a Google Home?
Julz: No. I did try to set mine up and I failed, so I gave up.
Josh: I’m the total opposite. I have three Google Homes and all of my lights are connected!
Julz: I feel like this is a reflection of the differences of our personality types. I… yeah, I definitely try to keep things simple. So for my house particularly, even my phone. Like I don’t even use Siri to be honest.
Josh: No way!!
Josh: But voice is massive!
Julz: Voice is massive, I do have to say.
Josh: You’re one of the minority!
Julz: I am. I know that. I’m very aware of that.
Josh: So this is what I mean by voice. So for example, I’ll just bring up my phone. Hey Siri what is SEO?
Siri: The domain name system of the Internet consists of a set of top-level domains which constitute the root domain of the…..
Josh: So I just asked what is SEO. It came up with a website that says what is SCO. So this is a great example, because websites are not optimized for voice yet.
Julz: There you go!
Josh: And so if we’re wanting to take the online space seriously, we need to think about voice. People are looking for answers by using their voice devices, whether that’s Alexer, whether that’s Google Voice, whether that’s Siri, they’re asking questions. And the only sites that are going to show are ones that are optimized for natural language passing.
Julz: Yeah and also on the very technical front it’s setting the schema and structured data properly, which Em covers in her course, because there are things like… it’s easy enough to put like what is SEO as a question on your website, but if that piece of tag and the answer hasn’t been optimized correctly, then…
Julz: …I mean, how many people would have what is SEO on their website? But it just hasn’t been optimized properly, clearly.
Josh: Exactly! And so voice search is on the rise. Is your website going to work for that? And so, some of our predictions were number one, Brutalism. Number two, whitespace and minimalist design. Number three, grids and cards. Number four, the death of flat design. Number five, micro interactions. Number six, AI and contextual technology. And number seven, voice optimized content. And now we get on to number eight, which is less of a prediction, but more of a personal hope of ours…
Josh: We hope that this means that websites are becoming more user focused.
Josh: Because you look through that, and you’re looking through voice, you’re looking through those micro interactions. It looks like web design and web building is going towards actually providing a good experience for the user, making it more natural, more conversational. The user experience is clearer. The very things that we bang on about all the time.
Julz: Yeah. And I know that like there’s a bit of a backlash against gathering data and things but if it wasn’t for that gathering of data, certain types of data, then we wouldn’t be able to assess the human behaviours and things that people are trying to do or looking to do and wanting to do. And so, all together that helps to create a better user experience.
Josh: Hmm. So we hope our biggest prediction, but more of a hope of 2020, is that we hope the Web Design is moving to provide a better user experience, as in moving people and providing the correct information to people, so they will move people to the content that they’re actually looking for.
Julz: Yeah, and we hope that people will be able to keep up and I think that’s part of it. So you know, if your website is out of date you’re just falling behind.
Josh: Definitely! And so to test if you are, if your website is out of date, just listen back through all of these predictions. Is your website ready for these predictions or is your website implementing some of these predictions? Because if not, your website may very soon be left in the past.
Josh: And so that’s it for today. Thank you for listening.
Josh: Next episode we are busting some of the biggest SEO myths that you probably still believe.