trainrs · the learner’s home

Twenty ways to lay out the learner’s home.

The same learner on every one: Priya Shah at Meridian Care, on Tuesday 2 February, in week 5 of 8. Each sketch shows the shape of the page; the four marked ★ open as full-size pages you can click through.

Whichever we choose, the home must

  • show what’s outstanding: how many things, the most important one with its button, and a way to see them all;
  • show what’s coming up: the next session, its date and how to join;
  • show where they are in the eight weeks;
  • offer a way to contact someone: raise your hand, or the AI coach;
  • reach their profile and how they sign in.

Time-led

The calendar decides what comes first.

  • 1Today, tomorrow, later

    At the top:
    What to do today in the green block, then tomorrow, then everything else before Thursday.
    Feels like:
    A calm to-do app, like Things. Nothing is out of order.
    Right when:
    People fit the course around meetings and want to know what’s due first.
    Watch out:
    Most days “Today” is empty; a task sent back can end up under “Later”.

  • 2The eight Thursdays

    At the top:
    A strip of the eight session dates, today marked between the fourth and the fifth.
    Feels like:
    A wall calendar. You always know which Thursday is next.
    Right when:
    The live session is the heartbeat and everything hangs off it.
    Watch out:
    Eight dates squeeze on a phone; it has to shrink to “Thursday 4 Feb · session 5 of 8”.

  • 3Countdown

    At the top:
    “2 days, 4 hours” to session 5, large, with this week’s picture beside it.
    Feels like:
    The days before a trip. Gently urgent.
    Right when:
    The main risk is turning up to the session unprepared.
    Watch out:
    A ticking clock can feel like pressure, and it says nothing about work sent back.

Action-led

What you have to do decides the page.

  • 4One thing

    At the top:
    “Good afternoon, Priya.”, then two big picture cards: this week’s session and your next task.
    Feels like:
    A friendly front door. Big pictures, one clear next step.
    Right when:
    People open it with five minutes to spare and want to be pointed somewhere.
    Watch out:
    Two cards side by side is the limit; a third box and it turns back into a dashboard.

  • 5The whole-course checklist

    At the top:
    How many are done, then every task for all eight weeks, by week, with its state in words.
    Feels like:
    A GOV.UK form. Plain, complete, nothing hidden.
    Right when:
    Learners want to see the whole job and tick it off.
    Watch out:
    Forty rows on the home page is exactly the clutter we just took out.

  • 6Three columns

    At the top:
    Three columns: To do · With Johnnie · Done. Cards move across as you hand in.
    Feels like:
    A project board, like Linear or Trello.
    Right when:
    Knowing what’s waiting on the tutor matters as much as what’s waiting on you.
    Watch out:
    Three columns don’t fit a phone, and boards are unfamiliar to many learners.

  • 7Workbench

    At the top:
    The hand-in box for the task you’re on, with Johnnie’s note above it, ready to type.
    Feels like:
    Opening your laptop where you left off.
    Right when:
    Most visits are to hand something in.
    Watch out:
    If the wrong task is open the whole page is wrong, and there’s little room for what’s coming.

  • 8Three sentences

    At the top:
    Three lines, each a link: “Next: …”, “Thursday: …”, “So far: …”. Nothing else.
    Feels like:
    A note on the fridge. The calmest page possible.
    Right when:
    You trust the rest of the app to hold the detail.
    Watch out:
    No room for a second urgent thing; help and your profile live only in the header.

Journey-led

Where you are in the eight weeks decides the page.

  • 9The path is the home (has a full-size page)

    At the top:
    The eight weeks running down the page; week 5 is open with its tasks and its picture.
    Feels like:
    A journey you’re on rather than a dashboard. Our signature, made the whole page.
    Right when:
    The shape of the course is what keeps people going.
    Watch out:
    Work sent back from week 3 sits further up the path and is easy to scroll past.
    Open the full-size page

  • 10Contents page

    At the top:
    “Contents”: eight chapters with their pictures as plates, and a bookmark on chapter 5.
    Feels like:
    Opening a good book. Quiet and literary.
    Right when:
    The course should feel like something you read through, in order.
    Watch out:
    Books don’t ask you for anything; outstanding work needs its own line.

  • 11This week’s chapter (has a full-size page)

    At the top:
    This week’s picture, wide, with “Data, reports and forecasts” written over its cream side.
    Feels like:
    A magazine opening. Every Thursday feels new.
    Right when:
    You want each week to feel like an event.
    Watch out:
    The picture takes the top of the screen; the one thing to do must still sit right under it.
    Open the full-size page

  • 12The winding map

    At the top:
    A route winding down the page with the week pictures as scenery and you as a marker.
    Feels like:
    Duolingo’s path. Playful.
    Right when:
    Learners need encouragement more than information.
    Watch out:
    It edges towards the games and streaks the brief rules out, and it’s hard to make accessible.

Evidence-led

What you’ve built up decides the page.

  • 13The hours dial (has a full-size page)

    At the top:
    “Well on your way.” beside a dial filling towards 90 hours, then the three ways to add to it.
    Feels like:
    A fitness ring, like Oura. Progress you can see filling.
    Right when:
    Hours are what the funding and the certificate depend on.
    Watch out:
    Hours can start to feel like the point, rather than the work.
    Open the full-size page

  • 14Portfolio

    At the top:
    What you’ve made, as cards with the week pictures; empty frames show what comes next.
    Feels like:
    Your own gallery. Proud of the work.
    Right when:
    Pride in what you’ve made is the reason to keep going.
    Watch out:
    Things to do hide behind the gallery.

  • 15Skills map first

    At the top:
    The three government units, each with a bar showing how far the course has covered it.
    Feels like:
    A school report. Serious and official.
    Right when:
    The learner, or their employer, mainly cares about the qualification.
    Watch out:
    Unit wording is jargon to most learners, and tasks become an afterthought.

  • 16What’s between you and the certificate

    At the top:
    Four steps to finish: tasks accepted, checks passed, the end scan, your confirmation.
    Feels like:
    A finishing line in sight.
    Right when:
    Late in the course, or for anyone worried about finishing.
    Watch out:
    In week one everything says “not yet” and the end feels far away.

People-led

The people on the course decide the page.

  • 17Messages from Johnnie (has a full-size page)

    At the top:
    Johnnie’s latest reply, with your hand-in as the reply box right under it.
    Feels like:
    A conversation with your tutor, not a system.
    Right when:
    The relationship with the tutor is what gets the work done.
    Watch out:
    Work nobody has written about (prep, checks) can get lost in the feed.
    Open the full-size page

  • 18A weekly letter

    At the top:
    A written note from Johnnie, “Hello Priya, this week…”, with the links in the text.
    Feels like:
    A personal letter. Warm and human.
    Right when:
    Someone will really write it every week.
    Watch out:
    Links buried in prose are what the design rule bans, and it’s slow to scan.

  • 19Your cohort

    At the top:
    Who’s handed in this week, Johnnie’s office hours and the session room.
    Feels like:
    A small class. Social, with no leaderboard.
    Right when:
    People are spurred on by seeing others do it.
    Watch out:
    Showing who’s handed in can embarrass whoever is behind; it needs care.

Layout-led

The screen shape decides the page.

  • 20Two panes

    At the top:
    The course path down the left, always in view; what’s happening now on the right.
    Feels like:
    Email on a desktop. Everything in its place.
    Right when:
    Most learners use a laptop at work.
    Watch out:
    On a phone it folds into one of the other directions; two areas compete for the eye.

Invented data throughout. The sketches are drawn at one size so you compare shapes, not detail. Pictures are the eight week illustrations.