Pattern Paste
Subscribe

Designed Patterns Features

Everything planNew

Pocket Stories

A phone-led product tour with a turning three-dimensional handset, editable image or video screens and changing scene backgrounds. Add, remove and reorder the native scenes to tell your own product story.

All patterns

Loading patterns…

Designed1280 px

Loading preview…

The section’s original colours and type. Copy this appearance as shown.

About this pattern

Where Pocket Stories fits

Fits an app or product landing page where visitors follow a sequence of features, each paired with its own screen and explanation.

Use it for

  • Mobile app product tour
  • App launch landing page
  • Digital product feature story

What you can edit

Every word, image and link is a WordPress block

Select any of them in the block editor and change it in place. Colours, type and spacing use the blocks’ own controls.

The layout stays protected while you edit. Unlock layout, in the section’s settings, lets you insert, move and remove any block.

  • 3background imagesall required
  • 4headings1 optional
  • 14text linesall optional
  • 1buttonoptional
  • 3itemsAdd item or Remove last item; 1 always stays

Section settings

  • Appearance: Designed or Use my theme
  • Animate changes
  • Unlock layout

How it behaves

It still works when things are switched off

Scroll through scenes, with optional numbered navigation. Position the phone and align text left, centre or right. Motion off keeps the phone still. Use images or videos; clips play on request.

Motion off or reduced motion
It shows its final state at once; anything a visitor can press or drag still works.
JavaScript off
All content stays visible and readable; controls the script adds are hidden.
Plugin missing or older
It pastes as plain WordPress blocks, in reading order, without the designed layout.

Questions

Pocket Stories: common questions

What is Pocket Stories for?

Fits an app or product landing page where visitors follow a sequence of features, each paired with its own screen and explanation. Typical uses: mobile app product tour, app launch landing page and digital product feature story.

Does Pocket Stories need a plugin?

Yes. Designed Patterns come with a subscription, which includes the Pattern Paste plugin that runs them; Pocket Stories arrived in plugin 0.46.0. Without the plugin, or on an older version, it pastes as plain WordPress blocks: the content reads in order, without the designed layout.

What can I edit in Pocket Stories?

As pasted it has 3 background images, 4 headings, 14 text lines and 1 button, 16 of them optional and removable. The items are a repeatable set: the item controls add one or remove the last. The layout stays protected while you edit. Unlock layout, in the section’s settings, lets you insert, move and remove any block.

Will Pocket Stories match my theme?

Choose Designed to keep its own palette and type, or Use my theme to let it follow your theme’s colours and fonts. Either works in any block theme on WordPress 7.0 or later. Choose Use my theme in the preview above to see it follow a theme before you copy.

Can the motion be switched off?

Yes. Turn off Animate changes in the section settings, and visitors who ask their device for reduced motion get the same: the section shows its final state at once and anything they can press or drag still works. With JavaScript off, all content stays visible.

Back to Designed Patterns