The first step in designing a real solution is the general structure of the thing. This is where Information Architecture comes in.
Information Architecture (IA) can be relatively simple with a small project, and incredibly complicated with a large project.
IA is invisible. To work with it, we need to draw a Site Map. Here is a simple example:
This example shows a website with 6 pages: The home page, 2 sections in the main menu, and 3 subsections. The lines indicate which pages are connected by navigation (menus & buttons). Remember that a million users doesn’t mean you have a million profile pages. You have one profile page which can display any user’s profile.
When pages are organized this way — like a family tree — it is called a “hierarchy” or “tree”. Most sites and apps are organized like this (but it’s not the only way).
Deep or Flat, not both.
Generally speaking, your site map will either be very “flat” — which includes more Sections in the menu and requires less clicks to reach the bottom — or your site map will be “deep” — simpler menus, but more clicks to get where you’re going.
Notice that both of the structures in this example have the same number of pages. Equal, but different.
Sites with a lot of products, like Walmart, often need a deep architecture, otherwise the menus get ridiculous. Sites like YouTube, which only has users and videos to deal with, are usually more “flat”.
If your site is deep and flat, that’s bad. You might want to simplify your goals or design a good search as a core feature.
A User Story describes one possible path a user can take on your site or app. It should be short, but complete. You will need many user stories to describe your whole design.
A basic user story for Google.com might look like this:
Notice that nothing in the story tells me specifically how to solve or design those actions; just that they are possible. The purpose of these stories is to describe flows. Sequences of user choices. Not the final UI.
If the flows are simple and effective, you are doing a good job (so far).
The structure of your pages determines the steps in your user stories. And to structure your pages you have to pick a type of Information Architecture to work with (or a couple types, but let’s keep it simple for now). Types of IA include: