Hand-drawn website wireframe on paper with navigation tabs, content panels, handwritten notes, and red annotations

Planning Website Design Projects with Prototypes

• 5 min read

476 Shares
Save

Prototypes help you test ideas before you spend too much time putting them into practice. The best prototype has some functionality that mimics the intended product and there are plenty of tools to develop prototypes with available on the market. But what should you do to make your prototypes as valuable as possible when you plan your web design projects?

Structure First


Author/Copyright holder: Shawn Campbell. Copyright terms and licence: CC BY 2.0

You need to think about information architecture and navigation to build a good prototype. That means you’ll need to understand the page structure of the site and ensure that your information is easy to find and easily indexed in search engines.

Content Second

You should know where your users are most likely to arrive on your website. That’s because those are the pages that you’ll be putting the most SEO efforts into and of course, your home page. You want to include at least rough copy for these pages in your prototypes – this is where you can get some feedback on language and ideas. At a minimum you should be able to explain what kind of copy will be on these pages.

Content Third Too


Author/Copyright holder: Sally Wilson. Copyright terms and licence: CC BY 2.0

What other key content are you going to use? Will you have a newsletter to subscribe to? Will you be using a lot of video content hosted on YouTube or locally? Are there whitepapers to be shared? And so on… the more solidly that your content is developed. The easier that this process will be to prototype. Breathe life into a prototype and the value of that prototype goes up.

Merge Content and Structure

The next step is to bring your website’s structure together with the content. Where will everything go to achieve your objectives? Is it clearly understood how your chosen content management system will enable these items to be added and displayed correctly? Does your final structure and content strategy match your user’s expected workflow?

Revisit the Home Page

Yes, you had a plan for the home page before but now you have content and structure; does the home page meet the needs of that content and structure? The more you refine your homepage –the more likely it will be to meet your user’s needs.

Implement Search Functionality


Author/Copyright holder: Bhupinder Nayyar. Copyright terms and licence: CC BY 2.0

You want to spend a little time ensuring that search functions work. That’s because they’re the most often called on by users that are lost. You might also want to spend some time on your FAQ/Help pages for the same reason.

Summary

These are the basic steps towards developing meaningful prototypes. There are, of course, many others that you can implement and as you become more familiar with prototypes – you almost certainly will. This guide is designed to give you a starting point, nothing more. It takes time and experience to deliver the best possible prototypes for user testing.

Header Image: Author/Copyright holder: Sockyung "Sox" Hong. Copyright terms and licence: All rights reserved. Img

Learn More in This Course:

Learn Design and AI From the Best

Get one powerful email each week, like 312,428 others.

Next email in:

What You Should Read Next

  • Read full article
    The Relationship Between Visual Design and User Experience Design - Article hero image

    The Relationship Between Visual Design and User Experience Design

    A common perception about UX designers is that we are artists who can create beautiful interfaces from a blank canvas. While the aesthetics of products are important, visual design is only one aspect of the design process – in which team members with different skillsets and expertise collaborate

    Social shares
    802
    Published
    Read Article
  • Read full article
    You’re Not Bad at Presenting; You Just Haven’t Mastered the Right Way (Yet) - Article hero image

    You’re Not Bad at Presenting; You Just Haven’t Mastered the Right Way (Yet)

    Ever walked out of a presentation thinking, “That could’ve gone so much better, maybe I’m just not a presenter”? You’re not alone. And you’re not the problem. You simply haven’t been shown an easy, clear, repeatable way to prepare, deliver and follow up.Presenting is not an innate talent; it’s a ski

    Social shares
    359
    Published
    Read Article
  • Read full article
    The Power of Mapping - Article hero image

    The Power of Mapping

    The map is one of the earliest and most important human inventions. It helps us to navigate our complex world. Maps simplify complex spaces, create shared understanding, reveal hidden insights and help us coordinate action. Around 25,000 B.C. a person carved the earliest known map into a mammoth tus

    Social shares
    588
    Published
    Read Article
  • Read full article
    The Past, Present, and Future of Virtual Reality - Article hero image

    The Past, Present, and Future of Virtual Reality

    Virtual Reality (VR) has come a long way since its humble beginnings—with stereoscopic images back in the 1800s—“astronomically” far, in fact! Twenty-first century VR catapults users into immersive and interactive 3D environments, ones that let them experience something far beyond what they find in

    Social shares
    647
    Published
    Read Article
  • Read full article
    Turn Your Non-Design Experience into Design Portfolio Gold - Article hero image

    Turn Your Non-Design Experience into Design Portfolio Gold

    Have you ever wondered how to transition into UX and product design from a different career background without feeling insecure? Let's uncover strategies to confidently bridge the gap and showcase your skills to prospective employers with confidence and clarity.In this video, Morgane Peng, Desi

    Social shares
    508
    Published
    Read Article
  • Read full article
    Structure First: The Inverted Pyramid and Visual Organization - Article hero image

    Structure First: The Inverted Pyramid and Visual Organization

    This clip examines two principles that work hand in hand to make web content readable: the inverted pyramid approach to information order and the use of visual structure to help users scan efficiently. William Hudson, UX Strategist and Founder of Syntagm Ltd, describes the theoretical basis and prac

    Social shares
    206
    Published
    Read Article
  • Read full article
    What Is Card Sorting? - Article hero image

    What Is Card Sorting?

    In this video, William Hudson, UX Strategist and Founder of Syntagm Ltd, introduces card sorting: what it is, where it comes from, and the broad range of problems it can help solve.Card sorting is a research technique in which participants organize a set of items into groups that make sense to them,

    Social shares
    173
    Published
    Read Article
  • Read full article
    Design Accessible Navigation for Keyboards and Screen Readers - Article hero image

    Design Accessible Navigation for Keyboards and Screen Readers

    Accessibility is often treated as a finishing touch, but for navigation, it belongs at the foundation. Menus are how users reach everything else on a site, so a menu that works only with a mouse quietly shuts out anyone who depends on a keyboard, a screen reader, or another form of assistive technol

    Social shares
    173
    Published
    Read Article
  • Read full article
    The Scent of Information: Give Users the Confidence to Click - Article hero image

    The Scent of Information: Give Users the Confidence to Click

    William Hudson, UX Strategist and Founder of Syntagm Ltd, introduces the scent of information as a model for understanding how users navigate toward their goals, and sets out the principles for writing navigation links that strengthen that scent.Information Foraging and the Scent of InformationThe s

    Social shares
    173
    Published
    Read Article
  • Read full article
    4 UI Design Tips Every Designer Needs to Know - Article hero image

    4 UI Design Tips Every Designer Needs to Know

    User interface (UI) design can make or break any digital product. A user often won’t even notice when they interact with a great UI. They feel the visual appeal and simply trust it. On the contrary, a bad UI design can prevent the user from interacting with a product intuitively or at all and lead t

    Social shares
    646
    Published
    Read Article

Top Articles

Top Topic Definitions

39% of Today's Skills Will Change by 2030

The World Economic Forum expects 39% of today's skills to be transformed or become outdated by 2030.

The good news is that jobs in UX / UI design and AI are among the fastest-growing professions globally.

Build Skills That Keep You Relevant

Privacy Settings

By using this site, you accept our Cookie Policy and Terms of Use.
Customize
Accept all

Be the One Who Inspires

People remember who shares great ideas.

Share on:

Academic Credibility — On Autopilot

Don't waste time googling citation formats. Just copy, paste and look legit in seconds.

Learn Design and AI From the Best

Get one powerful email each week, like 312,428 others.

Next email in: