Illustration by

The Core Model: Designing Inside Out for Better Results

If you’ve worked on a website design with a large team or client, chances are good you’ve spent some time debating (arguing?) with each other about what the homepage should look like, or which department gets to be in the top-level navigation—perhaps forgetting that many of the site’s visitors might never even see the homepage if they land there via search.

Article Continues Below

Nobody comes to your website just to look at your homepage or navigate your information architecture. People come because they want to get something done.

All too often, we blame the client for falling short on user experience. They don’t get that the important thing is that the information architecture is easy to understand—something you will never achieve if every single department gets to have their own button on the homepage.

It’s about time we take more of that blame ourselves. Usually, no matter how much user research we do, or how meticulously we’ve treated the digital strategy, we start out in our interactions with clients by mapping the information architecture or sketching homepages. It’s no wonder clients believe these are the pillars of the entire website, if these are the first things we show them. In fact, very few users actually meet their goals right on the homepage of any given website, so it follows that very few organizations will reach their own objectives—much less their users’—by focusing only on the homepage.

Long before “mobile first” or “content-driven design” were even buzzwords, information architect Are Halland tried to solve this conundrum by introducing the core model, which he presented at IA Summit 2007. The presentation is still highly enjoyable and relevant, even seven years later. In short, websites must be designed from the inside out, with primary focus on the core tasks its users need to accomplish.

When we used the core model technique at Netlife Research to begin a mobile-first, content-driven website redesign with the Norwegian Cancer Society (NCS), we spent less time quibbling over the homepage contents, and more time trying to figure out how we could actually help the users and the NCS get what they needed out of the website—with great results.

The core model ensures that we’re thinking about user needs all the way through the website design process, thinking holistically about goals instead of hierarchically; instead of demanding “Where do you belong on the NCS website?” of our visitors, the core model prompts us to ask, more generously, “How can the NCS help you?”

A different starting point#section2

Using the core model, we start the design process by mapping out all the content we have in order to find the pages with a clear overlap between objectives and user tasks.

To use the core model, you need:

  • Business objectives: Prioritized, measurable objectives and sub-objectives. What does the organization want to achieve?
  • User tasks: Actual, researched, prioritized user tasks. What is it that people want to get done? (We usually conduct top task surveys to identify the user tasks, which is a great tool if you want to align the organization.)

A good review of a website’s existing content can turn up some dusty corners that need clearing out. Typically, a website might have a lot of content that doesn’t help users meet their goals—such as press release archives and lengthy vision statements. A great deal of this content can usually be removed, simplified, or merged in some way.

When you have set aside the nonessential content, you are left with cores. These are pages or workflows whose content fulfills a clear overlap between business objectives and user tasks.

An example from the NCS is their page dedicated to information about lung cancer. Our user research identified a huge need for qualified and authoritative information on the many forms of cancer—and seeing that one of the objectives for the NCS is to educate Norwegians about cancer, this is a clear match of the users’ needs with the organization’s larger objective.

A Venn diagram showing the intersection of user needs and business goals.
Which pages meet both business goals and user needs?

But what happens with pages like “Donate”? Our research showed that users did not typically search the site for information related to fundraising, but being able to receive donations online is essential if the NCS is going to raise more money for cancer research. This is where the core model truly shines: if you create good cores, you’ll also be able to create good pathways to other, less-requested pages on your website, regardless of where they are placed in the information architecture. A core page should never be a blind alley.

Who is the core model for?#section3

The core model is first and foremost a thinking tool. It helps the content strategist identify the most important pages on the site. It helps the UX designer identify which modules she needs on a page. It helps the graphic designer know which are the most important elements to emphasize in the design. It helps include clients or stakeholders who are less web-savvy in your project strategy. It helps the copywriters and editors leave silo thinking behind and create better content.

And to get all these different disciplines to start thinking collaboratively, we’ve found success with organizing team workshops that introduce core model thinking to the whole group.

By the end of the workshop, the group will have a common understanding of user needs, business goals, and how different pages should be connected. Additionally, you have worksheets where stakeholders have given you a prioritized list of what kind of content and modules they believe are the most important on the page they have worked on, when considering both user needs and business objectives.

