Data driven. Versatile.
Marketing with style
and substance. Show me more...
engaging and compelling
video since your wedding
tape. It was beautiful.
We’re not crying.
You’re crying. Show me more...
and innovative designs
outside the box.
Actually, there is no box.
Or is there…? Show me more...
the ground up.
Absolutely no hacking
required. Show me more...
What You Need to Know About Customer Experience
Customer experience (CX) is paramount, now overtaking price and product as the main reason someone chooses a brand.
So how can you craft an incredible customer experience from the ground up, across all your channels, that’ll make customers keep coming back for more? James chats to Justin, our Head of Design, on doing exactly that.
James: Brand is one thing, but it’s actually part of communication, and keeping communication consistent with the memory that you’re trying to form. You just touched on ‘the experience’, which is actually customer experience, or CX, and how that’s impacted not just through smart thinking to make the journey better for the customer, but it actually relates to the brand as well.
So, customer experience, or CX for the fancy term: what does that mean now? Particularly when we’re designing things from a digital point of view?
Justin: I think customer experience is increasingly becoming central. Brand theory is almost starting to move to de-branding your product. There’s other reasons why you do that, but the fact is that it doesn’t really matter who you are; it’s the service that you provide that is critical.
Your brand is almost defined by the level of customer service you provide. In the case of Apple, you make a computer that just does not break down, and that generates positive word-of-mouth. There’s things you can do as a company to articulate the brand, but it’s like an author with a book, once it goes out into the world.
Just to rewind slightly, in the old days, brand was all about impressions, so the number of print impressions you make with people, that accretes in someone’s mind. Back in the day it would’ve been cigarette brands, or something like that, but NOW, because of the internet and because everyone can feed back on your performance, 24/7, round the world, how you deliver the services you deliver and how good the product is.
So it’s funny, because the actual visual part of it is still important, but it’s only one part of the toolkit now, whereas before, it was MOST of it.
James: When we think of website design…I say to you ‘website design’, the average person instantly thinks of a picture of a laptop and a website on it. Whereas in fact, people interacting with a website over fifty percent of interaction is on a mobile device; it’s not on a desktop. Which is why we’re not making sure design is done from a mobile-first perspective.
I think the other thing that’ll be really interesting for people that they don’t understand yet: that more sales and ecommerce transactions are completed on a mobile device than on a desktop. So making sure that your shopping cart works perfectly on a mobile device is actually more important than making sure it looks beautiful on desktop.
So how do you go about approaching a design? What’s different about a mobile design, versus a desktop design?
Justin: Homepage is critical, and just by virtue of how people scroll, you need to think about how you’re going to chop your information up, how it sits on the page, where your content blocks are, also keeping the layout interesting as you move down, visually. If every one is open space, with text, text, text, with alternating background, maybe people won’t stop. It’s just important to break it up so you’ve got things people can interact with; they can slide things backwards and forwards.
Just thinking about what your key messages are, and where they go. And also, as you move down the page, just making sure that you do break up what you’re saying carefully, and that there are visual reasons for your eyes to stop. You’re almost absorbing the page with your eyes before your brain engages with the words. There’s a stage where people think ‘oh, that’s interesting, I’ll stop and read that.’
I look at people on the tram all the time, and it’s fascinating to see how they consume. With social media feeds, you start to think: why did they stop there? And it’s all of that sort of thinking.
James: And that’s why mobile design is so important: to understand the flow. It’s not about taking a design you’ve done for desktop, then forcing it to fit into a mobile.
Justin: No, you need to think about it the other way round. You do the mobile first, you write the content that’s going to be engaging. It’s short, it gets people engaged; it’s almost like your home page is a taster. If people want to read more, then okay, you’ve got them, they’re clicking on links or tapping on links on the home page. Then they can dive into more detail once they get two or three layers deeper.
James: So you’re touching there on the navigational journey, and the user journey…what’s ‘user experience’?
Justin: So a user experience is basically what it says on the tin. It’s the experience the user has when interacting with the site. We have customer journeys; when you look at the information you want to put in front of people, it’s like the most commonly trodden path through the site.
“In basic terms, it’s making it easy for the user to get the information you want them to see, as quickly as possible, with as few clicks or bumps in the road as possible.”
James: In summary, small business owner, looking to do a website, or even a larger business owner for that matter…looking to start designing a website. What things should they look out for, approaching an agency, or a designer, or getting it done in time. What are the key things that they should do? What’s the website build process look like?
Justin: I think it’s important that the agency gets to know you properly. You always know your business better than the agency, that’s kind of a given, but it’s good to have an initial meeting to work out what your key messages are, have a look at any current sites you’ve got, stuff you don’t like, stuff you like, stuff you want to keep.
James: So once you’ve got your site map fully fleshed out, and you’ve got all your different pages that you want to have included within that new website, what’s the phase from there? Once that’s been locked in.
Justin: So then we go to something called a wireframe. It doesn’t have any colour on it- because colour can be a distraction- or any words. It’s basically a black and white layout just showing where content will sit. And what that forces you to focus on- especially if you’re not a designer, and why would you be coming to us if you are- it shows you how the pages will work, where the content will sit, you can see where your messages are, how you as a user would move up and down a page without being distracted by what’s actually there.
It’s just a good way of getting the flow of information correct without getting distracted.
James: So it also allows you to delve more into the function and understand purely just from a flow: how’s it going to work, where a content block’s going to go, and for the different page layouts.
Justin: You can see where calls to action are. It’s a chance to modify and make sure the messages you want to push are front and centre, where you WANT them to be front and centre.
James: I suppose this is the other thing about what we said at the beginning: what are the best things to do for a small business is, by the sounds of it, is opportunities for feedback, making sure it’s on the right track, so you don’t end up with an end product before you’ve given your feedback.
So we’ve got feedback on the site map, to understand the structure of the site, and then it goes into the wireframe, where clearly there’s going to be some really good, detailed feedback, just from a functional point of view. Starting to understand where content is going to flow.
What’s the step after that?
Justin: After that you can start to get into putting some clothes on the mannequin, if you like. Then you can start to look at if there’s an existing brand, you can start to apply that, you can start to apply colours.
There is some room for movement at that stage, if they’ve not done a website before, to maybe add some colours to their palette, or add a second or third typeface to their library.
James: And this is where potentially modifying that style guide that we spoke about earlier is a good opportunity.
Justin: Most small companies either won’t have a style guide at all, or they’ll just have one or two pages that show what the logo is, a colour and black and white version. So it’s a great chance to put some rules around what is your most important asset- your website- at that early stage. Again, if you do modify the site or expand it, you’ve got those core building blocks that you can always refer back to.
James: We’re talking about this wireframing and going to the design phase so we know what it’s going to look like. Obviously we take it for granted that we’re designing that mobile first, as well as desktop, almost in symmetry but focusing on mobile first.
So what’s the end output? The client can actually see what their site’s going to look like before they actually start investing in the development phase?
Justin: For a small site we might design evey single page, so you can see what it’s going to look like . You then look at those visuals and you say “can we change this, can we change that”, so it’s a chance to feed back on how it’s going to look.
James: And of course it’s much easier to make changes at the design phase rather than it actually being developed.
Justin: It’s easier to move things around when you’re designing things, rather than when you’e actually building the live pages, where it can be like the butterfly effect: a small change here can affect something elsewhere.
So it’s good that customers can go on that stepped journey.
James: Awesome, so that’s obviously the design phase for the journey, and we’ll speak to a development specialist later to take us down the journey of the development phase of a website.
So just to recap, we’re saying: lock in a sitemap, understand the flow of content through your pages, wireframing to get a really good understanding of the different page layouts and the flow, before stepping into the next phase. Third and final phase would then be to put flesh on the bones, and actually to then build it out in terms of all the colours, the features, the full design and the layout before committing to the development phase.
Justin: And just as a small business, if you don’t have any knowledge of this area, you look at a website and go “that’s great”, but it’s not just about making text look pretty. It’s about how you organise your text; it’s about how you write your text; how you pair that up with your images; how you use colour. And it’s good to just go through those things one step at a time.
It’s a pleasant journey to be taken on, and by involving the client at every stage, they feel more involved, rather than just taking their content and building something.