The No. 2 Mistake SS Designers Make
Welcome to our second installation of the top three mistakes that I see SS designers make that can be easily remedied! The number two mistake we are going to discuss is something we have talked about before here on the blog, and that is: WIREFRAMING.
There is a serious step missing in so many designers' process. Why? I think it has to do with a mix of just fear and unknowing. What should you be doing, why should you be doing it? I myself have faced these questions:
• Should I be designing flat format first?
• How do I present a wireframe for a dynamic platform like SS?
• Will my client understand the wireframe?
• Is it really necessary?
• Why would it benefit my client?
Ok let's get to answering some of these questions, with some suggestions, tips and tricks.
No. One | Use Dynamic Wireframes
Ok, this one is one that was one of those "genius" moments within my design process, and something that now, I have figured out to a "t" what kind of wireframe a client needs based on their initial talks and design rounds. There are two kinds of dynamic wireframes you can present to a client, one unbranded version and one branded version.
If you have an experienced client - USE greyscale and unbranded IN squarespace wireframes, if your client is the kind that gets STUCK on a color within their logo and can't see the design as a whole. Go a step further and create a fully BRANDED wireframe.
What does that mean? It means you want to build the ENTIRE site, or at least those main navigation pages, with a full example content. You don't need to be designing just yet - so use grey or colored boxes with labels like "opt-in-graphic-here". You want to be sure before you design custom buttons, that they even WANT buttons.
No. Two | Easier to Understand
This kind of dynamic (actual/real) wireframe is so much easier for a client to understand than a flat jpg or pdf, so you are already stepping up your game with presenting to a client. They will truly GET how things function, and you will be able to have that conversation about the template before you get your heart set on index pages and find out they really want a blog sidebar (sigh).
No. Three | Benefitting the Process
Creating the wire-frame directly in the platform, is something that will get easier as you do more and more of them. Creating a folder on your desktop with your base blocks, is a helpful tip. As well as the more you do the faster you will get. And think, you won't have to figure out what you need to do next or create an extra step in the process. You will be able to go directly into branding, then directly into creating the graphics and implement them right into their spot on the website. If you haven't been using wireframes before, it might be adding a step, but it creates a step that increases the client confidence in the process and therefore benefits the process overall.
Make sure you check out our previous post about wire-framing, and our top three reasons you should be doing them. For more answers and examples on not just a full wireframe, but an example presentation on wire-framing, check out our Squarespace Process Course where we dig into wireframes as one of the full modules within the course.
If you are thinking of implementing wireframes and want even more indepth discussion not only about process, but other deisgn ss questions, join us as a Member! We have in-depth process discussions in slack as well as have a question and answer members only blog where member's questions get answered in full!