With a prioritized list of what kind of content and modules needs to be on the most important pages, it’s a lot easier for the team to get to work, regardless of whether they are UX designers, graphic designers, or content strategists. We start by creating the core pages; the homepage is usually the last page we design. (How can you design the wrapping before you know what’s inside?)

How to do a core model workshop#section4

The core model workshop outlined here is the first stage of a bigger design process, which might look a little different from one team to the next. But when you work with clients through these initial worksheets, the end result will be a team that’s excited to see the new website take shape—and is agreed on which content is truly important.

Doing a core workshop is easy and low-tech. All you need is:

  • Handouts summarizing researched user tasks and identified business objectives (see above)
  • Handouts with the core model (e.g., A3 paper size) (to fill out)
  • Markers and Post-Its
  • Room with a projector
  • 3-4 hours per workshop
  • 1-3 participants from your team (e.g., designers, UX, content, developers, and so forth)
  • 6-14 stakeholders from relevant fields or departments in the organization
  • Snacks and lots of coffee!
Core model handout with fields to fill out: core page name, business goals, user tasks, inward paths, core content, and forward path.
The core model handout.

When inviting stakeholders, try to involve people…

  • who will work with the content
  • with strong opinions about the website
  • who should be collaborating, but aren’t

To take part in a core workshop, there is no need for drawing skills, design skills, or tech-savviness. The most important thing is that people understand their own respective fields.

All workshop participants should work in pairs to fill out their worksheets. Between each step in the workshop, they’ll present their ideas to the other pairs, which will usually generate questions or new ideas that the other pairs can incorporate into their worksheets.

Core model workshop with participants discussing and working in pairs. Participants are labeled as socionom, lawyer, cancer nurse, research, design, cancer care, prevention, web editor, and fundraiser.
Participants from the NCS in one of the core workshops included people from the departments of cancer care, cancer prevention, cancer research, rights, and fundraising, as well as their in-house designer and web editor.

1. Identify your cores#section5

The first thing you need to do is to identify your core pages by matching the business objectives and the user tasks. You can do this in the workshop or beforehand. Let’s use the example of our cancer type template, e.g. “lung cancer,” where we matched the following tasks and objectives.

Business objectives:

  • Helping patients and their friends and family
  • Increasing knowledge about cancer and prevention

User tasks:

  • Learn about different forms of cancer
  • Identify symptoms of cancer
  • Get tips for preventing cancer
  • Find information about treating cancer (therapies, adverse effects, risks, prognosis)
The core model handout, partially completed with core page name, business goals, and user tasks.
The worksheet has been filled out with the relevant business goals and user tasks.

2. Plan for inward paths#section6

Instead of jumping into content creation and detailing that page, the next step is to map out inward paths. This is where we’ll look carefully at any user research findings to help inform decisions. How might people find this page? How did they get here?

This approach is a simple way to prompt your client to think about the page from a user’s perspective. In our example of the page about lung cancer, plausible inward paths are things like:

  • Googling lung cancer
  • Googling symptoms
  • Clicking a link on the homepage
  • Finding a link in a printed brochure

3. Determine core content#section7

After identifying inward paths, we begin talking about the core content. What content do we need on this page for it to achieve the goals of both the organization and the users? What kind of modules or elements do we need?

In this task, the participants are using all the information they have on their worksheets: the user tasks, the business objectives, and the inward paths. In light of this information, what are the most important things that need to go on to that page—and in what order? Having a solid user research foundation at hand will make this process much simpler. In the case of the NCS workshop, the user research had identified cancer prevention as a top user concern, which made it clear that we needed to say something about prevention—sometimes even for cancer types that cannot be prevented.

4. Set forward paths#section8

This last field is key to the core model’s success. After visitors have gotten the answers to their questions, where do we want to send them next? At this point you can allow yourself to think more about business goals in a general sense.

In the case of the lung cancer page, it could be forward paths like:

  • Contacting the cancer help line (so they don’t diagnose themselves)
  • How to prevent all forms of cancer, not just this specific type of cancer
  • Patient rights, if they are reading about treatment
  • Telling users about the political work and lobby work NCS does (e.g. trying to reduce treatment waiting times)

