Website Trends 2016 – What is Material Design?

Good morning, internet fans. Ryan Perry here, Simple Biz Support. Today is Thursday, August 13th; therefore, it is Internet Marketing Thursday and therefore, I have Virginie Dorn with Business Website Center on the other side. Good morning, Virginie.

Virginie Dorn: Bonjour, Ryan. Comment vas-tu?

RP: Bonjour. Se habla Español.

VD: Ay, yo hablo Español tambien.

RP: Yeah, que buenas!

VD: How are you?

RP: For those that can’t tell by Virginie’s accent, I don’t know how many months we’ve been doing this but it’s a long time. She speaks French very well and that’s because you’re from…

VD: France.

RP: Which part of France?

VD: I’m from Provence in the south, beautiful place, very touristic.

RP: Alrighty. And after many years traveling the world, she’s here in the United States and we’re very fortunate to have her. Today, we’re going to talk about something… It’s an interesting concept. It’s a new concept to me because web development design is probably my weakest skill out of everything, but this is something that’s kind of trending and it may become more popular. We’ll see how it comes, so why don’t you give us the background on what this concept is of web design?

VD: Sure. So, “Material Design” is a term that was actually introduced by Google itself in their last conference in San Francisco. Once a year in San Francisco, it’s always in our neighborhood, Google does this big software conference. A bunch of geeks attend and they talk about what’s coming up with Google. They often talk about algorithm and they give you bits of information. But last year, they surprised us by talking about design and they like to think of themselves as trancenders and in some ways, they are. They come up with a concept of Material Design. They have pages and pages on the matter. It looks like a white paper. I was joking with you, it seems like someone had too much free time by the way it’s read, it’s very wordy. But saying that, again, this is Google, we’re talking about the biggest player on the internet so we should pay attention to the trend they’re trying to set, which is Material Design. If you want, maybe I should do some screen sharing so I can explain what we talk about?

RP: Yeah, I think that’ll definitely make it easier. Go ahead and get your screen set up. One of the things that we were kind of talk about earlier is that it’s a very bold kind of an art deco-y look, and it’s always interesting how what’s old is new again.

VD: Oh, yes.

RP: What really be interesting if the early days of the internet, the basic web design, big flashing bright colors, if that ever becomes trendy again.

VD: Yes, so we’re back into the neon colors and bell bottoms. But in a way that modern, very sleek design is there to simplify the visual and simplify the dynamic behind web design. Over time, thanks to new coding techniques, things got… We talked about it many times, got too busy, too flashy, it’s like someone had too many crayons and wanted to use all the colors, and as web designers, we are guilty of that. It’s like, “Oh! We can do that, so let’s do it.” But that doesn’t always mean it’s a good thing to do.

RP: All right. Well, I always refer to it as, it’s like the little kid at Christmas who gets the best toy ever. You get the best toy ever on Christmas, yeah, you want to play with it, you want to play with it for a while until you realize okay, well, maybe it’s not the best toy ever.

VD: Yes, at that time it seems like it. Again, the purpose behind it is to really have classic look, oftentimes, very angular, very bold, but very solid color, so not too much patterns. And the second purpose is also making it simpler for visitors to know where to click. Again, they’re not bombarded with a bunch of movements, maybe movements is all going into one direction, that’s where their eyes need to go. So sometimes, things flies, left, right, top, bottom, the visitor gets confused, so again simplify the process by giving it that very clean… As you can see here, it’s a simplified version of it but you can get the idea behind it.

RP: Right. And this ties into what we were talking about last week as far as kind of taking a lot of that wow factor out of the website because a lot of times even though it looks really cool, the user experience is affected so if we can affect the user experience in a positive way and still have nice design, it’s just going to make it easier for people to find their way through your website, it’s going to make it easier for them to make a buying decision; therefore, it should affect your bottom line as far as additional sales.

VD: Yes, true. So let’s take a look at their example here. So there’s a lot of color scheme combination and some new ones, just like purple and pink, and purple and red, and pink and red, colors in the past we would never put together. Or even blue and green, some bold colors but because they are solid in their nature, they’re easier to put together. And if you look at the middle one, you have orange and fuchsia. Typically, that’s not two colors you would think would go well together, but it’s intentional in its nature to grab your attention. But again, because it doesn’t have any pattern within, it makes more sense. And again, as you can see here they have the word “intentional” so the big thing behind Material Design is the intention of the designer.

VD: What do they mean to do by using that graphic? As you can see here there’s a plus sign. So you have… You’ll want to click on it. This one doesn’t do anything. That’s just a sample. But it’s very angular, very clean. The plus sign is right there. It doesn’t have a little arrow, a little movement, it’s… Again, I don’t know how else to… Very sleek, modern, very easy to understand for the visitor on your website. What else? The motion meaning. So that, again the meaning, the intention. So, let me see if they have an example here, animation. Authentic motion. So, as you can… There’s a lot’s of words here. I’m looking for one to show you. All right. Okay. I don’t know if that’s a good example. Sometimes what… So I read through the entire thing. It’s a read, so if you’re bored and have nothing to do in your life, I encourage you to read it. Sometimes…

RP: And just… Just so you know, the… If you’re looking for the link, the link is actually in the chat box there. So you can go ahead and click on it.

VD: Yes. Sometimes for instance, so you go to a page and there might maybe four to six boxes and there’s some kind of movement and each box runs into a different direction. With Google, and the principle behind Material Design, would be to have all those boxes move out of the page in the same direction in unison. Is that the word? You know, together. Again, making it less busy to the eye. So that’s… Again, the idea of Material Design is if you’re going to have motion, it has to have really specific meaning behind the motion and it has to be simplified in a way that it creates no confusion regardless of the technical level of your visitor. Does that make any sense?

