Skip to main content

πŸŽ“ Lesson 10: The Storyline Interface β€” Story View, Scenes, Slides & Panels

Welcome to Part 3 and to Storyline 360 β€” the deep, powerful, custom-interaction side of Articulate. If Rise felt like snapping together polished blocks, Storyline feels like a supercharged PowerPoint with a stopwatch and a wiring panel. Today we don't build much; we orient. Get comfortable with the map and the workshop, and every later lesson will feel like home.

πŸ“š What You'll Learn

By the end of this lesson, you will be able to:

  • Open Storyline and explain how it relates to PowerPoint Windows only
  • Read Story View as the map of your whole project, and tell scenes from slides
  • Name the working parts of the slide editor: the ribbon, stage, Slide Layers, Timeline, Triggers, and Notes
  • Understand slide masters, saving .story files, and using Preview

⏱️ Estimated Time: 40 minutes

🎯 Project: Create your first .story project, add a scene and two slides, drop in a title and a text box, and preview it β€” a gentle first lap around the interface.

In This Lesson

πŸ–₯️ Opening Storyline: A Powered-Up PowerPoint

Storyline 360 is a Windows desktop app Windows only that you launch from the Articulate 360 desktop manager (Mac users: run it in a Windows VM β€” see Lesson 2). When it opens you'll see a start screen: create a New Project, open a recent one, or start from a template. Choose a new blank project and you're in.

The best mental model you can bring is this: Storyline is PowerPoint's talented cousin. You get slides, a ribbon of tabs across the top, shapes and text boxes, transitions, and animations β€” all things you already half-know. But Storyline adds three things PowerPoint can only dream of, and they are the soul of this half of the course:

  • A timeline β€” precise control over when each object appears (Lesson 11).
  • States and triggers β€” objects that change and respond to the learner (Lessons 12–13).
  • Real publishing β€” HTML5 output that runs in a browser and reports to an LMS (Part 4).

🧠 Mindset

The first time you see Storyline's wall of panels, a little voice may whisper "this is too much." It isn't β€” it's just dense, the way a well-stocked kitchen is dense. You don't learn a kitchen by memorizing every drawer; you learn where the knives and the stove are, and the rest reveals itself as you cook. Today we find the knives and the stove. That's the whole job. You are absolutely capable of this.

πŸ—ΊοΈ Story View: The Map of Your Project

Every new project opens in Story View β€” a zoomed-out bird's-eye map of your entire course. Think of it as the table of contents you can see: each slide is a thumbnail, slides are grouped into scenes, and arrows between them show how learners can travel from one place to another (branching). It's where you plan structure and understand flow at a glance.

You'll bounce between two views constantly. Story View is for the big picture β€” adding scenes, arranging slides, seeing branches. Normal View (the slide editor) is for building a single slide up close. Double-click any thumbnail in Story View to drop into Normal View; click the Story View button to zoom back out.