This has to be done in the context of user tasks. If someone is visiting the website in a fearful state, hoping to find solid information about melanoma, do we really want to conclude their journey with a flashy “Donate!” message? Not really—that would just be rude and insensitive, and is unlikely to encourage donations anyway. However, many users do look for general information on cancer research, and in this context, we can frame it more specifically: “If you think cancer research is important, you can help us by donating.” (And in fact, this more considerate approach might end up increasing donations, as it did for us at the NCS.)

The core model handout with additional details filled in, including inward paths, core content, and forward paths.
A filled-out core worksheet.

5. Think mobile to prioritize#section9

After all these steps, participants are usually excited. Their worksheets are full of ideas for content, modules, and all sorts of functionality.

The enthusiasm is great—that’s something we want!—but a worksheet full of discursive ideas is difficult to work with. Are all these things equally important?

That is why the final step in the workshop is to use mobile-first thinking to prioritize all the elements. We give the participants a new sheet and ask them: if you had just a small screen available, in which order would you place the elements you’ve identified throughout the workshop? They’ll also need to place those forward paths they’ve written down in the context of the main content.

A modified version of the core model handout for mobile screens, with narrow columns replacing the large core content field and the forward path fields.
At the final step, participants get new worksheets with narrow columns representing a mobile screen. How would they prioritize their content on such a small screen?
A completed example of the core model handout, modified for thinking about content on mobile screens.
A finished mobile core worksheet from a workshop with the Norwegian Association of the Blind and Partially Sighted.

From core sketches to a finished website#section10

We rarely use wireframes, and you won’t see a photoshop sketch or prototype with lorem ipsum. Why not?

A wireframe says a lot about where something is placed on a page, but it rarely says anything about why it was put there. Because of this, wireframes imply a lot more about what the design could look like than you really want it to in the early stages of design.

The core sketches from our workshop, on the other hand, can be put to good use by any web discipline, because it tells you which elements need to be on which pages, and—just as importantly—why they are there. There really isn’t any web-related discipline I know of whose members shouldn’t care about what needs to be on the page and why.

With interdisciplinary teams, you’re more likely to come up with more innovative ways of solving the user tasks: should it just be text? A video? A quiz? Something completely different?

At Netlife Research, we usually work in close teams of two to four people with a broad combination of skills, such as user research, UX design, graphic design, front end development, and content strategy. At this stage we’re also typically in close collaboration with a work group from the client.

Together, we are able to identify what kind of modules and information we need on the core pages—but the visual design is still flexible at this stage.

Three sketches of a page in mobile view: an early paper sketch, an early Photoshop sketch, and a simple black-and-white HTML and CSS prototype. All sketches used real content, not lorem ipsum.

The next step is to begin content workshops with the organization, using core model thinking and writing in pairs.

Ultimately, we delivered an HTML and CSS prototype with actual content, which (in this case) a subcontractor then developed for the NCS, along with a custom CMS to manage the website and make changes. We also designed several modules tailor-made for common forward paths, which their website editors can place as needed on various pages.

One such forward path module is a box advertising the cancer helpline. This helps the NCS achieve its goal of increasing the use of its services for learning about cancer, and it helps users get answers to their questions.

Screenshot of a page about breast cancer, showing text about causes and prevention on the left, and the cancer helpline box on the right.
The cancer helpline box as used on the page about breast cancer. See our presentation from Confab Central 2014 for more details about this and other forward path modules.


The message gets out to more people#section12

After launch in September 2012, the number of unique visitors on the NCS website has steadily increased each year, despite the fact that the project had no specific activities aimed at search engine optimization. User-focused content goes a long way.

Since the launch of the redesign in September 2012, the number of unique visitors has doubled. Before launch, the number of unique visitors had been steady since 2010.
Unique visitors to the Norwegian Cancer Society’s website. Wondering about those dips in the graph each year? That’s the effect of the (nearly) endless Norwegian summer holidays.

As a welcome side effect of restructuring the website and the content around user tasks, the Norwegian Cancer Society is also now being used as a source by news media more frequently than before.

Forward paths have a huge impact#section13

One example of a forward path is the aforementioned cancer helpline. If you compare the number of cancer helpline conversations in 2013 with the number of conversations the previous seven years, the number of conversations is up 40 percent. Usually, organizations will be looking to decrease the number of calls, but when you’re in the business of informing, it’s a good thing when users reach out. More people at risk of cancer picked up the phone, or entered a chat, or sent an email, and talked to an oncology nurse.

