UX Design – Wireframes, Design Comps, and Discovery
#Ashley
Hello. Welcome to our second episode of BrandKnow, a video series on all things e-commerce with the Brand Labs team. We’re located in metro Detroit with a fully remote staff that is made up of just over 25 senior level employees that are specialized in custom web development, UX, UI design, SEO, and system architecture. I am really happy to have Lindsy Carman joining me today. Lindsy is the head of our UX and design here at Brand Labs, welcome.
#Lindsy
Thanks Ashley, happy to be here.
#Ashley
Your title, head of UX and design. I think a lot of people might not know what UX means, can you tell us about that, the meaning and why it matters?
#Lindsy
Yes, absolutely. So UX actually stands for user experience and it focuses on the experience a user has while using a product, in our case e-commerce websites. So good UX provides a clear user journey with an easy to understand user interface that has clear goals, such as buy now, add to cart, checkout. And this is really where design and business goals intersect. UX now is more important than ever because there are so many online stores to pick from. So it’s very important that we make it as easy as possible for customers to find what they’re looking for and ultimately check out.
#Ashley
Yes, the user experience is so important. I see many prospects come to us for advice and guidance on a more seamless customer experience, because like you said, that end goal is always to have the customer hit the buy now button. So when we look at a redesign to improve the user journey, whether that’s just for a single page or your entire website or a very specific area of a page, our team can create wireframes. And I couldn’t think of anyone better to explain wireframes than you Lindsy, Can you explain to us what they actually are and how they help our clients in our process?
#Lindsy
Absolutely. So wireframes are the foundation, they are super, super important to start with. They are essentially a blueprint, they’re black and white, they lack color images, graphic elements and even font choices. So what this does is this allows us to really focus on the structure of the page to ensure that it’s a good user flow and that we’re hitting the business goals, which of course buy now. So what I personally love about wireframes is they really encourage discussion. We’re not being distracted by what images someone may like or not like or color choices, et cetera, we’re really just focusing on that structure first.
So another thing I thought would be important is to kind of explain the difference between a wireframe and a design comp because I see a lot of people mix those two up a lot. So now that we kind of understand a little bit more of what a wireframe is I’m going to tell you a little bit about a design cop. So a design comp uses that wireframe structure and basically, we’re adding the decorations, we’re adding the beautiful imagery and the fun graphic elements and that’s where it really comes to life. And if you would love to hear more about why wireframes matter and how they can actually save you money in the long run by starting there, definitely check out our blog why wireframes matter.
#Ashley
Thank you so much for sharing that information. I know at Brand Labs, wireframes play a really important role in our discovery phase. Can you kind of walk us through what our discovery phase looks like and how wireframes are included in that?
#Lindsy
Definitely. So fun fact, the discovery phase is actually my very favorite phase and I’m going to tell you why. This is really where we get to know our clients and their overall vision. And so the way the process works is we start with a kickoff call with the client and then my team will lead with a series of questions to really get a good understanding. And then from there, we review our notes from that as well as analyzing Google Analytics to kind of see what customers are doing and maybe where they’re dropping off, so we can make sure to improve that. From all of that information we build out wireframes. After that we have a review call with our clients to review the wireframes and kind of walk them through the flow and then we’ll make any adjustments needed.
And while that’s happening, my team will work with the development team to build out technical requirements. And technical requirements, probably the least exciting part, but honestly so, so important because this will ensure that we’re all aligned and the project goals are the same for all included. So this will include certain functionality that’s required and different interactions that we want to see happen. So this not only helps us make sure we’re all aligned, but it really helps us provide accurate quotes for the next phases of the project. Once those are complete, we package everything up to handoff to the client, which ends that phase. So they will receive the wireframes we created as well as the technical requirements and then at that point we’re able to give a design phase cost and timeline as well as estimates for the development phase.
#Ashley
Thank you so much for all the really great info on the importance of the user journey and why wireframes matter, especially about our discovery phase, because it really is a key part of our entire process. We want to make sure that everything is lined up and transparent for our clients as we move through the phases. So if you’re looking to improve your user experience with a redesign or you have questions on how Brand Labs can help you improve your online store, feel free to visit our website or send us a message at hello@brandlabs.us. Thanks for watching from all of us at Brand Labs.