graph TD P["πŸ“ Project (.story file)"] --> S1["🎬 Scene 1
Introduction"] P --> S2["🎬 Scene 2
Main Content"] P --> S3["🎬 Scene 3
Quiz"] S1 --> SL1["πŸ–ΌοΈ Slide 1.1"] S1 --> SL2["πŸ–ΌοΈ Slide 1.2"] S2 --> SL3["πŸ–ΌοΈ Slide 2.1"] S2 --> SL4["πŸ–ΌοΈ Slide 2.2"] SL3 --> O["Objects Β· Layers Β· Triggers"] style P fill:#fed7aa,color:#1e293b style S1 fill:#bfdbfe,color:#1e293b style S2 fill:#bfdbfe,color:#1e293b style S3 fill:#bfdbfe,color:#1e293b style SL1 fill:#fde68a,color:#1e293b style SL2 fill:#fde68a,color:#1e293b style SL3 fill:#fde68a,color:#1e293b style SL4 fill:#fde68a,color:#1e293b style O fill:#f1f5f9,color:#1e293b

Figure 1 β€” The Storyline hierarchy: a project holds scenes, scenes hold slides, and each slide holds objects, layers, and triggers.

πŸ’‘ Slide numbering: Storyline numbers slides by scene, so slide 2.3 means "scene 2, third slide." That numbering shows up everywhere β€” in Story View, in trigger menus, in the publish report β€” so it pays to recognize it early.

🎬 Scenes vs. Slides

The single most useful structural idea in Storyline is the difference between a scene and a slide, and it's refreshingly simple.

Scenes are chapters. A scene is a container that groups related slides β€” an intro, a topic, a quiz. Big courses stay sane because their scenes keep things tidy, and you can jump a learner to the start of a scene as a single destination. Slides are the pages inside a chapter. A slide is where the actual content lives: your text, images, buttons, timeline, layers, and triggers.

πŸ“– A useful analogy

Picture a book. The book is your project (the .story file). The chapters are scenes. The pages are slides. You wouldn't cram a whole book into one chapter, and you wouldn't split one thought across ten chapters β€” the same good judgment applies here. Most short courses live happily in one or two scenes; reach for more scenes when a course grows or when branching gets complex.

Why this matters: good scene structure isn't busywork β€” it's what keeps a large project navigable, makes branching legible in Story View, and gives you clean "jump to this chapter" destinations for menus and triggers. Designers who organize well early save themselves hours of untangling later.

🧰 The Slide Editor, Panel by Panel

Double-click a slide and you land in Normal View β€” the workshop where you'll spend most of your Storyline life. It looks busy, but it's just a handful of well-labeled areas. Here's the whole workspace in one mock-up, then a tour of each part.

Figure 2 β€” The Storyline slide editor (a simplified mock-up, not a real screenshot): ribbon, stage, triggers panel, and timeline.

Here's what each area is for:

πŸ“– The Workspace, Area by Area

The Ribbon β€” the tabbed toolbar across the top. Just like PowerPoint. Key tabs: Insert (text, shapes, images, buttons, characters, media, questions), Slides (add slides, layouts, question slides), Design (themes, colors, slide size), Transitions and Animations (motion), and View (Story View, Normal, Slide Master, and panel toggles).

The Stage β€” the big canvas in the center. This is the slide itself, the rectangle the learner will actually see. You drag, size, and position objects here.

The Slide Layers panel β€” usually bottom-right. Layers are stacked "sub-slides" on top of the base slide, perfect for feedback pop-ups and detail panels. We introduce them fully in Lesson 15; for now, just know the panel is there.

The Timeline β€” along the bottom. It controls when each object appears and for how long. This is the heart of Lesson 11.

The Triggers panel β€” usually on the right. Triggers are the "if this, do that" rules that make things interactive. This is Lesson 13, the engine room.

Slide Notes β€” a tab near the timeline for narration scripts and developer notes; it can also feed an on-screen Notes tab for learners.

πŸ’‘ Lost a panel? If the Triggers, Timeline, or Layers panel ever disappears, don't panic β€” nothing is broken. Look on the View tab (in most versions) for toggles that show and hide each panel. Turning one back on is a single click.

🎨 Masters, Saving & Preview

Slide masters work exactly like they do in PowerPoint: a master slide defines the shared look β€” background, fonts, placeholder positions β€” for the slides built on it. Change the master once and every slide that uses it updates. Storyline also has feedback masters that control the look of the built-in correct/incorrect feedback layers on question slides. You can happily ignore both until you want a consistent custom look; then they save enormous time. Find them on the View tab.

Saving. Storyline projects are single files with a .story extension. Save early and often (Ctrl+S). A few honest habits that save heartache:

  • Save your .story file on your local drive, not directly inside a syncing cloud folder that might lock or corrupt it mid-edit.
  • Keep versioned backups (course-v1.story, course-v2.story) at milestones.
  • The .story file is your source β€” the thing you edit. It is not what learners receive; that comes from Publish (Part 4).

βœ… Preview is your best friend

The stage shows objects sitting still; it can't show timing, states, or triggers actually running. To see the real learner experience, use Preview (on the ribbon). You can preview a single slide, a scene, or the whole project. Get in the habit of previewing constantly β€” it's the fastest way to catch "wait, that's not what I meant" while it's still a five-second fix.

Why this matters: the loop of build a little β†’ preview β†’ adjust is the single most productive habit in Storyline. Authors who preview often build faster and ship fewer bugs than authors who build for an hour and hope.

🎯 Try It: Your First Project

πŸ‹οΈ Activity: A first lap around the interface Windows only

Objective: Create a real .story project and touch every major part of the interface once β€” no pressure to make it good, just to make it exist. (Storyline runs on Windows; Mac users, use your VM from Lesson 2. Everything here fits inside the Trial / Paid 30-day trial.)

Steps

  1. Launch Storyline 360 and choose New Project. You'll land in Story View. (⏱️ 2 min)
  2. You'll see one slide in Scene 1. Add a second scene: right-click in Story View (or use the New Scene control) and add Scene 2. (⏱️ 2 min)
  3. In Scene 1, add a second slide so the scene has two slides. Notice the numbers become 1.1 and 1.2. (⏱️ 2 min)
  4. Double-click slide 1.1 to open Normal View. On the Insert tab, add a text box for a title and type something. (⏱️ 3 min)
  5. Add a second text box with a line of body text. Notice both objects now appear as tracks on the Timeline at the bottom. (⏱️ 2 min)
  6. Save your project as my-first.story with Ctrl+S. (⏱️ 1 min)
  7. Click Preview and watch your slide play. Close the preview to return. (⏱️ 2 min)
πŸ’‘ Hint

Can't find a panel? Check the View tab for toggles that show the Timeline, Triggers, and other panels. And if the interface feels cramped, Story View and Normal View both have a zoom control in the corner β€” bump it up so you can see comfortably.

βœ… Activity Complete When…

  • You have a saved .story file with two scenes and at least three slides total
  • Slide 1.1 has two text boxes, and you can see them as tracks on the Timeline
  • You've previewed the slide and returned to the editor without confusion

🎯 Quick Quiz

Question 1: In Storyline, what is the relationship between scenes and slides?

Question 2: Which view gives you the zoomed-out map of your whole project?

πŸ““ 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: Storyline has a lot of panels. Which one are you most curious about, and which one feels most intimidating right now? Name them both β€” then come back after Lesson 13 and notice how much the intimidating one has shrunk.

πŸ“ Lesson Summary

πŸŽ“ Key Takeaways

  • Storyline 360 is a Windows-only desktop app that feels like a powered-up PowerPoint, with a timeline, states/triggers, and real publishing.
  • Story View is the zoomed-out map of the whole project; Normal View is the close-up slide editor β€” you'll switch between them constantly.
  • Scenes are chapters that group slides; slides hold the content (objects, layers, triggers). Slides are numbered by scene, like 2.3.
  • The slide editor's main areas are the ribbon, stage, Slide Layers, Timeline, Triggers, and Notes. Projects save as .story files; Preview shows the real experience.

πŸŽ‰ What You've Accomplished

You've stepped into the deep end of Articulate and found it's shaped like something you already know. You can read the project map, tell a scene from a slide, name every panel in the workshop, and you've saved and previewed your very first .story file. That orientation is the hard part β€” from here, we build.

❓ Common Questions at This Stage

I'm on a Mac β€” can I do these Storyline lessons?

Yes, but Storyline itself only runs on Windows, so you'll use the Windows virtual machine we set up in Lesson 2 (Parallels, VMware, or similar). Everything in Part 3 assumes you're working inside that Windows environment. Rise, by contrast, ran in any browser.

Do I need a lot of scenes for a small course?

Not at all. A short course is perfectly happy in a single scene. Reach for more scenes when a course grows large, when you want clean "jump to this chapter" destinations, or when branching is getting hard to read in Story View. Structure should serve clarity, not the other way around.

Is the .story file what I give to learners?

No β€” the .story file is your editable source, like a Word document. Learners receive the published HTML5 output, which you generate in Part 4. Keep your .story file safe and backed up; it's the master you'll return to whenever you need to make changes.

πŸ”­ Looking Ahead

In Lesson 11, we zoom into a single slide and meet the timeline in earnest β€” how to control exactly when each object appears, and how to sync narration with what's on screen.

βœ… Before the Next Lesson

  • Keep your my-first.story file β€” we'll build on this kind of slide next
  • Write this lesson's journal prompt: your most curious and most intimidating panel
  • Toggle the Timeline, Triggers, and Layers panels off and on from the View tab so their location sticks

πŸ“š Additional Resources

🌟 Encouragement for the Journey

You just opened the tool that intimidates most beginners β€” and it turned out to be a workshop with clearly labeled drawers. That's how the whole of Storyline goes: dense, never mysterious. You've got the map now. Let's start building on it.