And despite this increase in conversations on the support lines, the oncology nurses tell us they are actually receiving more informed and sophisticated questions than they used to, because more people have already found the answers to their most basic questions on the website.

Since 2006, the number of cancer helpline conversations had been about the same, but in 2013, the year after launch, there was a 40% increase.
The total number of cancer helpline conversations, including email, chat, and phone calls.

Fewer banners, but more donations#section14

The previous NCS homepage had several banners and menu items pointing to different ways of supporting the NCS. Today, there’s just the “Support us” item in the menu, and the banners are gone.

Despite this, the effect on the digital fundraising has been astounding. Comparing numbers from 2011 (a whole year with the old website) with 2013 (a whole year with the new website):

  • The number of one-time donations has tripled (up 198%)
  • The number of regular donors registering each year has quadrupled (up 288%)
  • The total sum from regular donors each year has quintupled(!) (up 382%)

This is not only due to core model thinking, but also continuous improvement of the forms.

This graph shows that the number of regular donors registered online is six times higher in 2014 than in 2011. There has been a steady increase since launch in 2012.
Thanks to continuous improvements, by August 2014 the annual income from regular donors registering online in 2014 had already surpassed the annual income from 2013.

People will do anything on mobile#section15

For several years, we have advocated the idea that people will do anything on mobile, if you just let them. Our work with the NCS is great testament to this way of thinking.

Users spend roughly the same amount of time on the page about lung cancer regardless of which device they are using; while tablet and desktop users spend on average 3 minutes and 48 seconds, smartphone users spend 3 minutes and 57 seconds.

In some forms, conversion rates are actually higher on mobile; in a recent membership campaign, the conversion rate was 7.3 percent on mobile whilst only 2.5 percent on desktop.

Membership conversion rates are 2.5% on desktop, 6.5% on tablet, and 7.3% on mobile.
To become a member, we need the person’s name, address, and birthday. That didn’t stop people from signing up on a smartphone.

From homepage first to homepage last#section16

By devoting your time to the core pages first, you’ll avoid a number of turf battles about menu bar real estate, and enjoy the benefits of getting the whole team united behind the same essential parts of the website. You’ll prove to the team that you care about their content and their users (and, sure, maybe convince them to care a little more about their users, too)—and the end result is a website that knows exactly what it’s about. Next time you’re faced with a compromise-riddled situation where you’re designing a website by committee, give the core model a shot. In my work, it’s been a great way to get down to business and stay on positive terms with the whole team.