RP: It does. Unison, I think, is a great word because I think it creates… I don’t know if a lot of people when they realize the words they use, the colors they use, the imagery they use and how they put it all together. Regardless if it’s a website and or a brochure, is that all the little subtle things subconsciously make a difference. You know it’s that… “This just feels right, so I’m going to go ahead with that”. Or “You know this doesn’t feel right so I’m going to go away”. A lot of times, you can’t pin point it. You’re not able to say “This is why I decided to go forward, or this is why I decided to go back.” And so for me, whenever I’m talking to clients it’s all about reducing barriers. If we can reduce the number of barriers and make it easy for people to make a decision, then we’ve done things correctly and I think the idea behind the movement, is that you’ve got all these stuff moving around, that’s a distraction and now your brain’s focused on all this different stuff that’s going on, instead of really focusing on what the message of the website is and what they are trying to convey in order to move you forward. So if you are going to have moving objects it makes sense to me that if they all slide off at once, that ‘s easier on the brain I don’t have to focus as much on that, ’cause they all disappear at the same time.

VD: Yes. You explained it so much better than I did. And I’ve seen galleries with maybe a couple of dozen photos and the photos will highlight a different time and a different places. So it won’t go one, two, three, four, five. It would be like photo one, then photo ten, photo three. And you want the focus of your visitors to be on what you’re trying to sell them, not on the cool little gadgets. ‘Cause it’s like remembering a cooler commercial on TV. It’s so cool you remember it, but you have no clue what they were selling. You can’t remember the brand, because the joke behind the commercial was just too strong and not…

RP: Right. You know, and I think the other thing with that also is that there is a lot of intent behind designers to keep people on a web page longer. That was really the focus and when you focus on that versus the story or the message, what it is that you’re trying to get across, that creates problems. So I think it came from good intentions, “Hey the longer we keep people on your website, the more information they’ll take in, and they’re more likely to sign up or buy your product.” Well, the problem is if all that attention is on things that are not relevant to your business, then it could actually be hurting you versus helping you.

VD: God, you’re right on the money on that one. You want to get… Like especially in e-commerce website, retail stores, you want to get them to the shopping cart as quickly as possible. If you can do it in one minute or less, it’s an insured sale. Like they don’t have to over think it. If you can make it too interesting and they just never make it to the payment page. So as quickly as possible. That’s always what I tell clients. You want people to get to where they need to go on your website as quickly as possible. ‘Cause people are busy, people has a very small attention span, if you can reduce the busyness and the complexity of your site with Material Design, again by doing meaningful design, meaningful transitions, then you have a more effective website.

RP: Yeah. Totally makes sense. Do they… Is this video on this page, do you know if it’s an actual example, oh, you bounced.

VD: Yes. Well, there’s a lot other thing missing. Where is the video? I can’t find it. There’s so many pages you can… So there’s a video here.

VD: So it does have interest. Again, you do have to lead to the… Obviously, I encourage, every web designer should be reading through the material because there’s a lot of insightful information. But also, if you’re interested in re-doing your website, you want to do it right so it lasts you for many years to come. And there is a lot of good stuff here, just like colors. As you can see bold colors, somehow they all work together. Who would’ve thought? And you can use bold colors and still remain true to your branding. So you might have a color scheme established. But by making them bold, you can see there’s a little bit of texture on the orange here but so slight and something for icons. Icons are more… As you can see here, it’s an envelope. Oh, it must be their email button. Imagery, typography, the easier… Like typography is typically easy to read, very little script into that form of designing. It’s typically a Sans Serif, very angular, very easy to read regardless of your screen size.

VD: And then they have more about the tone of writing, the language used. You obviously want to use a internet language, not like if you were a professor at the university speaking. There’s tons of things here. You can… Give you ideas and then you go back to your web designer and say, “Hey, I was reading on Google about Material Design and I really like the concept of colors and keeping them bold and solid. Can we do that on my new design?”

RP: All right, the important thing is that your web designer actually understands this concept though ’cause if they don’t you’re asking them to play with a foreign concept and that could create issues. So that’s all very interesting. The word “Material Design” when it comes to internet because the internet is just proof it’s out there, it’s up in the clouds, right? I think that the idea behind the name “Material Design” is very interesting. I’m sure they have a great reason why.

VD: Yes. Google is very interested in the user experience. That’s always been the number one goal not just in developing content or delivering content I should say, but also how they feel after they get the experience if they are on a particular site. So it’s always been remember when focused. That’s what’s that’s made them so successful. They are really considering the end user, and as a business owner we should all think about the same thing. Who is buying from me? What do they want? What do they need? And once you answer those questions, you can do a lot of very effective and powerful website and will render the results you want for yourselves.

RP: All right. Well, perfect. Well, tell you what, it is 10 o’clock here on the West Coast, that means it is the end of this episode. I think the key takeaway from the last episode last week and this week is really simplifying things. If you’re going in and you’re thinking about your website, 2016’s coming up shortly. If you’re looking to redesign your website, the trend now is to simplify things, minimize things, and I think Apple’s always done a pretty good job of that. They’re always one of the websites I want to go back and look at again and again and see what they’re doing just because it relates well to me. It may not be right for everybody, but it relates well for me.

VD: Yes. And if anybody has any questions, I’m happy to answer the questions either on Skype, in person, over the phone, or in email. Just contact me and I’ll be happy to help you about what Material Design, if they can work for your website.

RP: Yeah, perfect. Or you can always just leave a comment below, we’re always checking out the comments and we’re responding to those on a timely basis. Virginie, as always, I appreciate your time and we’re going to keep this design topic conversation going into next week, so we look forward to seeing y’all next week as we talk more about website trends going into 2016.

VD: Sounds fabulous. Take care.

RP: All right. Bye.