Every web design is different, but they usually have one thing in common: roadblocks. There will be times where a design is shelved, or a process changed that throw wrenches into your process. These website roadblocks can be a huge pain, so we outlined 10 of the more common ones and how we deal with them.
1. You’re wireframing a page and you don’t know what exactly will live there.
SOLUTION: Get your content first. The end. It doesn’t have to be final, but at the very least it should be a concrete first draft.
2. Your Sketch compositions look great, but the cut-up looks off even though it’s a value for value match.
a. Are you using Ems or Rems for the typography? We highly recommend this method over pixel values.=
b. Did you test your comps in an as-close-to-real-life environment? For example, if you’re designing a mobile screen, use Sketch’s Mirror app to preview it on your smartphone. If this is an in-browser product, add the surrounding browser interface!
c. Did you provide your developers with an organized style guide? If you didn’t, you’re risking good ol’ human error to sour the design (even when everyone is copy/pasting values)!
3. You’re spending more time fiddling with the website copy than you are designing the website.
SOLUTION: Halting the design process to write or overhaul your copy means you probably also hit the first roadblock. Don’t despair if this is where you’re at, everything is fixable. Print out the pages that need some love, put on your strategy cap, and meet halfway between the design and what the purpose or function of that page is.
4. The site looks sleek, but using it feels underwhelming.
SOLUTION: Did you design with animation in mind? How does motion and movement contribute to the visuals on the website? Putting thought into hover states and page transitions, loading animations can make or break a design.
5. The main user flows are beautiful, but the empty states and on-boarding are lackluster.
SOLUTION: errors, empty states, and on-boarding/first-experiences should have been addressed in the wireframes, because they are part of user flows. Always account for them as early as possible.
6. The idea of writing fresh content for something like a blog or newsletter feels overwhelming.
SOLUTION: scale back the quantity and length! Or remove it altogether, and re-work the visual design and strategy so it works without that content. If writing an 800 word blog post, and finding open-source imagery to go with it sounds like a root canal, but recording a quick 5 minute how-to video is easier, then design for that. Ideally, these things should be worked out from the start so you don’t have to double back on a design.
7. The site has been designed based on recyclable content components, but after testing them with real content they feel restrictive, bland, or too repetitive.
SOLUTION: Again, this is closely tied to the first roadblock in this list. Pressure testing your “biggest” or “worst case scenario” content is essential to designing components that make sense. And the earlier you can do this, the better off you’ll be.
8. There’s ambiguity around business process, logistics, or how the back end of the site is being developed, and the designers can’t move forward.
SOLUTION: Context is important for designers to know how to approach a problem, even if not all the information is directly pertinent. If you’re designing an eCommerce site with a self-help articles section, the designer needs to know how many articles this section will contain. Designing for 30 articles is worlds away from a library of 30,000.
9. We’re not sure how to bridge the visual gap between the custom site design and third party integrations (like an eCommerce platform, or ticket purchasing system).
SOLUTION: Sometimes it means designing around the limitations, other times it means finding a better third party integration, and if compromise isn’t an option then it may be time to “build it yourself.” Ultimately it’s a question of priority: are you willing to sacrifice some visual coherency for the value that this plugin brings?
10. There’s a disconnect between the site and other places the brand/company has a web presence. When someone subscribes to our newsletter, our emails don’t look as nice as the website.
SOLUTION: Designing (or redesigning) a website rarely means the only thing that needs design work is the website. You need to consider all the connected entities, including social media, product packaging, and newsletters. Addressing this in the planning and strategy phase will help you keep in scope and on track.
To help keep your website project on track, check out one of our discussions on How To Deliver a Project On Time.