35 Reader Comments

  1. Figure 5 is an illustration of a core sheet filled out in english:

    The mobile view is a recent tweak that we’ve done, so I haven’t got an illustration of a filled out view of the mobile version in english, but it would basically just be to take all the info from core contents and forward paths in Figure 5 and then prioritize it in the columns in the mobile view (Figure 6)

    I can check and see if any of my colleagues has an english version laying around!

  2. Great article with a lot of practical info, thanks. I’ve been doing the home page last for awhile now – it usually takes some convincing to get people on board, but most agree it makes lots of sense!

  3. Really recommend the webinar Audun is giving as mentioned by James above 🙂

    @Jennifer Thank you! I rarely make a big point out of doing the home page last, just show them core pages first. We actually have had projects where the client has almost forgotten about the home page.

  4. As the (now former) fundraiser for the NCS on this project, I just want to chime in and say how much this model has truly worked for my work.

    When we did the user research, donations came out at the very bottom of what the users wanted as Ida mentions. I, who had up until then been dreaming of a shiny new webpage where everything would scream “donate”, was naturally quite bummed (this was three years ago, I didn’t know better). But the results we’ve gotten from the new page is beyond anything I had expected – even if fundraising is severely downplayed compared to what it used to be. This I believe is due to the core model approach.

    Really giving each important core page proper focus, making sure that there are always ways forward, has had a huge impact on our digital fundraising. This approach caused us to make our donation forms “portable”, meaning we can stick them on any page we like as a way forward if we think that is the relevant cause of action for someone reading that particular story/article – making the paths to completion as short as possible. The core model really makes collaboration between agency and client much smoother, and the results much better. Highly recommended!

  5. I used these core worksheets with a client yesterday and they worked a treat. Thank you for sharing!

    I can’t grasp the mobile-first one though – is it to prioritise content on a (long) page, or are the “Core content & forward paths” columns for separate pages?

  6. @Peter Yes, you’re right, their for a long page. I agree the template for the mobile view isn’t the most intuitive. We should probably rotate the handout and create one long column instead!

  7. Great content and article! Shared with my team. I also appreciate seeing a nonprofit example — rare to see in web design articles and very helpful! Thanks.

  8. Wonderful article! It’s exactly about what I’m encountering now regarding website update for our company. This article has indeed refreshed my thinking on how business objectives and user needs interact, and how a better website could be presented through design and useful contents. Bravo!

  9. Thanks for this great article Ida! I already use you core content sheet that you shared at the Content Strategy Forum 2013 in Helsinki. I was really impressed than and the case is still very relevant and what a great job you (and we as interaction designers) have reading reaction nr 10 from Beate… that’s what it’s all about!
    What I really love about your method is the thorough and yet also very pragmatic integration of content and interaction design…. bye bye silo’s!
    Thanks again for sharing and looking forward in seeing/hearing you at a next event!

  10. Great post. I think it’s also useful to think about how you’ll know users have met their needs or fulfilled the tasks they set out to complete. So you can plan how to measure success from an early stage.

  11. Great method and thank you for the article – I sat in the audience at #EuroIA in Brussels a few months ago and your talk on that was marvelous. 🙂

  12. Hello Ida! I attended Confab last year and saw your presentation there. I’ve adopted/adapted the Core Model and have been using it since. A few questions for you – how do you handle multiple user types, especially if they would each interact with the same content in different ways? For larger websites, how do you document content that *isn’t* part of the core? I’ve been using spreadsheets (adding on to our content audits). I was just curious as to what your process was.

    @Peter – I updated the 2nd page of the worksheet to include the top and bottom of an iPhone. I thought it made it a little more obvious that you would scroll through the space in between.

  13. @Breanna So glad to see that you’ve been applying the core model! Would love to hear any other improvements you’ve made.

    Regarding different audiences:
    When we establish and prioritize the business goals, we also prioritize the target groups. Part of the prioritization is that we split different audiences in primary and secondary audiences.

    Secondary audiences are people that we know will visit the page, but we won’t tailer the content for them. For instance, it’s not unlikely that nurses or doctors might wind up at the NCS website, but we won’t take that into consideration when we’re writing the content.

    That’s because it was decided that the primary audience was patients and their close ones.

    So basically we chose one target group that we (primarily) tailor the content for.

    Have you got an example of how your different user groups might interact with the same content in different ways? Maybe I could provide a better answer then 🙂

    When it comes to the rest of the content, which aren’t core pages, we usually document it in HTML&CSS; prototype (often built with statamic) where you can browse the menus and information architecture. In smaller projects, it might be documented through a spreadsheet.

  14. Wonderful article! It’s exactly about what I’m encountering now regarding website update for our company. This article has indeed refreshed my thinking on how business objectives and user needs interact, and how a better website could be presented through design and useful contents. I shared it with all my collegues here in Spain and with my / our friends . Keep up the good job!

  15. Very useful article to help facilitate meetings. The sheets make it fun and can keep focus on business goals and content production. “The Core Model: Designing Inside Out for Better Results”

  16. Very interesting. I think it would be even more valuable if you could try to publish this idea scientifically and then relate the work to other work done on this subject. It seems you have some empirical base to validate the benefits of the core page model. This is something I urged Are to work on back in 2007-2008 when discussing the model 😉

  17. An excellent article, great subject, fantastic approach, thank you.
    However, paraphrasing Napoleon, all good web crafting theory will go awry when faced with The Marketing Department.

  18. Amazing method. Really looking forward to incorporating this into our process. One question: do you use the core model alongside, or instead of, other content strategy activities (ie. content inventory, content auditing, content modelling, information architecture)?

    Many thanks Ida!!

  19. This looks like a really cool way to get stakeholders thinking about content goals rather than aesthetics. I’m going to look for a way to implement this with my team. Thanks!

Got something to say?

We have turned off comments, but you can see what folks had to say before we did so.

More from ALA