🎓 Lesson 11: Slides & the Timeline — Objects, Cue Points & Sync
If the stage answers "where is each thing?", the timeline answers the question that makes Storyline feel alive: "when?" This is the feature PowerPoint never really nailed and the one that unlocks polished, paced, professional slides. Once the timeline clicks, a whole new kind of control opens up — and it clicks faster than you'd expect.
📚 What You'll Learn
By the end of this lesson, you will be able to:
- Place objects on the stage and understand stacking order (z-order)
- Read and edit the timeline — set each object's start time and duration
- Use cue points to sync animations and audio to precise moments
- Add entrance and exit animations tied to the timeline, and tell the timeline apart from layers
⏱️ Estimated Time: 45 minutes
🎯 Project: Build a slide where three objects appear in sequence, add an entrance animation, drop a cue point, and preview the timed reveal.
In This Lesson
🧱 Objects on the Stage & Z-Order
Everything you add to a slide — text boxes, shapes, images, buttons, characters, media — is an object. You place objects on the stage by dragging, and you size and position them just like in PowerPoint. Each object you add also gets its own row, called a track, on the timeline. Objects and timeline tracks are two views of the same thing: one shows where, the other shows when.
When objects overlap, z-order (stacking order) decides which one sits on top. On the timeline, tracks listed higher are drawn on top of tracks below them — so the top track wins visually. You can reorder by dragging tracks up and down, or with "Bring to Front / Send to Back" controls. This matters the moment you layer a caption over an image or a button over a background.
🧠 Mindset
Beginners often try to control timing by deleting and re-adding objects, or by cramming everything onto separate slides. The timeline makes all of that unnecessary — and learning to think in "when," not just "where," is the mental shift that separates a stiff slide from a polished one. You're not learning a gimmick here; you're learning the grammar of motion. Give it one real slide of practice and it will stick.
⏱️ The Timeline: The "When" of Everything
The timeline runs along the bottom of the slide editor. Time flows left to right, marked in seconds. Each object is a horizontal bar on its own track. The bar's left edge is when the object appears (its start time); the bar's length is how long it stays (its duration). Drag the bar to move it in time; drag its edges to make it start later or last longer. A vertical playhead scrubs across so you can preview any moment.
That's genuinely the whole idea. If you want a caption to appear three seconds in, you slide its bar so it starts at the 3-second mark. If you want a title to stay the whole slide, you stretch its bar end to end. Look at the mock-up below: three objects, three different start times, so they reveal one after another.
Figure 1 — The timeline (a simplified mock-up, not a real screenshot): each object's bar sets when it appears and how long it lasts, so the title holds, the body text enters at ~2s, and the Continue button appears near the end.
Here's the concept as a simple flow — think of the playhead sweeping past each object's entry point:
starts (0s)"] --> B["Title shows
at 0s"] B --> C["Body text enters
at ~2s"] C --> D["Cue point
at ~4s"] D --> E["Continue button
appears near end"] E --> F["⏹️ Timeline ends"] style A fill:#bbf7d0,color:#1e293b style B fill:#fde68a,color:#1e293b style C fill:#fde68a,color:#1e293b style D fill:#c7d2fe,color:#1e293b style E fill:#fde68a,color:#1e293b style F fill:#fecaca,color:#1e293b
Figure 2 — The playhead sweeps left to right; each object appears when the playhead reaches its start time.
💡 "Timeline starts" and "timeline ends": these two moments are the most-used events in all of Storyline. "When the timeline starts" is your go-to for setup (play narration, hide something); "when the timeline ends" is perfect for showing a Continue button or auto-advancing. You'll lean on both constantly once we reach triggers in Lesson 13.
📍 Cue Points & Syncing Narration
A cue point is a little marker you drop on the timeline at an exact moment — a labeled "meet me here." Cue points don't do anything on their own; they're reference points you can snap objects and animations to. Add one by pressing the shortcut (often C) while the playhead sits where you want it, or scrub the playhead and drop one from the timeline controls.
Their superpower is syncing narration to on-screen elements. Imagine an audio track where the narrator says "…and here's the third step" at 6.2 seconds. Play the audio, drop a cue point right at that phrase, and now you can make step 3 appear exactly on that word. The result feels choreographed instead of accidental — the hallmark of a professional module.
📖 A quick recipe for synced narration
- Add your audio narration to the slide (Insert → Audio). It becomes a track on the timeline.
- Play it and listen for the moments where the picture should change.
- Drop a cue point at each of those moments.
- Drag each object's bar so it starts on its cue point.
- Preview, and nudge until the words and the visuals land together.
Why this matters: synchronization is the difference between "someone talking over a slideshow" and "a designed experience." Learners rarely notice good timing — they just feel that the module is clear and confident. Cue points are how you buy that feeling cheaply.
✨ Animations Tied to the Timeline
Storyline animations come in two flavors: entrance animations (how an object arrives — fade, wipe, fly in) and exit animations (how it leaves). You add them from the Animations tab. Crucially, an entrance animation plays at the object's start time on the timeline, and an exit animation plays at its end. So the timeline and animations work as a team: the timeline decides when, the animation decides how.
That connection is why timing and motion feel unified in Storyline. Move an object's bar later, and its fade-in automatically happens later too — you never re-time the animation separately. A little restraint goes a long way here: a gentle fade reads as polished, while a slide full of spins and bounces reads as a birthday card.
⚠️ A note on motion and accessibility
Some learners are sensitive to movement, and heavy animation can be distracting or even nausea-inducing. Favor subtle entrances, avoid constant looping motion, and never rely on animation alone to convey meaning. We treat accessibility as first-class in Lesson 19 — but the habit of gentle, purposeful motion starts now.
🥞 Timeline vs. Layers
One point of confusion worth clearing up early: the timeline and slide layers are different tools that beginners sometimes mix up. Here's the clean distinction.
| Timeline | Slide Layers | |
|---|---|---|
| Answers | When objects appear on this slide | What stacked content shows on top of the base slide |
| Best for | Paced reveals, timed sequences, syncing audio | Feedback pop-ups, detail panels, "click to reveal" content |
| Driven by | Time passing (and cue points) | Triggers (show/hide layer) — usually a click |
A quick way to remember it: the timeline is about the flow of time; layers are about the flow of interaction. You'll often use both on one slide — a base timeline that reveals content, plus layers that pop up when the learner clicks. We build layers properly in Lesson 15; for now, just keep the two ideas in separate mental boxes.
🎯 Try It: A Timed Reveal
🏋️ Activity: Make three objects appear in sequence Windows only
Objective: Practice the core timeline skill — controlling when things appear — and add one gentle animation. (Storyline is Windows-only; Mac users work in the VM from Lesson 2. Everything here fits inside the Trial / Paid 30-day trial.)
Steps
- Open a slide and add three objects: a title text box, a body text box, and a shape or button. (⏱️ 4 min)
- Find all three on the timeline as separate tracks. (⏱️ 1 min)
- Drag the body text bar so it starts about 2 seconds in. (⏱️ 2 min)
- Drag the button bar so it starts about 4 seconds in. (⏱️ 2 min)
- Select the body text, go to the Animations tab, and give it a Fade entrance. (⏱️ 2 min)
- Put the playhead at 3 seconds and drop a cue point (try pressing C). (⏱️ 1 min)
- Preview the slide and watch the three objects arrive in order, with the body text fading in. (⏱️ 2 min)
💡 Hint
If everything still appears at once, check that you actually moved the left edge of each bar rather than just shortening it. Zoom the timeline in (there's a zoom slider on the timeline) so the seconds are easier to grab. And if you can't see a Fade happen, make sure you applied an entrance animation, not an exit.
✅ Activity Complete When…
- Your three objects appear one after another when you preview
- At least one object fades in rather than snapping on
- You've placed a cue point on the timeline and can explain what it's for
🎯 Quick Quiz
Question 1: On the timeline, what does an object's bar tell you?
Question 2: What is a cue point mainly used for?
📓 Learning Journal
Keep your Learning Journal going — it's where you turn "I read that" into "I can do that." After each lesson, jot down:
- Key concepts you learned
- Things that clicked for you
- Questions or confusion points to revisit
- Ideas you want to try
- Your progress and how you feel about learning this
✍️ This lesson's prompt: Think of a slide in your capstone topic that would benefit from a timed reveal — where showing everything at once would overwhelm. Sketch, in words, the order things should appear and roughly when. That sketch is your first storyboard for a timed slide.
📝 Lesson Summary
🎓 Key Takeaways
- Every object on the stage gets a track on the timeline; z-order (top track wins) decides what sits on top when things overlap.
- The timeline controls when: a bar's left edge is its start time, its length is its duration. Drag to re-time.
- Cue points mark exact moments so you can sync objects and animations to narration — the trick behind choreographed slides.
- Entrance/exit animations play at an object's timeline start/end. The timeline is about time; slide layers are about interaction — keep them distinct.
🎉 What You've Accomplished
You've met the feature at the heart of Storyline's polish. You can read the timeline, move objects through time, sync a reveal to a cue point, and layer on a gentle animation. That "when" thinking is a genuine craft skill — and you just did it on a real slide. Nicely done.
❓ Common Questions at This Stage
My objects all appear at once — what did I do wrong?
Almost certainly the bars all still start at 0. Drag each object's bar to the right so its left edge sits at a later second. Zoom the timeline in first so the seconds are easy to grab, and double-check you moved the start, not just trimmed the length.
Should I use the timeline or split things across separate slides?
Use the timeline for reveals that belong to one idea or one narration pass — it's smoother and easier to maintain. Split into separate slides when the content is genuinely separate steps the learner should move through at their own pace, especially if each needs its own interaction.
How is a cue point different from just setting a start time?
A start time positions one object. A cue point is a shared, labeled marker that many objects and animations can snap to — so if the narration shifts, you move the cue point once and everything anchored to it moves together. It's a reusable reference, not a per-object setting.
🔭 Looking Ahead
In Lesson 12, we meet the first of the three pillars of interactivity: states — the different visual "looks" an object can wear, and how they make buttons feel alive under the learner's cursor.
✅ Before the Next Lesson
- Keep your timed-reveal slide — it's good practice material for states and triggers next
- Write this lesson's journal prompt: a slide that would benefit from a timed reveal
- Experiment with the timeline zoom control until dragging bars feels comfortable
📚 Additional Resources
- Course Glossary — timeline, cue point, z-order, animation, layer
- Quick-Reference Cheat Sheet — timeline shortcuts and habits
- E-Learning Heroes — timeline tutorials and examples
🌟 Encouragement for the Journey
The timeline is the moment Storyline stops feeling like a slide deck and starts feeling like a stage you direct. You just directed your first scene. Everything expressive you'll ever build sits on top of this skill — and you already have it.